/* CSS Reset */

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
}

body {
  font-family:
    -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell',
    'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'Microsoft YaHei', sans-serif;
  font-size: var(--font-size-base);
  line-height: var(--line-height-base);
  color: var(--text-regular);
  background-color: var(--bg-page);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

#app {
  height: 100%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  font-weight: 600;
  color: var(--text-primary);
}

p {
  margin: 0;
}

a {
  color: var(--primary-color);
  text-decoration: none;
  transition: color var(--transition-fast);
}

a:hover {
  color: var(--primary-color);
  opacity: 0.8;
}

ul,
ol {
  list-style: none;
  margin: 0;
  padding: 0;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}

button {
  border: none;
  background: none;
  cursor: pointer;
  padding: 0;
  font: inherit;
}

input,
textarea,
select {
  font: inherit;
  color: inherit;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}
/* CSS 变量定义 */

:root {
  /* 主题色 */
  --primary-color: #409eff;
  --success-color: #67c23a;
  --warning-color: #e6a23c;
  --danger-color: #f56c6c;
  --info-color: #909399;

  /* 文本颜色 */
  --text-primary: #303133;
  --text-regular: #606266;
  --text-secondary: #909399;
  --text-placeholder: #c0c4cc;

  /* 边框颜色 */
  --border-base: #dcdfe6;
  --border-light: #e4e7ed;
  --border-lighter: #ebeef5;
  --border-extra-light: #f2f6fc;

  /* 背景色 */
  --bg-base: #ffffff;
  --bg-page: #f2f3f5;
  --bg-overlay: rgba(0, 0, 0, 0.7);

  /* 间距 */
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 12px;
  --spacing-lg: 16px;
  --spacing-xl: 24px;
  --spacing-xxl: 32px;

  /* 圆角 */
  --radius-sm: 2px;
  --radius-base: 4px;
  --radius-lg: 8px;
  --radius-xl: 12px;
  --radius-round: 20px;
  --radius-circle: 50%;

  /* 阴影 */
  --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
  --shadow-base: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.12);

  /* 过渡 */
  --transition-fast: 0.15s;
  --transition-base: 0.3s;
  --transition-slow: 0.5s;

  /* 布局 */
  --header-height: 60px;
  --aside-width: 220px;
  --footer-height: 40px;

  /* 字体 */
  --font-family-base:
    -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell',
    'Fira Sans', 'Droid Sans', 'Helvetica Neue', 'Microsoft YaHei', sans-serif;
  --el-font-family: var(--font-family-base);
  --font-size-xs: 12px;
  --font-size-sm: 13px;
  --font-size-base: 14px;
  --font-size-lg: 16px;
  --font-size-xl: 18px;
  --font-size-xxl: 20px;

  /* 行高 */
  --line-height-base: 1.5;
  --line-height-lg: 1.8;

  /* z-index */
  --z-index-base: 1;
  --z-index-dropdown: 1000;
  --z-index-fixed: 1010;
  --z-index-dialog: 2000;
  --z-index-popover: 2010;
  --z-index-message: 3000;
}
/**
 * 基础样式 - 通用工具类和 Mixins
 */

/* ==================== Flexbox 布局 ==================== */

.flex {
  display: flex;
}

.flex-center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.flex-between {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.flex-column {
  display: flex;
  flex-direction: column;
}

/* ==================== 文本处理 ==================== */

.text-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.text-muted {
  color: var(--text-secondary);
  font-size: var(--font-size-sm);
}

/* ==================== 间距工具类 ==================== */

.gap-4 {
  gap: 4px;
}
.gap-8 {
  gap: 8px;
}
.gap-12 {
  gap: 12px;
}
.gap-16 {
  gap: 16px;
}
.gap-24 {
  gap: 24px;
}

.mt-8 {
  margin-top: 8px;
}
.mt-16 {
  margin-top: 16px;
}
.mt-24 {
  margin-top: 24px;
}

.mb-8 {
  margin-bottom: 8px;
}
.mb-16 {
  margin-bottom: 16px;
}
.mb-24 {
  margin-bottom: 24px;
}

/* ==================== 状态颜色 ==================== */

.status-success {
  color: var(--success-color);
}
.status-warning {
  color: var(--warning-color);
}
.status-danger {
  color: var(--danger-color);
}
.status-info {
  color: var(--info-color);
}

/* ==================== 动画 ==================== */

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes slideIn {
  from {
    transform: translateY(-10px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fade-in {
  animation: fadeIn var(--transition-base) ease-in;
}
.slide-in {
  animation: slideIn var(--transition-base) ease-out;
}

/* ==================== 响应式工具类 ==================== */

@media (max-width: 768px) {
  .mobile-hidden {
    display: none !important;
  }
}

@media (min-width: 769px) {
  .desktop-hidden {
    display: none !important;
  }
}

/* 表格列响应式隐藏 */
@media (max-width: 1200px) {
  .col-xl-hide {
    display: none;
  }
}

@media (max-width: 960px) {
  .col-lg-hide {
    display: none;
  }
  .col-md-hide {
    display: none;
  }
}

@media (max-width: 640px) {
  .col-sm-hide {
    display: none;
  }
}

/* ==================== 滚动条美化 ==================== */

.custom-scrollbar::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
  background-color: var(--border-base);
  border-radius: var(--radius-base);
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background-color: var(--text-secondary);
}

.custom-scrollbar::-webkit-scrollbar-track {
  background-color: var(--bg-page);
}
/**
 * 布局样式 - Dashboard 布局和标签页
 */

/* ==================== Dashboard 布局 ==================== */

.dashboard-layout {
  position: relative;
  min-height: 100vh;
  background: radial-gradient(circle at 20% 20%, #f4f7ff 0%, #ecf1ff 45%, #e4ebff 100%);
  overflow: hidden;
}

.dashboard-layout::before,
.dashboard-layout::after {
  content: '';
  position: absolute;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  filter: blur(120px);
  opacity: 0.45;
  z-index: 0;
}

.dashboard-layout::before {
  top: -160px;
  right: -120px;
  background: #9cb4ff;
}

.dashboard-layout::after {
  bottom: -180px;
  left: -80px;
  background: #b8d4ff;
}

.dashboard-layout > .el-container,
.dashboard-header,
.dashboard-aside,
.dashboard-main,
.dashboard-footer {
  position: relative;
  z-index: 1;
}

/* ==================== 头部 ==================== */

.dashboard-header {
  height: var(--header-height);
  padding: 0 var(--spacing-xl);
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.55));
  backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(236, 242, 255, 0.75);
  box-shadow: var(--shadow-lg);
}

.dashboard-header .brand {
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
  font-size: var(--font-size-xxl);
  font-weight: 700;
  letter-spacing: 0.6px;
  color: var(--text-primary);
}

.header-actions {
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
  flex-wrap: nowrap;
  justify-content: flex-end;
}

.header-actions .el-input__wrapper {
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.75);
  border: 1px solid transparent;
  box-shadow: inset 0 0 0 1px rgba(116, 131, 255, 0.12);
}

.header-actions .el-input {
  flex: 1 1 160px;
  min-width: 160px;
}

.header-actions .el-button {
  border-radius: 999px;
  background: linear-gradient(135deg, #5c7cfa, #7a5cff);
  border: none;
  box-shadow: 0 10px 18px rgba(92, 124, 250, 0.28);
  flex-shrink: 0;
}

/* ==================== 用户信息 ==================== */

.user-info {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  background: rgba(255, 255, 255, 0.7);
  border: 1px solid rgba(116, 131, 255, 0.18);
  border-radius: 999px;
  flex: 0 1 400px;
  max-width: 400px;
  flex-shrink: 0;
  transition: all var(--transition-fast) ease;
}

.user-info:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(92, 124, 250, 0.18);
  border-color: rgba(116, 131, 255, 0.28);
}

.user-info .avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: linear-gradient(135deg, #5c7cfa, #8e66ff);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 14px;
  box-shadow: 0 6px 12px rgba(92, 124, 250, 0.25);
}

.user-info .name {
  font-size: 14px;
  font-weight: 600;
  color: #1f2f4d;
  max-width: 120px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.user-info .roles {
  display: flex;
  gap: 5px;
  flex-wrap: nowrap;
  align-items: center;
  max-width: 210px;
}

.user-info .role-chip {
  font-size: 12px;
  padding: 2px 10px;
  border-radius: 999px;
  background: rgba(92, 124, 250, 0.12);
  color: #4050b7;
  border: 1px solid rgba(92, 124, 250, 0.24);
  white-space: nowrap;
}

/* ==================== 侧边栏 ==================== */

/* Naive UI 侧边栏 trigger 按钮 z-index 修复 */
.n-layout-sider .n-layout-toggle-button {
  z-index: 10;
}

.dashboard-aside {
  width: 230px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.8));
  border-right: 1px solid rgba(220, 229, 255, 0.8);
  box-shadow: 0 18px 36px rgba(80, 96, 156, 0.08);
  padding: 22px 0;
}

.aside-menu {
  border-right: none;
  background: transparent;
  padding: 0 14px;
}

.aside-menu .el-menu-item,
.aside-menu .el-sub-menu__title {
  border-radius: 10px;
  margin: 2px 6px;
  height: 44px;
  line-height: 44px;
  font-weight: 500;
  color: #5b6782;
  transition:
    background 0.2s ease,
    color 0.2s ease;
}

.aside-menu .el-menu-item:hover,
.aside-menu .el-sub-menu__title:hover {
  background: rgba(92, 124, 250, 0.12);
  color: #4458c5;
}

.aside-menu .el-menu-item.is-active {
  color: #fff;
  background: linear-gradient(135deg, #5c7cfa, #8e66ff);
  box-shadow: 0 12px 24px rgba(100, 118, 255, 0.25);
}

/* ==================== 主内容区 ==================== */

.dashboard-main {
  flex: 1;
  padding: 0;
  background: transparent;
  display: flex;
  flex-direction: column;
}

.main-content {
  flex: 1;
  padding: 28px;
  overflow: auto;
}

/* ==================== 页脚 ==================== */

.dashboard-footer {
  text-align: center;
  padding: 20px 16px;
  font-size: 13px;
  color: #7a859f;
  background: transparent;
}

/* ==================== 标签页 ==================== */

.tags-view-container {
  width: 100%;
  height: 40px;
  overflow: hidden;
  background: #f5f7fa;
  border-bottom: 1px solid #e4e7ed;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
  flex-shrink: 0;
}

.tags-view-wrapper {
  display: flex;
  padding: 0 16px;
  height: 40px;
  align-items: center;
}

.tags-view-item {
  display: inline-flex;
  align-items: center;
  height: 28px;
  margin-right: 6px;
  padding: 0 14px;
  font-size: 13px;
  color: #495060;
  background: #fff;
  border: 1px solid #e4e7ed;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.25s ease;
  white-space: nowrap;
}

.tags-view-item:hover {
  color: #409eff;
  border-color: #c6e2ff;
  background: #ecf5ff;
}

.tags-view-item.active {
  background: #409eff;
  color: #fff;
  border-color: #409eff;
  box-shadow: 0 2px 4px rgba(64, 158, 255, 0.2);
}

.tags-view-item.active::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #fff;
  margin-right: 5px;
}

.tag-close {
  margin-left: 6px;
  font-size: 12px;
  border-radius: 50%;
  padding: 2px;
  transition: all 0.2s;
}

.tag-close:hover {
  background: rgba(0, 0, 0, 0.15);
}

/* ==================== 退出按钮 ==================== */

.logout-btn {
  border-radius: 999px;
  background: linear-gradient(135deg, #ff6b6b 0%, #ff9f66 100%);
  color: #fff;
  border: none;
  padding: 0 14px;
  font-weight: 600;
  box-shadow: 0 10px 18px rgba(255, 107, 107, 0.28);
  transition: all var(--transition-fast) ease;
}

.logout-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 26px rgba(255, 107, 107, 0.35);
}

.logout-btn.is-plain,
.logout-btn.el-button--danger.is-plain {
  background: linear-gradient(135deg, #ff6b6b 0%, #ff9f66 100%) !important;
  color: #fff !important;
  border: none !important;
}

/* ==================== 响应式 ==================== */

@media (max-width: 1280px) {
  .dashboard-aside {
    width: 208px;
  }
}

@media (max-width: 1024px) {
  .dashboard-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    height: auto;
    padding: 18px;
  }

  .dashboard-aside {
    display: none;
  }

  .header-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .user-info {
    padding: 6px 8px;
    gap: 6px;
  }

  .user-info .avatar {
    width: 24px;
    height: 24px;
    font-size: 12px;
  }
}
/* =================================================================
   Common Page Layout - Modern Style
   现代风格的页面布局和组件样式
   ================================================================= */

/* 页面基础容器 */
.page-container {
  padding: 16px;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: transparent;
}

/* 页面头部 */
.page-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  flex-shrink: 0;
}

.page-header .header-left {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* 返回按钮 */
.page-header .header-left > .n-button:first-child {
  width: 32px;
  height: 32px;
  border-radius: 6px;
  background-color: #ffffff;
  border: 1px solid #dee0e3;
  transition: all 0.15s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.page-header .header-left > .n-button:first-child:hover {
  background-color: #f0f1f2;
  border-color: #c9cdd4;
}

.page-header .header-left > .n-button:first-child .n-icon {
  font-size: 16px;
  color: #646a73;
}

.page-title {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
  color: #1f2329;
}

.page-header .header-actions {
  display: flex;
  gap: 8px;
}

/* =================================================================
   Glass List Card - 列表卡片
   ================================================================= */
.glass-list-card {
  border-radius: 12px !important;
  border: 1px solid rgba(222, 224, 227, 0.6) !important;
  background-color: rgba(255, 255, 255, 0.85) !important;
  backdrop-filter: blur(12px);
  box-shadow: none !important;
  flex: 1;
  min-height: 0;
  display: flex !important;
  flex-direction: column;
  overflow: hidden;
}

.glass-list-card > .n-card__content {
  flex: 1;
  min-height: 0;
  padding: 0 !important;
}

.glass-list-card > .n-card-header {
  padding: 14px 20px !important;
  font-weight: 500;
  background-color: rgba(248, 249, 250, 0.8);
  border-bottom: 1px solid rgba(240, 241, 242, 0.8);
}

/* =================================================================
   Glass Card - 通用卡片
   ================================================================= */
.glass-card {
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.85) !important;
  backdrop-filter: blur(12px);
  border: 1px solid rgba(222, 224, 227, 0.6) !important;
  box-shadow: none !important;
  transition: border-color 0.15s ease;
}

.glass-card:hover {
  border-color: rgba(201, 205, 212, 0.8) !important;
}

/* =================================================================
   Card Header Wrapper - 卡片头部工具栏
   ================================================================= */
.card-header-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  flex-wrap: wrap;
  gap: 12px;
}

.card-header-wrapper .n-input,
.card-header-wrapper .n-base-selection,
.card-header-wrapper .n-base-selection-label,
.card-header-wrapper .n-date-picker {
  background-color: rgba(255, 255, 255, 0.7) !important;
  border-radius: 6px !important;
  border-color: rgba(222, 224, 227, 0.6) !important;
}

.card-header-wrapper .n-date-picker .n-input {
  background-color: transparent !important;
}

.card-header-wrapper .n-input:hover,
.card-header-wrapper .n-base-selection:hover,
.card-header-wrapper .n-date-picker:hover {
  border-color: rgba(201, 205, 212, 0.8) !important;
  background-color: rgba(255, 255, 255, 0.9) !important;
}

.card-header-wrapper .n-input:focus-within,
.card-header-wrapper .n-base-selection--active {
  border-color: #3370ff !important;
}

/* =================================================================
   Glass Table Styles - 表格样式
   ================================================================= */
.glass-list-card .n-data-table .n-data-table-th {
  background-color: rgba(100, 106, 115, 0.08) !important;
  font-weight: 600;
  color: #1f2329;
  border-bottom: 1px solid rgba(100, 106, 115, 0.15) !important;
  font-size: 13px;
  text-transform: none;
  letter-spacing: normal;
}

.glass-list-card .n-data-table .n-data-table-td {
  background-color: rgba(255, 255, 255, 0.7) !important;
  transition: background-color 0.15s ease;
  border-bottom: 1px solid rgba(240, 241, 242, 0.6) !important;
  color: #1f2329;
  font-size: 13px;
}

/* 悬停高亮 */
.glass-list-card .n-data-table .n-data-table-tr:hover .n-data-table-td {
  background-color: rgba(100, 106, 115, 0.06) !important;
}

/* 表格变量 */
.glass-list-card .n-data-table {
  --n-th-color: rgba(100, 106, 115, 0.08) !important;
  --n-td-color: rgba(255, 255, 255, 0.7) !important;
  --n-border-color: rgba(240, 241, 242, 0.6) !important;
  --n-th-text-color: #1f2329 !important;
}

/* 选中行 */
.glass-list-card .n-data-table .n-data-table-tr--selected .n-data-table-td {
  background-color: rgba(51, 112, 255, 0.1) !important;
}

/* 表格边框 */
.glass-list-card .n-data-table-wrapper {
  border: none !important;
  border-radius: 0;
  overflow: hidden;
}

.glass-list-card .n-data-table-base-table-header,
.glass-list-card .n-data-table-base-table-body,
.glass-list-card .n-data-table-base-table {
  border-left: none !important;
  border-right: none !important;
  border-top: none !important;
}

.glass-list-card .n-data-table {
  border: none !important;
}

.glass-list-card .n-data-table .n-data-table-tr {
  border-left: none !important;
  border-right: none !important;
}

.glass-list-card .n-data-table .n-data-table-th:first-child,
.glass-list-card .n-data-table .n-data-table-td:first-child {
  border-left: none !important;
}

.glass-list-card .n-data-table .n-data-table-th:last-child,
.glass-list-card .n-data-table .n-data-table-td:last-child {
  border-right: none !important;
}

.glass-list-card .n-data-table thead,
.glass-list-card .n-data-table tbody {
  border-left: none !important;
  border-right: none !important;
}

/* 列分隔线 */
.glass-list-card .n-data-table .n-data-table-th,
.glass-list-card .n-data-table .n-data-table-td {
  border-right: none;
}

/* 分页 */
.list-pagination {
  padding: 12px 16px;
  background-color: rgba(255, 255, 255, 0.7);
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  border-top: 1px solid rgba(240, 241, 242, 0.6);
}

.glass-list-card > .n-card__content > .n-data-table > .n-data-table__pagination {
  padding: 12px 16px;
  background-color: rgba(255, 255, 255, 0.7);
  justify-content: flex-end;
  border-top: 1px solid rgba(240, 241, 242, 0.6);
}

/* =================================================================
   Detail Section - 详情区块
   ================================================================= */
.detail-section {
  margin-bottom: 20px;
  padding: 16px;
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(12px);
  border-radius: 12px;
  border: 1px solid rgba(222, 224, 227, 0.6);
}

.section-title {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 16px;
  color: #1f2329;
  padding-left: 10px;
  border-left: 3px solid #3370ff;
  line-height: 1;
}

/* =================================================================
   Info Item - 信息项
   ================================================================= */
.info-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px;
  background: #f8f9fa;
  border-radius: 6px;
}

.info-item .label {
  font-size: 12px;
  color: #8f959e;
  font-weight: 400;
}

.info-item .value {
  font-size: 14px;
  color: #1f2329;
  font-weight: 500;
}

/* =================================================================
   Card Header - 卡片头部
   ================================================================= */
.card-header {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 600;
  color: #1f2329;
}

.card-header-icon {
  font-size: 18px;
  color: #3370ff;
  padding: 6px;
  background: rgba(51, 112, 255, 0.1);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.card-header-icon.info {
  color: #3370ff;
  background: rgba(51, 112, 255, 0.1);
}

.card-header-icon.success {
  color: #34c724;
  background: rgba(52, 199, 36, 0.1);
}

.card-header-icon.warning {
  color: #ff7d00;
  background: rgba(255, 125, 0, 0.1);
}

.card-header-icon.danger {
  color: #f54a45;
  background: rgba(245, 74, 69, 0.1);
}

/* =================================================================
   Loading & Empty States
   ================================================================= */
.loading-state {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 40px 0;
}

.loading-wrap {
  display: flex;
  justify-content: center;
  padding: 24px;
}

.empty-state {
  padding: 40px 0;
}

.empty-list {
  text-align: center;
  padding: 24px;
  color: #8f959e;
  font-size: 13px;
}

/* =================================================================
   Count Badge
   ================================================================= */
.item-count,
.role-count,
.user-count,
.log-count {
  font-size: 13px;
  color: #8f959e;
  margin-right: 8px;
}

/* =================================================================
   Custom Scrollbar
   ================================================================= */
.custom-scrollbar::-webkit-scrollbar {
  width: 6px;
}

.custom-scrollbar::-webkit-scrollbar-track {
  background: transparent;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
  background: #c9cdd4;
  border-radius: 3px;
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background: #8f959e;
}

/* =================================================================
   Split Container - 分栏布局
   ================================================================= */
.split-container {
  display: flex !important;
  flex-direction: row !important;
  overflow: hidden;
  padding: 0 !important;
}

/* =================================================================
   Tree Panel - 树形面板
   ================================================================= */
.tree-panel {
  width: 280px;
  border-right: 1px solid rgba(222, 224, 227, 0.6);
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.8);
}

.panel-header {
  padding: 12px 16px;
  display: flex;
  gap: 10px;
  align-items: center;
  border-bottom: 1px solid rgba(240, 241, 242, 0.6);
  background: rgba(255, 255, 255, 0.5);
}

.panel-body {
  flex: 1;
  overflow-y: auto;
  padding: 12px;
}

.panel-footer {
  padding: 12px 16px;
  background: rgba(248, 249, 250, 0.8);
  border-top: 1px solid rgba(240, 241, 242, 0.6);
}

/* =================================================================
   Detail Panel - 详情面板
   ================================================================= */
.detail-panel {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
  background: transparent;
}

.detail-header {
  padding: 20px 24px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  background: rgba(255, 255, 255, 0.8);
  border-bottom: 1px solid rgba(240, 241, 242, 0.6);
}

.detail-scroll {
  flex: 1;
  overflow-y: auto;
  padding: 20px 24px;
}

.detail-empty {
  margin: auto;
}

/* =================================================================
   Icon Box
   ================================================================= */
.icon-box {
  background: #f8f9fa;
  padding: 10px;
  border-radius: 8px;
  border: 1px solid #dee0e3;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* =================================================================
   Danger Zone
   ================================================================= */
.danger-card {
  background: #fff2f1 !important;
  border: 1px solid rgba(245, 74, 69, 0.2) !important;
}

.danger-card .n-card-header {
  border-bottom: 1px solid rgba(245, 74, 69, 0.12);
}

.card-header.danger {
  color: #f54a45;
}

.card-header.danger .card-header-icon {
  color: #f54a45;
  background: rgba(245, 74, 69, 0.1);
}

/* =================================================================
   Modal Styles - 弹窗样式
   ================================================================= */
.modal-content {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.modal-header-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  background: #f8f9fa;
  border-radius: 6px;
  border: 1px solid #dee0e3;
}

.modal-header-bar .info {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  color: #1f2329;
}

.modal-table-wrapper {
  border: 1px solid #dee0e3;
  border-radius: 6px;
  overflow: hidden;
}

.modal-table-wrapper .n-data-table-th {
  background: #f8f9fa !important;
  font-weight: 500;
  font-size: 13px;
}

.modal-table-wrapper .n-data-table-td {
  padding: 10px 12px !important;
}

.modal-table-wrapper .n-data-table-tr:hover .n-data-table-td {
  background: #f5f6f7 !important;
}

.modal-footer-info {
  text-align: right;
  padding: 8px 0;
  font-size: 13px;
  color: #8f959e;
}

.modal-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 40px;
  color: #8f959e;
}

.modal-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px;
  color: #8f959e;
}

/* =================================================================
   Form Modal Styles
   ================================================================= */
.modal-form {
  max-width: 100%;
}

.modal-form .n-form-item {
  margin-bottom: 16px;
}

.modal-form .n-form-item-label {
  font-weight: 500;
  color: #1f2329;
}

.modal-form .n-input,
.modal-form .n-select .n-base-selection {
  background-color: #ffffff;
}

/* =================================================================
   Code Text
   ================================================================= */
.code-text {
  font-family: 'SF Mono', 'Monaco', 'Menlo', 'Consolas', monospace;
  color: #3370ff;
  font-size: 13px;
}

.code-text.muted {
  color: #8f959e;
}

/* =================================================================
   Tab Card - 现代风格 Tab 页签卡片
   ================================================================= */

/* Tab 卡片容器 */
.glass-tab-card {
  border-radius: 12px !important;
  border: 1px solid rgba(222, 224, 227, 0.6) !important;
  background-color: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(12px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
  flex: 1;
  min-height: 0;
  display: flex !important;
  flex-direction: column;
  overflow: hidden;
}

/* Tab 组件 - 现代简洁设计 */
.modern-tabs {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.modern-tabs .n-tabs-nav {
  padding: 0 20px;
  background: #ffffff;
  border-bottom: 1px solid #ebedf0;
  position: relative;
}

.modern-tabs .n-tabs-nav::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, #ebedf0 10%, #ebedf0 90%, transparent 100%);
}

.modern-tabs .n-tabs-tab {
  padding: 14px 20px;
  font-size: 14px;
  font-weight: 500;
  color: #8f959e;
  transition: all 0.2s ease;
  border-radius: 0;
  margin: 0;
  position: relative;
  background: transparent;
  letter-spacing: 0.3px;
}

.modern-tabs .n-tabs-tab::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%) scaleX(0);
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, #3370ff 0%, #5b8def 100%);
  border-radius: 2px 2px 0 0;
  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.modern-tabs .n-tabs-tab:hover {
  color: #3370ff;
  background: transparent;
}

.modern-tabs .n-tabs-tab:hover::before {
  transform: translateX(-50%) scaleX(0.6);
}

.modern-tabs .n-tabs-tab--active {
  color: #3370ff;
  font-weight: 600;
  background: transparent;
}

.modern-tabs .n-tabs-tab--active::before {
  transform: translateX(-50%) scaleX(1);
}

.modern-tabs .n-tabs-bar {
  display: none;
}

.modern-tabs .n-tabs-tab-pad {
  width: 8px;
}

.modern-tabs .n-tabs-pane-wrapper {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.modern-tabs .n-tab-pane {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 0 !important;
}

/* Tab 标签文字动画效果 */
.modern-tabs .n-tabs-tab .n-tabs-tab__label {
  position: relative;
  display: inline-block;
}

/* 选中状态的微妙缩放效果 */
.modern-tabs .n-tabs-tab--active .n-tabs-tab__label {
  transform: scale(1.02);
}

/* Tab 内容面板 */
.tab-pane-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

/* Tab 筛选栏样式 */
.tab-filter-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 24px;
  background: linear-gradient(180deg, #fafbfc 0%, #ffffff 100%);
  border-bottom: 1px solid #ebedf0;
  flex-wrap: wrap;
  gap: 12px;
}

/* 逾期行高亮 */
.overdue-row td {
  background-color: rgba(208, 48, 80, 0.08) !important;
}

.overdue-row:hover td {
  background-color: rgba(208, 48, 80, 0.12) !important;
}

/* 账龄分析样式 */
.aging-analysis {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

.aging-item {
  padding: 20px 16px;
  background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
  border-radius: 10px;
  text-align: center;
  border: 1px solid #ebedf0;
  transition: all 0.2s ease;
}

.aging-item:hover {
  border-color: #d0d3d6;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.aging-label {
  font-size: 13px;
  color: #8f959e;
  margin-bottom: 10px;
  font-weight: 500;
}

.aging-value {
  font-size: 22px;
  font-weight: 600;
  color: #1f2329;
}

.aging-value.warning {
  color: #f0a020;
}

.aging-value.danger {
  color: #d03050;
}

/* =================================================================
   Responsive Styles
   ================================================================= */
@media (max-width: 1200px) {
  .page-container {
    padding: 16px 20px;
  }

  .page-title {
    font-size: 18px;
  }

  .tree-panel {
    width: 260px;
  }
}

@media (max-width: 1024px) {
  .page-container {
    padding: 12px 16px;
  }

  .page-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 12px;
  }

  .page-header .header-left {
    width: 100%;
  }

  .page-header .header-actions {
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 8px;
  }

  .page-title {
    font-size: 16px;
  }

  .card-header-wrapper {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  .card-header-wrapper > * {
    width: 100%;
  }

  .split-container {
    flex-direction: column !important;
  }

  .tree-panel {
    width: 100%;
    max-height: 280px;
    border-right: none;
    border-bottom: 1px solid #dee0e3;
  }

  .detail-panel {
    min-height: 400px;
  }

  .glass-list-card .n-data-table-wrapper {
    overflow-x: auto;
  }

  .glass-list-card .n-data-table {
    min-width: 600px;
  }

  .glass-list-card .n-pagination {
    padding: 10px 12px;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
  }
}

@media (max-width: 768px) {
  .page-container {
    padding: 12px;
  }

  .page-header {
    margin-bottom: 10px;
  }

  .page-header .header-left > .n-button:first-child {
    width: 28px;
    height: 28px;
  }

  .page-title {
    font-size: 15px;
  }

  .page-header .header-actions {
    gap: 6px;
  }

  .page-header .header-actions .n-button {
    font-size: 12px;
    padding: 0 10px;
    height: 28px;
  }

  .glass-list-card {
    border-radius: 6px !important;
  }

  .glass-list-card > .n-card-header {
    padding: 10px 12px !important;
    font-size: 14px;
  }

  .glass-list-card .n-data-table {
    min-width: 500px;
    font-size: 12px;
  }

  .glass-list-card .n-data-table .n-data-table-th,
  .glass-list-card .n-data-table .n-data-table-td {
    padding: 8px 10px !important;
    font-size: 12px;
  }

  .glass-list-card .n-pagination {
    padding: 8px 10px;
  }

  .glass-list-card .n-pagination .n-pagination-item {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
  }

  .detail-section {
    padding: 12px;
    margin-bottom: 12px;
  }

  .section-title {
    font-size: 13px;
    margin-bottom: 12px;
  }

  .info-item {
    padding: 10px;
  }

  .info-item .label {
    font-size: 11px;
  }

  .info-item .value {
    font-size: 13px;
  }

  .tree-panel {
    max-height: 240px;
  }

  .panel-header {
    padding: 10px 12px;
  }

  .panel-body {
    padding: 8px;
  }

  .detail-header {
    padding: 14px 16px;
    flex-direction: column;
    gap: 12px;
  }

  .detail-scroll {
    padding: 14px 16px;
  }

  .modal-header-bar {
    padding: 10px 12px;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
  }

  .modal-table-wrapper .n-data-table-th,
  .modal-table-wrapper .n-data-table-td {
    padding: 8px !important;
    font-size: 12px;
  }
}

@media (max-width: 480px) {
  .page-container {
    padding: 10px;
  }

  .page-title {
    font-size: 14px;
  }

  .page-header .header-actions .n-button {
    font-size: 11px;
    padding: 0 8px;
    height: 26px;
  }

  .glass-list-card .n-data-table {
    min-width: 400px;
  }

  .glass-list-card .n-data-table .n-data-table-th,
  .glass-list-card .n-data-table .n-data-table-td {
    padding: 6px 8px !important;
    font-size: 11px;
  }

  .glass-list-card .n-pagination .n-pagination-item {
    min-width: 24px;
    height: 24px;
    font-size: 11px;
  }

  .tree-panel {
    max-height: 200px;
  }

  .detail-header {
    padding: 12px;
  }

  .detail-scroll {
    padding: 12px;
  }

  .icon-box {
    padding: 8px;
    border-radius: 6px;
  }
}
/**
 * 全局动画样式
 * 提供 Vue Transition 组件所需的 CSS 类
 * 以及常用的动画效果
 */

/* ==================== Vue Transition 过渡效果 ==================== */

/* 淡入淡出 */
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.3s ease;
}

.fade-enter-from,
.fade-leave-to {
  opacity: 0;
}

/* 向上滑入 */
.slide-up-enter-active,
.slide-up-leave-active {
  transition: all 0.3s ease;
}

.slide-up-enter-from {
  opacity: 0;
  transform: translateY(20px);
}

.slide-up-leave-to {
  opacity: 0;
  transform: translateY(-10px);
}

/* 向下滑入 */
.slide-down-enter-active,
.slide-down-leave-active {
  transition: all 0.3s ease;
}

.slide-down-enter-from {
  opacity: 0;
  transform: translateY(-20px);
}

.slide-down-leave-to {
  opacity: 0;
  transform: translateY(10px);
}

/* 向左滑入 */
.slide-left-enter-active,
.slide-left-leave-active {
  transition: all 0.3s ease;
}

.slide-left-enter-from {
  opacity: 0;
  transform: translateX(20px);
}

.slide-left-leave-to {
  opacity: 0;
  transform: translateX(-20px);
}

/* 向右滑入 */
.slide-right-enter-active,
.slide-right-leave-active {
  transition: all 0.3s ease;
}

.slide-right-enter-from {
  opacity: 0;
  transform: translateX(-20px);
}

.slide-right-leave-to {
  opacity: 0;
  transform: translateX(20px);
}

/* 缩放 */
.scale-enter-active,
.scale-leave-active {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.scale-enter-from,
.scale-leave-to {
  opacity: 0;
  transform: scale(0.95);
}

/* 弹跳缩放 */
.scale-bounce-enter-active {
  animation: scaleBounceIn 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.scale-bounce-leave-active {
  animation: scaleBounceOut 0.3s ease;
}

@keyframes scaleBounceIn {
  0% {
    opacity: 0;
    transform: scale(0.9);
  }

  60% {
    opacity: 1;
    transform: scale(1.02);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes scaleBounceOut {
  0% {
    opacity: 1;
    transform: scale(1);
  }

  100% {
    opacity: 0;
    transform: scale(0.95);
  }
}

/* 弹跳 */
.bounce-enter-active {
  animation: bounceIn 0.5s;
}

.bounce-leave-active {
  animation: bounceOut 0.4s;
}

@keyframes bounceIn {
  0% {
    opacity: 0;
    transform: scale(0.3);
  }

  50% {
    transform: scale(1.05);
  }

  70% {
    transform: scale(0.9);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes bounceOut {
  0% {
    opacity: 1;
    transform: scale(1);
  }

  20% {
    transform: scale(0.95);
  }

  50% {
    opacity: 0.8;
    transform: scale(1.02);
  }

  100% {
    opacity: 0;
    transform: scale(0.3);
  }
}

/* 翻转 */
.flip-enter-active,
.flip-leave-active {
  transition: all 0.4s ease;
  perspective: 1000px;
}

.flip-enter-from {
  opacity: 0;
  transform: rotateY(-90deg);
}

.flip-leave-to {
  opacity: 0;
  transform: rotateY(90deg);
}

/* 列表交错动画 */
.list-enter-active,
.list-leave-active {
  transition: all 0.4s ease;
}

.list-enter-from {
  opacity: 0;
  transform: translateX(-30px);
}

.list-leave-to {
  opacity: 0;
  transform: translateX(30px);
}

.list-move {
  transition: transform 0.4s ease;
}

/* 列表淡入 */
.list-fade-enter-active,
.list-fade-leave-active {
  transition: all 0.3s ease;
}

.list-fade-enter-from,
.list-fade-leave-to {
  opacity: 0;
}

.list-fade-move {
  transition: transform 0.3s ease;
}

/* ==================== 页面切换过渡 ==================== */

/* 路由页面过渡 - 淡入滑上 */
.page-enter-active,
.page-leave-active {
  transition: all 0.35s ease;
}

.page-enter-from {
  opacity: 0;
  transform: translateY(15px);
}

.page-leave-to {
  opacity: 0;
  transform: translateY(-10px);
}

/* 路由页面过渡 - 缩放 */
.page-scale-enter-active,
.page-scale-leave-active {
  transition: all 0.3s ease;
}

.page-scale-enter-from {
  opacity: 0;
  transform: scale(0.98);
}

.page-scale-leave-to {
  opacity: 0;
  transform: scale(1.02);
}

/* ==================== 常用动画类 ==================== */

/* 进入动画 - 可直接添加到元素 class */
.animate-fade-in {
  animation: fadeIn 0.4s ease forwards;
}

.animate-slide-up {
  animation: slideUp 0.4s ease forwards;
}

.animate-slide-down {
  animation: slideDown 0.4s ease forwards;
}

.animate-scale-in {
  animation: scaleIn 0.3s ease forwards;
}

.animate-bounce-in {
  animation: bounceIn 0.5s ease forwards;
}

/* 交错延迟 - 用于列表 */
.stagger-1 {
  animation-delay: 0.05s;
}

.stagger-2 {
  animation-delay: 0.1s;
}

.stagger-3 {
  animation-delay: 0.15s;
}

.stagger-4 {
  animation-delay: 0.2s;
}

.stagger-5 {
  animation-delay: 0.25s;
}

.stagger-6 {
  animation-delay: 0.3s;
}

.stagger-7 {
  animation-delay: 0.35s;
}

.stagger-8 {
  animation-delay: 0.4s;
}

.stagger-9 {
  animation-delay: 0.45s;
}

.stagger-10 {
  animation-delay: 0.5s;
}

/* 悬停动画 */
.hover-lift {
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.hover-lift:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
}

.hover-scale {
  transition: transform 0.2s ease;
}

.hover-scale:hover {
  transform: scale(1.02);
}

.hover-glow {
  transition: box-shadow 0.3s ease;
}

.hover-glow:hover {
  box-shadow: 0 0 20px rgba(79, 70, 140, 0.3);
}

/* 点击反馈 */
.click-shrink {
  transition: transform 0.1s ease;
}

.click-shrink:active {
  transform: scale(0.97);
}

/* ==================== 关键帧定义 ==================== */

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes scaleIn {
  from {
    opacity: 0;
    transform: scale(0.95);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes shake {
  0%,
  100% {
    transform: translateX(0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    transform: translateX(-5px);
  }

  20%,
  40%,
  60%,
  80% {
    transform: translateX(5px);
  }
}

@keyframes pulse {
  0%,
  100% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.05);
  }
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

@keyframes float {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-10px);
  }
}

/* ==================== 特殊效果 ==================== */

/* 抖动 - 错误提示 */
.animate-shake {
  animation: shake 0.5s ease;
}

/* 脉冲 - 强调 */
.animate-pulse {
  animation: pulse 1s ease infinite;
}

/* 旋转 - 加载 */
.animate-spin {
  animation: spin 1s linear infinite;
}

/* 浮动 - 装饰 */
.animate-float {
  animation: float 3s ease-in-out infinite;
}

/* 闪烁 */
.animate-blink {
  animation: blink 1s step-end infinite;
}

@keyframes blink {
  0%,
  100% {
    opacity: 1;
  }

  50% {
    opacity: 0;
  }
}

/* 渐变背景动画 */
.animate-gradient {
  background-size: 200% 200%;
  animation: gradientShift 3s ease infinite;
}

@keyframes gradientShift {
  0% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }

  100% {
    background-position: 0% 50%;
  }
}

/* ==================== 骨架屏动画 ==================== */

.skeleton-loading {
  background: linear-gradient(90deg, #f0f0f0 25%, #e8e8e8 50%, #f0f0f0 75%);
  background-size: 200% 100%;
  animation: skeletonLoading 1.5s infinite;
}

@keyframes skeletonLoading {
  0% {
    background-position: 200% 0;
  }

  100% {
    background-position: -200% 0;
  }
}

/* ==================== 数字滚动效果辅助 ==================== */

.number-scroll {
  font-variant-numeric: tabular-nums;
  transition: transform 0.3s ease;
}

/* ==================== 卡片动画 ==================== */

.card-hover {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.card-hover:hover {
  transform: translateY(-6px);
  box-shadow:
    0 12px 40px rgba(79, 70, 140, 0.15),
    0 4px 12px rgba(0, 0, 0, 0.08);
}

/* 按压效果 */
.card-press:active {
  transform: scale(0.98);
  transition: transform 0.1s ease;
}

.global-loading-overlay[data-v-79f80e3f] {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.7);
}
.fade-enter-active[data-v-79f80e3f],
.fade-leave-active[data-v-79f80e3f] {
  transition: opacity 0.2s;
}
.fade-enter-from[data-v-79f80e3f],
.fade-leave-to[data-v-79f80e3f] {
  opacity: 0;
}

.login-page[data-v-24260840] {
  min-height: 100vh;
  display: flex;
}

/* ========== 左侧品牌区 ========== */
.brand-section[data-v-24260840] {
  width: 400px;
  min-width: 320px;
  max-width: 420px;
  display: flex;
  background: linear-gradient(165deg, #3d3b4f 0%, #2a2838 100%);
  color: #fff;
  flex-direction: column;
  padding: 40px 36px;
  position: relative;
  overflow: hidden;
}
.brand-section[data-v-24260840]::before {
  content: '';
  position: absolute;
  top: -100px;
  right: -100px;
  width: 300px;
  height: 300px;
  background: radial-gradient(circle, rgba(136, 120, 160, 0.15) 0%, transparent 70%);
  pointer-events: none;
}
.brand-section[data-v-24260840]::after {
  content: '';
  position: absolute;
  bottom: -50px;
  left: -50px;
  width: 200px;
  height: 200px;
  background: radial-gradient(circle, rgba(136, 120, 160, 0.1) 0%, transparent 70%);
  pointer-events: none;
}
.brand-top[data-v-24260840] {
  display: flex;
  align-items: center;
  gap: 18px;
  position: relative;
  z-index: 1;
}
.logo-wrapper[data-v-24260840] {
  width: 56px;
  height: 56px;
  border-radius: 14px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.1);
  border: 2px solid rgba(255, 255, 255, 0.15);
}
.logo[data-v-24260840] {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.brand-info[data-v-24260840] {
  flex: 1;
}
.brand-name[data-v-24260840] {
  font-size: 24px;
  font-weight: 700;
  margin: 0 0 4px;
  color: #fff;
}
.brand-slogan[data-v-24260840] {
  font-size: 13px;
  margin: 0;
  color: rgba(255, 255, 255, 0.7);
}
.brand-middle[data-v-24260840] {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 48px 0;
  position: relative;
  z-index: 1;
}
.section-title[data-v-24260840] {
  font-size: 13px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.4);
  text-transform: uppercase;
  letter-spacing: 2px;
  margin: 0 0 24px;
}
.feature-list[data-v-24260840] {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.feature-item[data-v-24260840] {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 20px;
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 16px;
  transition: all 0.3s ease;
}
.feature-item[data-v-24260840]:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.1);
  transform: translateX(4px);
}
.feature-icon[data-v-24260840] {
  width: 46px;
  height: 46px;
  background: linear-gradient(135deg, rgba(136, 120, 160, 0.25) 0%, rgba(136, 120, 160, 0.15) 100%);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #b8a8d0;
  flex-shrink: 0;
}
.feature-text[data-v-24260840] {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-top: 2px;
}
.feature-title[data-v-24260840] {
  font-size: 15px;
  font-weight: 600;
  color: #fff;
}
.feature-desc[data-v-24260840] {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.55);
  line-height: 1.5;
}
.brand-bottom[data-v-24260840] {
  display: flex;
  align-items: center;
  gap: 16px;
  position: relative;
  z-index: 1;
}
.bottom-line[data-v-24260840] {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.2) 0%, transparent 100%);
}
.brand-bottom span[data-v-24260840] {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.35);
  letter-spacing: 1px;
  text-transform: uppercase;
}

/* ========== 右侧登录区 ========== */
.login-section[data-v-24260840] {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px;
  background: linear-gradient(135deg, #e9f1f6 0%, #dce6ed 100%);
  position: relative;
  overflow: hidden;
}

/* 星光效果 - 使用 canvas */
.stars-canvas[data-v-24260840] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.login-section[data-v-24260840]::after {
  content: '';
  position: absolute;
  top: -30%;
  right: -15%;
  width: 450px;
  height: 450px;
  background: radial-gradient(circle, rgba(136, 120, 160, 0.1) 0%, transparent 70%);
  pointer-events: none;
}
.login-wrapper[data-v-24260840] {
  width: 100%;
  max-width: 480px;
  position: relative;
  z-index: 1;
}
.mobile-header[data-v-24260840] {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-bottom: 32px;
}
.mobile-logo[data-v-24260840] {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(61, 59, 79, 0.2);
}
.mobile-name[data-v-24260840] {
  font-size: 22px;
  font-weight: 700;
  color: #3d3b4f;
}

/* ========== 毛玻璃登录卡片 ========== */
.login-card[data-v-24260840] {
  background: rgba(255, 255, 255, 0.55);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-radius: 24px;
  padding: 48px 44px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  box-shadow:
    0 8px 32px rgba(61, 59, 79, 0.12),
    0 2px 8px rgba(61, 59, 79, 0.06);
  position: relative;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}
.login-card[data-v-24260840]:hover {
  transform: translateY(-4px);
  box-shadow:
    0 16px 48px rgba(61, 59, 79, 0.15),
    0 4px 12px rgba(61, 59, 79, 0.08);
}
.login-header[data-v-24260840] {
  text-align: center;
  margin-bottom: 36px;
}
.login-header h2[data-v-24260840] {
  font-size: 28px;
  font-weight: 700;
  color: #3d3b4f;
  margin: 0 0 10px;
}
.login-header p[data-v-24260840] {
  font-size: 14px;
  color: #6b6880;
  margin: 0;
}

/* ========== 表单样式 ========== */
.input-group[data-v-24260840] {
  margin-bottom: 24px;
}
.input-group label[data-v-24260840] {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #4a4860;
  margin-bottom: 10px;
}
.label-row[data-v-24260840] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
.label-row label[data-v-24260840] {
  margin-bottom: 0;
}
.forgot-link[data-v-24260840] {
  font-size: 13px;
  color: #6b5b8a;
  cursor: pointer;
  font-weight: 500;
  transition: color 0.2s;
}
.forgot-link[data-v-24260840]:hover {
  color: #4a3d6a;
}
.login-form[data-v-24260840] .n-form-item {
  margin-bottom: 0;
}
.login-form[data-v-24260840] .n-form-item-feedback-wrapper {
  min-height: 20px;
}
.login-form[data-v-24260840] .n-input {
  --n-height: 50px;
  --n-border-radius: 12px;
  --n-border: 1px solid rgba(61, 59, 79, 0.15);
  --n-border-hover: 1px solid rgba(107, 91, 138, 0.4);
  --n-border-focus: 1px solid #6b5b8a;
  --n-box-shadow-focus: 0 0 0 3px rgba(107, 91, 138, 0.12);
  --n-color: rgba(255, 255, 255, 0.7);
  --n-color-focus: rgba(255, 255, 255, 0.85);
  --n-placeholder-color: #9a96a8;
  --n-caret-color: #6b5b8a;
  --n-text-color: #3d3b4f;
}
.login-form[data-v-24260840] .n-input .n-input__prefix {
  color: #7a7890;
  margin-right: 10px;
}
.login-form[data-v-24260840] .n-input .n-input__suffix {
  color: #7a7890;
}
.options-row[data-v-24260840] {
  margin-bottom: 28px;
}
.options-row[data-v-24260840] .n-checkbox {
  --n-font-size: 13px;
  --n-text-color: #5a5870;
}

/* ========== 登录按钮 ========== */
.login-btn[data-v-24260840] {
  --n-height: 50px;
  --n-border-radius: 12px;
  --n-font-size: 15px;
  --n-font-weight: 600;
  --n-color: #5a4a7a;
  --n-color-hover: #6b5b8a;
  --n-color-pressed: #4a3d6a;
  --n-color-focus: #6b5b8a;
  --n-text-color: #fff;
  --n-text-color-hover: #fff;
  --n-text-color-pressed: #fff;
  --n-text-color-focus: #fff;
  --n-border: none;
  letter-spacing: 3px;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.login-btn[data-v-24260840]:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(90, 74, 122, 0.35);
}
.login-btn[data-v-24260840]:active:not(:disabled) {
  transform: translateY(0);
  box-shadow: 0 4px 12px rgba(90, 74, 122, 0.25);
}
.login-footer[data-v-24260840] {
  text-align: center;
  margin-top: 32px;
  font-size: 12px;
  color: #8a9aa8;
}

/* ========== 响应式 ========== */
@media (max-width: 1200px) {
.brand-section[data-v-24260840] {
    width: 340px;
    min-width: 300px;
    padding: 36px 32px;
}
.brand-name[data-v-24260840] {
    font-size: 20px;
}
.feature-item[data-v-24260840] {
    padding: 14px;
}
}
@media (max-width: 900px) {
.brand-section[data-v-24260840] {
    display: none;
}
.mobile-header[data-v-24260840] {
    display: flex;
}
.login-section[data-v-24260840] {
    background: linear-gradient(135deg, #e9f1f6 0%, #dce6ed 100%);
}
.login-wrapper[data-v-24260840] {
    padding-top: 60px;
}
}
@media (max-width: 480px) {
.login-section[data-v-24260840] {
    padding: 24px;
}
.login-wrapper[data-v-24260840] {
    padding-top: 40px;
}
.mobile-header[data-v-24260840] {
    margin-bottom: 24px;
}
.mobile-logo[data-v-24260840] {
    width: 40px;
    height: 40px;
}
.mobile-name[data-v-24260840] {
    font-size: 20px;
}
.login-card[data-v-24260840] {
    padding: 32px 24px;
    border-radius: 20px;
}
.login-header h2[data-v-24260840] {
    font-size: 24px;
}
.login-form[data-v-24260840] .n-input {
    --n-height: 46px;
    --n-border-radius: 10px;
}
.login-btn[data-v-24260840] {
    --n-height: 46px;
    --n-border-radius: 10px;
}
}

.notification-trigger[data-v-898ef0b8] {
  transition: background-color 0.2s;
}
.notification-trigger[data-v-898ef0b8]:hover {
  background-color: rgba(79, 70, 140, 0.08);
}
.notification-panel[data-v-898ef0b8] {
  max-height: 480px;
  display: flex;
  flex-direction: column;
}
.panel-header[data-v-898ef0b8] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
}
.header-title[data-v-898ef0b8] {
  font-weight: 600;
  font-size: 15px;
  color: #1f2937;
}
.notification-list[data-v-898ef0b8] {
  flex: 1;
  overflow-y: auto;
  max-height: 360px;
}
.notification-item[data-v-898ef0b8] {
  display: flex;
  gap: 12px;
  padding: 12px 16px;
  cursor: pointer;
  transition: background-color 0.2s;
  position: relative;
}
.notification-item[data-v-898ef0b8]:hover {
  background-color: #f9fafb;
}
.notification-item.unread[data-v-898ef0b8] {
  background-color: rgba(79, 70, 140, 0.04);
}
.notification-icon[data-v-898ef0b8] {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: white;
}
.type-system[data-v-898ef0b8] {
  background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
}
.type-approval[data-v-898ef0b8] {
  background: linear-gradient(135deg, #10b981 0%, #34d399 100%);
}
.type-warning[data-v-898ef0b8] {
  background: linear-gradient(135deg, #f59e0b 0%, #fbbf24 100%);
}
.type-task[data-v-898ef0b8] {
  background: linear-gradient(135deg, #3b82f6 0%, #60a5fa 100%);
}
.type-invitation[data-v-898ef0b8] {
  background: linear-gradient(135deg, #4f468c 0%, #764ba2 100%);
}
.notification-content[data-v-898ef0b8] {
  flex: 1;
  min-width: 0;
}
.notification-title[data-v-898ef0b8] {
  font-weight: 600;
  font-size: 14px;
  color: #1f2937;
  margin-bottom: 4px;
}
.notification-text[data-v-898ef0b8] {
  font-size: 13px;
  color: #6b7280;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.4;
}
.notification-meta[data-v-898ef0b8] {
  display: flex;
  gap: 8px;
  margin-top: 6px;
  font-size: 12px;
  color: #9ca3af;
}
.invitation-actions[data-v-898ef0b8] {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}
.unread-dot[data-v-898ef0b8] {
  width: 8px;
  height: 8px;
  background: #4f468c;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 4px;
}
.empty-state[data-v-898ef0b8] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  gap: 12px;
  color: #9ca3af;
  font-size: 14px;
}

.modal-header[data-v-4a13bd20] {
  display: flex;
  align-items: center;
  gap: 16px;
}
.modal-header-icon[data-v-4a13bd20] {
  width: 52px;
  height: 52px;
  background: linear-gradient(135deg, rgba(79, 70, 140, 0.1) 0%, rgba(118, 75, 162, 0.1) 100%);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.modal-header-text h3[data-v-4a13bd20] {
  margin: 0 0 4px 0;
  font-size: 20px;
  font-weight: 700;
  color: #1f2937;
}
.modal-header-text p[data-v-4a13bd20] {
  margin: 0;
  font-size: 14px;
  color: #6b7280;
}
.tenant-modal-content[data-v-4a13bd20] {
  padding: 8px 0;
}
.tenant-list[data-v-4a13bd20] {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: 400px;
  overflow-y: auto;
  padding-right: 4px;
}
.tenant-list[data-v-4a13bd20]::-webkit-scrollbar {
  width: 6px;
}
.tenant-list[data-v-4a13bd20]::-webkit-scrollbar-track {
  background: #f1f5f9;
  border-radius: 3px;
}
.tenant-list[data-v-4a13bd20]::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 3px;
}
.tenant-list[data-v-4a13bd20]::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}
.tenant-item[data-v-4a13bd20] {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 20px;
  background: #f9fafb;
  border: 2px solid transparent;
  border-radius: 14px;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
}
.tenant-item[data-v-4a13bd20]:hover {
  background: #f3f4f6;
  border-color: #e5e7eb;
  transform: translateX(4px);
}
.tenant-item.selected[data-v-4a13bd20] {
  border-color: #4f468c;
  background: linear-gradient(135deg, rgba(79, 70, 140, 0.05) 0%, rgba(118, 75, 162, 0.05) 100%);
  box-shadow: 0 4px 12px rgba(79, 70, 140, 0.1);
}
.tenant-item.current[data-v-4a13bd20] {
  opacity: 0.7;
}
.tenant-logo[data-v-4a13bd20] {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}
.tenant-logo img[data-v-4a13bd20] {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tenant-info[data-v-4a13bd20] {
  flex: 1;
  min-width: 0;
}
.tenant-name[data-v-4a13bd20] {
  font-size: 15px;
  font-weight: 600;
  color: #1f2937;
  margin-bottom: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: flex;
  align-items: center;
}
.tenant-meta[data-v-4a13bd20] {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.tenant-role[data-v-4a13bd20] {
  font-size: 12px;
  color: #6b7280;
}
.check-icon-wrapper[data-v-4a13bd20] {
  opacity: 0;
  transform: scale(0.8);
  transition: all 0.2s ease;
  flex-shrink: 0;
}
.check-icon-wrapper.visible[data-v-4a13bd20] {
  opacity: 1;
  transform: scale(1);
}
.tenant-list-footer[data-v-4a13bd20] {
  margin-top: 8px;
}
.divider-text[data-v-4a13bd20] {
  font-size: 12px;
  color: #9ca3af;
}
.quick-actions[data-v-4a13bd20] {
  display: flex;
  justify-content: center;
  gap: 24px;
}
.tenant-modal-footer[data-v-4a13bd20] {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.dashboard-layout[data-v-4f95d868] {
  height: 100vh;
  overflow: hidden;
}

/* 侧边栏右边框分隔线 */
.dashboard-layout[data-v-4f95d868] .n-layout-sider {
  border-right: 1px solid #e5e6eb !important;
}

/* 隐藏侧边栏滚动条 */
.dashboard-layout[data-v-4f95d868] .n-layout-sider .n-scrollbar-rail {
  display: none !important;
}
.dashboard-layout[data-v-4f95d868] .n-layout-sider .n-scrollbar > .n-scrollbar-rail {
  display: none !important;
}
.dashboard-right[data-v-4f95d868] {
  display: flex;
  flex-direction: column;
  height: 100vh;
  overflow: hidden;
}
.dashboard-right[data-v-4f95d868] .n-layout-scroll-container {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.logo[data-v-4f95d868] {
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 600;
  color: var(--n-text-color);
  padding: 0 16px;
  /* 固定在顶部 */
  position: sticky;
  top: 0;
  background: #fff;
  z-index: 5;
  flex-shrink: 0;
  /* 使用 box-shadow 作为底部分隔线，更明显 */
  box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.08);
}

/* 收起状态下logo图标居中对齐菜单图标 */
.dashboard-layout[data-v-4f95d868] .n-layout-sider--collapsed .logo {
  padding: 0;
  justify-content: center;
}

/* 收起状态下菜单图标居中 - Naive UI 特定样式 */
.dashboard-layout[data-v-4f95d868] .n-layout-sider--collapsed .n-menu--collapsed .n-menu-item-content {
  padding-left: 18px !important;
}
.dashboard-layout[data-v-4f95d868]
  .n-layout-sider--collapsed
  .n-menu--collapsed
  .n-submenu
  > .n-submenu-children
  .n-menu-item-content {
  padding-left: 18px !important;
}

/* 侧边栏底部折叠按钮 */
.sider-footer[data-v-4f95d868] {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 12px;
  border-top: 1px solid var(--n-border-color);
  background: #fff;
  z-index: 10;
}
.collapse-btn[data-v-4f95d868] {
  justify-content: flex-start;
  color: #666;
  font-size: 13px;
  height: 36px;
  transition: all 0.2s ease;
}
.collapse-btn[data-v-4f95d868]:hover {
  color: #4f468c;
  background: rgba(79, 70, 140, 0.08);
}

/* 收起状态下按钮居中 */
.dashboard-layout[data-v-4f95d868] .n-layout-sider--collapsed .sider-footer {
  padding: 12px 8px;
}
.dashboard-layout[data-v-4f95d868] .n-layout-sider--collapsed .collapse-btn {
  justify-content: center;
}

/* 确保侧边栏有相对定位 */
.dashboard-layout[data-v-4f95d868] .n-layout-sider {
  position: relative;
}

/* 菜单区域留出底部空间 - 给收起按钮留足空间 */
.dashboard-layout[data-v-4f95d868] .n-layout-sider-scroll-container {
  padding-bottom: 70px !important;
}

/* n-scrollbar 内容区也需要底部空间 */
.dashboard-layout[data-v-4f95d868] .n-scrollbar-content {
  padding-bottom: 70px !important;
}

/* 菜单本身也需要底部空间 */
.dashboard-layout[data-v-4f95d868] .n-menu {
  margin-bottom: 20px;
}
.dashboard-header[data-v-4f95d868] {
  height: 60px !important;
  min-height: 60px !important;
  display: flex !important;
  align-items: center;
  padding: 0 20px;
  flex-shrink: 0;
  background: #fff !important;
  box-sizing: border-box;
}
.dashboard-right[data-v-4f95d868] .n-layout-header {
  height: 60px !important;
  min-height: 60px !important;
  display: flex !important;
  align-items: center !important;
  background: #fff !important;
}
.dashboard-right[data-v-4f95d868] .n-layout-header .n-layout-scroll-container {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
}
.header-content[data-v-4f95d868] {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}
.header-left[data-v-4f95d868] {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  min-width: 0;
  overflow: hidden;
}
.header-title[data-v-4f95d868] {
  font-size: 18px;
  font-weight: 600;
  color: #3d3b4f;
  white-space: nowrap;
  flex-shrink: 0;
}
.header-tabs[data-v-4f95d868] {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
  overflow: hidden;
}
.header-tabs[data-v-4f95d868] .n-tag {
  cursor: pointer;
  transition: all 0.2s;
  flex-shrink: 0;
  font-size: 14px;
  padding: 0 12px;
  height: 28px;
}
.header-tabs[data-v-4f95d868] .n-tag:hover {
  opacity: 0.85;
}
.header-actions[data-v-4f95d868] {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}

/* 企业切换按钮样式 */
.header-actions .tenant-btn[data-v-4f95d868] {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  border-radius: 8px;
  background: rgba(79, 70, 140, 0.08);
  border: 1px solid rgba(79, 70, 140, 0.15);
  transition: all 0.2s ease;
}
.header-actions .tenant-btn[data-v-4f95d868]:hover {
  background: rgba(79, 70, 140, 0.12);
  border-color: rgba(79, 70, 140, 0.25);
}
.header-actions .tenant-btn .tenant-name[data-v-4f95d868] {
  font-size: 13px;
  font-weight: 500;
  color: #4f468c;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 单企业显示样式 */
.header-actions .tenant-display[data-v-4f95d868] {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  border-radius: 8px;
  background: rgba(107, 114, 128, 0.08);
  border: 1px solid rgba(107, 114, 128, 0.15);
}
.header-actions .tenant-display .tenant-name[data-v-4f95d868] {
  font-size: 13px;
  font-weight: 500;
  color: #6b7280;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dashboard-main[data-v-4f95d868] {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.dashboard-main[data-v-4f95d868] .n-layout-scroll-container {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.main-content[data-v-4f95d868] {
  flex: 1;
  min-height: 0;
  padding: 0;
  overflow-y: auto;
  overflow-x: hidden;
  background: #e9f1f6;
  position: relative;
  /* 隐藏滚动条但保留滚动功能 */
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE/Edge */
}
.main-content[data-v-4f95d868]::-webkit-scrollbar {
  display: none; /* Chrome/Safari/Opera */
}
.stars-canvas[data-v-4f95d868] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}
.main-content[data-v-4f95d868] >  *:not(.stars-canvas) {
  position: relative;
  z-index: 1;
}
.dashboard-footer[data-v-4f95d868] {
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: var(--n-text-color-3);
  flex-shrink: 0;
  background: #e9f1f6;
  border-top: none;
}

/* 移动端遮罩 */
.mobile-overlay[data-v-4f95d868] {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  z-index: 999;
  backdrop-filter: blur(2px);
}

/* 移动端汉堡菜单按钮 */
.mobile-menu-btn[data-v-4f95d868] {
  flex-shrink: 0;
}

/* 响应式断点 */
@media (max-width: 1200px) {
.header-title[data-v-4f95d868] {
    font-size: 16px;
}
.header-tabs[data-v-4f95d868] .n-tag {
    font-size: 12px;
    padding: 0 10px;
}
}
@media (max-width: 1000px) {
.header-tabs[data-v-4f95d868] {
    flex: 0 1 auto;
    max-width: 350px;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.header-tabs[data-v-4f95d868]::-webkit-scrollbar {
    display: none;
}
.header-left[data-v-4f95d868] {
    flex: 1;
    min-width: 0;
    overflow: hidden;
}
.header-title[data-v-4f95d868] {
    flex-shrink: 0;
}
.header-actions[data-v-4f95d868] {
    flex-shrink: 0;
    margin-left: auto;
}
.main-content[data-v-4f95d868] {
    padding: 10px;
}
}
@media (max-width: 1024px) {
.logo[data-v-4f95d868] {
    height: 50px;
    font-size: 18px;
}

  /* 移动端header固定在顶部 */
.dashboard-header[data-v-4f95d868] {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    height: 50px !important;
    min-height: 50px !important;
    padding: 0 12px !important;
    background: #fff !important;
    z-index: 100;
    border-bottom: 1px solid #eee;
    display: flex !important;
    align-items: center !important;
}
.dashboard-right[data-v-4f95d868] .n-layout-header {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    height: 50px !important;
    min-height: 50px !important;
    background: #fff !important;
    z-index: 100;
    display: flex !important;
    align-items: center !important;
}
.dashboard-right[data-v-4f95d868] .n-layout-header > .n-layout-scroll-container {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    height: 100% !important;
    padding: 0 12px !important;
}

  /* 内容区域留出header空间 */
.dashboard-main[data-v-4f95d868] {
    margin-top: 50px;
}
.header-content[data-v-4f95d868] {
    width: 100% !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 12px;
    height: 100%;
}
.header-left[data-v-4f95d868] {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 12px;
    flex: 0 0 auto !important;
    min-width: 0;
    overflow: visible !important;
}
.mobile-menu-btn[data-v-4f95d868] {
    display: flex !important;
    flex-shrink: 0 !important;
}
.header-title[data-v-4f95d868] {
    font-size: 15px;
    font-weight: 600;
    display: block !important;
    flex-shrink: 0 !important;
}
.header-actions[data-v-4f95d868] {
    flex-shrink: 0 !important;
    margin-left: auto !important;
}
.header-tabs[data-v-4f95d868] {
    display: none !important;
}
.header-actions[data-v-4f95d868] {
    flex-shrink: 0 !important;
}
.header-actions[data-v-4f95d868] .n-button {
    font-size: 12px;
    padding: 0 12px;
    height: 30px;
}
.main-content[data-v-4f95d868] {
    padding: 8px;
}
.dashboard-footer[data-v-4f95d868] {
    height: 32px;
    font-size: 10px;
}

  /* 移动端侧边栏固定定位 */
.dashboard-layout[data-v-4f95d868] .n-layout-sider {
    position: fixed !important;
    left: 0;
    top: 0;
    height: 100vh !important;
    z-index: 1000;
    transform: translateX(-100%);
    transition: transform 0.3s ease;
}
.dashboard-layout[data-v-4f95d868] .n-layout-sider.mobile-open {
    transform: translateX(0);
}
}
@media (max-width: 600px) {
.dashboard-header[data-v-4f95d868] {
    padding: 0 8px;
}
.header-title[data-v-4f95d868] {
    font-size: 13px;
}
.header-actions[data-v-4f95d868] .n-button {
    font-size: 11px;
    padding: 0 8px;
    height: 26px;
}
.main-content[data-v-4f95d868] {
    padding: 6px;
}
.mobile-menu-btn[data-v-4f95d868] {
    margin-right: 4px;
}
}

.overview-page[data-v-790993c4] {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 16px;
  height: 100%;
  overflow: hidden;
  position: relative;
  padding: 16px;
}

/* 背景装饰 */
.bg-decoration[data-v-790993c4] {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}
.bg-blob[data-v-790993c4] {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.4;
  animation: float-790993c4 20s ease-in-out infinite;
}
.blob-1[data-v-790993c4] {
  width: 400px;
  height: 400px;
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.3), rgba(139, 92, 246, 0.2));
  top: -100px;
  right: -100px;
  animation-delay: 0s;
}
.blob-2[data-v-790993c4] {
  display: none;
}
.blob-3[data-v-790993c4] {
  width: 200px;
  height: 200px;
  background: linear-gradient(135deg, rgba(167, 139, 250, 0.2), rgba(196, 181, 253, 0.15));
  top: 50%;
  left: 40%;
  animation-delay: -14s;
}
@keyframes float-790993c4 {
0%,
  100% {
    transform: translate(0, 0) scale(1);
}
25% {
    transform: translate(20px, -20px) scale(1.05);
}
50% {
    transform: translate(-10px, 20px) scale(0.95);
}
75% {
    transform: translate(-20px, -10px) scale(1.02);
}
}

/* 玻璃卡片 */
.glass-card[data-v-790993c4] {
  background: #ffffff;
  border-radius: 8px;
  border: 1px solid #dee0e3;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
  transition: all 0.2s ease;
  position: relative;
  z-index: 1;
  overflow: hidden;
}
.glass-card[data-v-790993c4]:hover {
  border-color: #c9cdd4;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
.card-header[data-v-790993c4] {
  padding: 16px 20px;
  border-bottom: 1px solid #f0f1f2;
}
.card-content[data-v-790993c4] {
  padding: 16px 20px;
}
.section-header[data-v-790993c4] {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* 顶部小操作按钮（添加 / 全部） */
.section-action-btn[data-v-790993c4] {
  --n-font-size: 12px;
  --n-padding: 0 6px;
  --n-border-radius: 999px;
  --n-text-color: #3370ff;
  --n-text-color-hover: #245bdb;
  --n-text-color-pressed: #1d4ed8;
  --n-color-hover: rgba(51, 112, 255, 0.06);
  --n-color-pressed: rgba(37, 99, 235, 0.08);
  --n-ripple-color: rgba(51, 112, 255, 0.25);
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.section-action-btn[data-v-790993c4] .n-button__icon {
  margin-right: 2px;
}
.header-title[data-v-790993c4] {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  font-size: 14px;
  color: #1f2329;
}
.header-title .n-icon[data-v-790993c4] {
  color: #3370ff;
}

/* 主区域 */
.main-area[data-v-790993c4] {
  display: flex;
  flex-direction: column;
  gap: 16px;
  overflow: hidden;
  z-index: 1;
}

/* 顶部区域 */
.top-section[data-v-790993c4] {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  gap: 12px;
  flex-shrink: 0;
}

/* 统计卡片组 */
.stats-group[data-v-790993c4] {
  grid-column: span 3;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

/* 用户卡片 */
/* 用户卡片 */
.user-card[data-v-790993c4] {
  padding: 18px 20px;
  display: flex;
  align-items: center;
  gap: 16px;
  background: linear-gradient(135deg, rgba(51, 112, 255, 0.06) 0%, rgba(22, 93, 255, 0.03) 100%);
}
.user-content[data-v-790993c4] {
  flex: 1;
  min-width: 0;
}
.user-content .greeting[data-v-790993c4] {
  font-size: 12px;
  color: #3370ff;
  margin-bottom: 3px;
  display: flex;
  align-items: center;
  gap: 5px;
  font-weight: 500;
  letter-spacing: 0.3px;
}
.greeting-icon[data-v-790993c4] {
  font-size: 14px;
  display: inline-block;
}
.user-content .name[data-v-790993c4] {
  font-size: 18px;
  font-weight: 600;
  color: #1f2329;
  margin-bottom: 6px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.3;
}
.user-content .roles[data-v-790993c4] {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.user-content .roles[data-v-790993c4] .n-tag {
  font-size: 12px;
  padding: 2px 10px;
  height: 22px;
  font-weight: 500;
  border-radius: 4px;
  transition: all 0.2s ease;
}
.user-content .roles[data-v-790993c4] .n-tag--primary {
  background: #3370ff;
  border: none;
  color: white;
}
.user-content .roles[data-v-790993c4] .n-tag:hover {
  opacity: 0.85;
}

/* 一言条 */
.hitokoto-bar[data-v-790993c4] {
  padding: 12px 18px;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 12px;
  flex-shrink: 0;
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.05) 0%, rgba(139, 92, 246, 0.03) 100%);
  border-left: 3px solid #6366f1;
  position: relative;
  overflow: hidden;
  transition: all 0.3s ease;
  min-height: 56px;
  width: 100%;
}
.hitokoto-bar[data-v-790993c4]::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(99, 102, 241, 0.03) 50%,
    transparent 100%
  );
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.hitokoto-bar[data-v-790993c4]:hover::before {
  opacity: 1;
}
.hitokoto-bar[data-v-790993c4]:hover {
  border-left-color: #4f46e5;
  box-shadow: 0 4px 12px rgba(99, 102, 241, 0.1);
  transform: translateY(-1px);
}
.hitokoto-icon-wrapper[data-v-790993c4] {
  flex-shrink: 0 !important;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.1) 0%, rgba(139, 92, 246, 0.08) 100%);
  border-radius: 8px;
  transition: all 0.3s ease;
  margin-top: 0;
  order: 1;
}
.hitokoto-bar:hover .hitokoto-icon-wrapper[data-v-790993c4] {
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.15) 0%, rgba(139, 92, 246, 0.12) 100%);
  transform: scale(1.05);
}
.hitokoto-icon[data-v-790993c4] {
  font-size: 18px;
  line-height: 1;
  filter: grayscale(0.2);
  transition: all 0.3s ease;
}
.hitokoto-bar:hover .hitokoto-icon[data-v-790993c4] {
  filter: grayscale(0);
  transform: rotate(5deg);
}
.hitokoto-wrapper[data-v-790993c4] {
  flex: 1 !important;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  position: relative;
  z-index: 1;
  order: 2;
}

/* 确保 transition 内部的容器是横向布局 */
.hitokoto-wrapper > div[data-v-790993c4],
.hitokoto-wrapper > * > div[data-v-790993c4] {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 12px;
  flex: 1;
  min-width: 0;
  width: 100%;
}

/* 更具体的选择器，确保样式生效 */
.hitokoto-wrapper .hitokoto-content[data-v-790993c4],
.hitokoto-wrapper .hitokoto-from[data-v-790993c4] {
  display: flex;
}
.hitokoto-bar .hitokoto-content[data-v-790993c4] {
  font-size: 14px;
  color: #2d3748;
  line-height: 1.6;
  font-weight: 400;
  letter-spacing: 0.3px;
  white-space: normal;
  word-break: break-word;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px;
  flex: 1 1 auto !important;
  min-width: 0;
  max-width: calc(100% - 100px);
}
.quote-mark[data-v-790993c4] {
  font-size: 16px;
  color: #6366f1;
  font-weight: 500;
  opacity: 0.8;
  line-height: 1;
}
.quote-start[data-v-790993c4] {
  margin-right: 2px;
}
.quote-end[data-v-790993c4] {
  margin-left: 2px;
}
.quote-text[data-v-790993c4] {
  color: #2d3748;
  font-style: italic;
}
.hitokoto-bar .hitokoto-from[data-v-790993c4] {
  font-size: 12px;
  color: #718096;
  display: flex !important;
  align-items: center;
  gap: 4px;
  flex-wrap: nowrap;
  margin-top: 0;
  flex-shrink: 0 !important;
  flex-grow: 0 !important;
  white-space: nowrap !important;
  min-width: fit-content;
}
.from-dash[data-v-790993c4] {
  color: #a0aec0;
  font-weight: 300;
}
.from-author[data-v-790993c4] {
  color: #4a5568;
  font-weight: 500;
}
.from-source[data-v-790993c4] {
  color: #718096;
  font-style: italic;
}
.hitokoto-decoration[data-v-790993c4] {
  position: absolute;
  right: -20px;
  top: -20px;
  width: 100px;
  height: 100px;
  background: radial-gradient(circle, rgba(99, 102, 241, 0.08) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
  opacity: 0.5;
}
.hitokoto-loading[data-v-790993c4] {
  border-left-color: #c9cdd4;
  background: linear-gradient(135deg, rgba(0, 0, 0, 0.02) 0%, rgba(0, 0, 0, 0.01) 100%);
}
.hitokoto-loading .hitokoto-icon-wrapper[data-v-790993c4] {
  background: rgba(0, 0, 0, 0.05);
}

/* 内容过渡动画 - 只在内容区域，不在整个卡片 */
.content-fade-enter-active[data-v-790993c4] {
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}
.content-fade-leave-active[data-v-790993c4] {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.content-fade-enter-from[data-v-790993c4] {
  opacity: 0;
  transform: translateX(-10px);
}
.content-fade-leave-to[data-v-790993c4] {
  opacity: 0;
  transform: translateX(10px);
}
.content-fade-enter-to[data-v-790993c4],
.content-fade-leave-from[data-v-790993c4] {
  opacity: 1;
  transform: translateX(0);
}

/* 天气卡片 */
.weather-card[data-v-790993c4] {
  padding: 18px 20px;
  display: flex;
  align-items: center;
  gap: 14px;
  background: linear-gradient(135deg, rgba(51, 112, 255, 0.06) 0%, rgba(22, 93, 255, 0.03) 100%);
}
.weather-icon[data-v-790993c4] {
  width: 44px;
  height: 44px;
  border-radius: 8px;
  background: #3370ff;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: all 0.2s ease;
}
.weather-card:hover .weather-icon[data-v-790993c4] {
  background: #245bdb;
}
.weather-content[data-v-790993c4] {
  flex: 1;
  min-width: 0;
}
.weather-temp[data-v-790993c4] {
  font-size: 20px;
  font-weight: 600;
  color: #3370ff;
  line-height: 1.2;
}
.weather-city[data-v-790993c4] {
  font-size: 13px;
  color: #1f2329;
  font-weight: 500;
  margin-top: 2px;
}
.weather-detail[data-v-790993c4] {
  font-size: 12px;
  color: #8f959e;
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.weather-loading[data-v-790993c4] {
  font-size: 12px;
  color: #8f959e;
}
.avatar-wrapper[data-v-790993c4] {
  position: relative;
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.avatar[data-v-790993c4] {
  width: 48px;
  height: 48px;
  border-radius: 8px;
  background: #3370ff;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 600;
  transition: all 0.2s ease;
}
.user-card:hover .avatar[data-v-790993c4] {
  background: #245bdb;
}
.info[data-v-790993c4] {
  min-width: 0;
  flex: 1;
}
.info .greeting[data-v-790993c4] {
  font-size: 11px;
  color: #6366f1;
  margin-bottom: 2px;
  display: flex;
  align-items: center;
  gap: 4px;
  font-weight: 500;
}
.greeting-icon[data-v-790993c4] {
  font-size: 12px;
  display: inline-block;
}
.info .name[data-v-790993c4] {
  font-size: 15px;
  font-weight: 700;
  color: #3d3b4f;
  margin-bottom: 4px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
}
.info .roles[data-v-790993c4] {
  display: flex;
  gap: 4px;
  flex-wrap: wrap;
}
.info .roles[data-v-790993c4] .n-tag {
  font-size: 10px;
  padding: 0 6px;
  height: 18px;
  font-weight: 500;
}

/* 统计卡片 */
.stat-card[data-v-790993c4] {
  padding: 0 !important;
}
.stat-card[data-v-790993c4] .n-card-body {
  padding: 18px 20px;
  display: flex;
  align-items: center;
  gap: 14px;
}
.stat-icon[data-v-790993c4] {
  width: 44px;
  height: 44px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: all 0.2s ease;
}
.stat-icon.icon-0[data-v-790993c4] {
  background: #3370ff;
  color: white;
}
.stat-card:hover .stat-icon.icon-0[data-v-790993c4] {
  background: #245bdb;
}
.stat-icon.icon-1[data-v-790993c4] {
  background: #ff7d00;
  color: white;
}
.stat-card:hover .stat-icon.icon-1[data-v-790993c4] {
  background: #d66a00;
}
.stat-icon.icon-2[data-v-790993c4] {
  background: #f54a45;
  color: white;
}
.stat-card:hover .stat-icon.icon-2[data-v-790993c4] {
  background: #d43730;
}
.stat-content[data-v-790993c4] {
  flex: 1;
  min-width: 0;
}
.stat-label[data-v-790993c4] {
  font-size: 12px;
  color: #8f959e;
  margin-bottom: 2px;
  font-weight: 400;
}
.stat-value[data-v-790993c4] {
  font-size: 20px;
  font-weight: 600;
  color: #1f2329;
  line-height: 1.2;
}
.stat-trend[data-v-790993c4] {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 12px;
  font-weight: 500;
  margin-top: 4px;
}
.stat-trend.up[data-v-790993c4] {
  color: #34c724;
}
.stat-trend.down[data-v-790993c4] {
  color: #f54a45;
}
.stat-glow[data-v-790993c4] {
  position: absolute;
  top: -50%;
  right: -50%;
  width: 100%;
  height: 100%;
  background: radial-gradient(circle, rgba(99, 102, 241, 0.1) 0%, transparent 70%);
  pointer-events: none;
}

/* 工作台 - 手机应用文件夹样式 */
.workbench-card[data-v-790993c4] {
  flex-shrink: 0;
}
.workbench-folder-grid[data-v-790993c4] {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
  gap: 20px;
  padding: 8px;
}
.wb-folder-item[data-v-790993c4] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 20px 12px;
  border-radius: 16px;
  background: #f8f9fa;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  animation: fadeInUp-790993c4 0.4s ease-out;
  animation-delay: var(--delay, 0s);
  animation-fill-mode: both;
  border: 2px solid transparent;
  position: relative;
  min-height: 120px;
}
.wb-folder-item[data-v-790993c4]:hover {
  background: #fff;
  transform: translateY(-6px) scale(1.05);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);
  border-color: #e0e0e0;
}
.wb-folder-item[data-v-790993c4]:active {
  transform: translateY(-3px) scale(1.02);
  transition: all 0.1s ease;
}
.wb-folder-icon[data-v-790993c4] {
  width: 64px;
  height: 64px;
  border-radius: 16px;
  background: linear-gradient(135deg, #3370ff 0%, #4d7fff 100%);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
  box-shadow: 0 6px 16px rgba(51, 112, 255, 0.35);
  transition: all 0.3s ease;
}

/* 不同分类的文件夹图标颜色 */
.wb-folder-people .wb-folder-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #3370ff 0%, #4d7fff 100%);
  box-shadow: 0 6px 16px rgba(51, 112, 255, 0.35);
}
.wb-folder-sales .wb-folder-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #52c41a 0%, #73d13d 100%);
  box-shadow: 0 6px 16px rgba(82, 196, 26, 0.35);
}
.wb-folder-procurement .wb-folder-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #1890ff 0%, #40a9ff 100%);
  box-shadow: 0 6px 16px rgba(24, 144, 255, 0.35);
}
.wb-folder-production .wb-folder-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #722ed1 0%, #9254de 100%);
  box-shadow: 0 6px 16px rgba(114, 46, 209, 0.35);
}
.wb-folder-warehouse .wb-folder-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #fa8c16 0%, #ffa940 100%);
  box-shadow: 0 6px 16px rgba(250, 140, 22, 0.35);
}
.wb-folder-finance .wb-folder-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #eb2f96 0%, #f759ab 100%);
  box-shadow: 0 6px 16px rgba(235, 47, 150, 0.35);
}
.wb-folder-quality .wb-folder-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #13c2c2 0%, #36cfc9 100%);
  box-shadow: 0 6px 16px rgba(19, 194, 194, 0.35);
}
.wb-folder-rd .wb-folder-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #faad14 0%, #ffc53d 100%);
  box-shadow: 0 6px 16px rgba(250, 173, 20, 0.35);
}
.wb-folder-system .wb-folder-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #595959 0%, #8c8c8c 100%);
  box-shadow: 0 6px 16px rgba(89, 89, 89, 0.35);
}
.wb-folder-item:hover .wb-folder-icon[data-v-790993c4] {
  transform: scale(1.1) rotate(5deg);
}
.wb-folder-label[data-v-790993c4] {
  font-size: 14px;
  color: #1f2329;
  text-align: center;
  line-height: 1.4;
  font-weight: 600;
  margin-bottom: 4px;
}
.wb-folder-count[data-v-790993c4] {
  font-size: 11px;
  color: #8f959e;
  background: rgba(0, 0, 0, 0.05);
  padding: 2px 8px;
  border-radius: 10px;
  font-weight: 500;
}

/* 文件夹弹窗样式 */
.folder-modal[data-v-790993c4] .n-card {
  border-radius: 20px;
  overflow: hidden;
}
.folder-modal-content[data-v-790993c4] {
  padding: 8px;
  min-height: 300px;
}
.folder-apps-grid[data-v-790993c4] {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
  gap: 20px;
  padding: 12px;
}
.folder-app-item[data-v-790993c4] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 16px 10px;
  border-radius: 14px;
  background: #f8f9fa;
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  animation: fadeInUp-790993c4 0.3s ease-out;
  animation-delay: var(--delay, 0s);
  animation-fill-mode: both;
  border: 1px solid transparent;
  min-height: 100px;
}
.folder-app-item[data-v-790993c4]:hover {
  background: #fff;
  transform: translateY(-4px) scale(1.05);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
  border-color: #e0e0e0;
}
.folder-app-item[data-v-790993c4]:active {
  transform: translateY(-2px) scale(0.98);
  transition: all 0.1s ease;
}
.folder-app-icon[data-v-790993c4] {
  width: 56px;
  height: 56px;
  border-radius: 14px;
  background: linear-gradient(135deg, #3370ff 0%, #4d7fff 100%);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
  box-shadow: 0 4px 12px rgba(51, 112, 255, 0.3);
  transition: all 0.2s ease;
}

/* 弹窗中不同分类的图标颜色 */
.folder-app-people .folder-app-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #3370ff 0%, #4d7fff 100%);
  box-shadow: 0 4px 12px rgba(51, 112, 255, 0.3);
}
.folder-app-sales .folder-app-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #52c41a 0%, #73d13d 100%);
  box-shadow: 0 4px 12px rgba(82, 196, 26, 0.3);
}
.folder-app-procurement .folder-app-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #1890ff 0%, #40a9ff 100%);
  box-shadow: 0 4px 12px rgba(24, 144, 255, 0.3);
}
.folder-app-production .folder-app-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #722ed1 0%, #9254de 100%);
  box-shadow: 0 4px 12px rgba(114, 46, 209, 0.3);
}
.folder-app-warehouse .folder-app-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #fa8c16 0%, #ffa940 100%);
  box-shadow: 0 4px 12px rgba(250, 140, 22, 0.3);
}
.folder-app-finance .folder-app-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #eb2f96 0%, #f759ab 100%);
  box-shadow: 0 4px 12px rgba(235, 47, 150, 0.3);
}
.folder-app-quality .folder-app-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #13c2c2 0%, #36cfc9 100%);
  box-shadow: 0 4px 12px rgba(19, 194, 194, 0.3);
}
.folder-app-rd .folder-app-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #faad14 0%, #ffc53d 100%);
  box-shadow: 0 4px 12px rgba(250, 173, 20, 0.3);
}
.folder-app-system .folder-app-icon[data-v-790993c4] {
  background: linear-gradient(135deg, #595959 0%, #8c8c8c 100%);
  box-shadow: 0 4px 12px rgba(89, 89, 89, 0.3);
}
.folder-app-item:hover .folder-app-icon[data-v-790993c4] {
  transform: scale(1.08);
}
.folder-app-label[data-v-790993c4] {
  font-size: 13px;
  color: #1f2329;
  text-align: center;
  line-height: 1.3;
  font-weight: 500;
  word-break: break-all;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
@keyframes fadeInUp-790993c4 {
from {
    opacity: 0;
    transform: translateY(10px);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}

/* 图表 */
.chart-card[data-v-790993c4] {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.chart-content[data-v-790993c4] {
  flex: 1;
  padding: 12px 16px;
}
.chart-area[data-v-790993c4] {
  width: 100%;
  height: 100%;
  min-height: 180px;
}

/* 右侧边栏 */
.side-area[data-v-790993c4] {
  display: flex;
  flex-direction: column;
  gap: 16px;
  overflow: hidden;
  z-index: 1;
}

/* 待办事项 */
.todo-card[data-v-790993c4] {
  flex-shrink: 0;
}
.todo-list[data-v-790993c4] {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.todo-item[data-v-790993c4] {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid rgba(79, 70, 140, 0.06);
  animation: slideUp 0.4s ease-out backwards;
  animation-delay: var(--delay);
  transition: all 0.2s ease;
}
.todo-item[data-v-790993c4]:hover {
  background: rgba(255, 255, 255, 0.9);
  transform: translateX(4px);
}
.todo-indicator[data-v-790993c4] {
  width: 4px;
  height: 100%;
  min-height: 36px;
  border-radius: 2px;
  flex-shrink: 0;
}
.todo-item.type-primary .todo-indicator[data-v-790993c4] {
  background: linear-gradient(180deg, #6366f1, #8b5cf6);
}
.todo-item.type-success .todo-indicator[data-v-790993c4] {
  background: linear-gradient(180deg, #10b981, #34d399);
}
.todo-item.type-warning .todo-indicator[data-v-790993c4] {
  background: linear-gradient(180deg, #f59e0b, #fbbf24);
}
.todo-item.type-info .todo-indicator[data-v-790993c4] {
  background: linear-gradient(180deg, #3b82f6, #60a5fa);
}
.todo-item.type-danger .todo-indicator[data-v-790993c4] {
  background: linear-gradient(180deg, #ef4444, #f87171);
}
.todo-content[data-v-790993c4] {
  flex: 1;
  min-width: 0;
}
.todo-text[data-v-790993c4] {
  font-size: 13px;
  color: #3d3b4f;
  line-height: 1.5;
  margin-bottom: 4px;
}
.todo-time[data-v-790993c4] {
  font-size: 11px;
  color: #9a96a8;
}

/* 订单列表 */
.orders-card[data-v-790993c4] {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.orders-content[data-v-790993c4] {
  flex: 1;
  padding: 0;
  overflow: auto;
}
.orders-list[data-v-790993c4] {
  padding: 12px 16px;
}
.order-item[data-v-790993c4] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px;
  margin-bottom: 8px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid rgba(79, 70, 140, 0.06);
  animation: slideUp 0.4s ease-out backwards;
  animation-delay: var(--delay);
  transition: all 0.2s ease;
}
.order-item[data-v-790993c4]:last-child {
  margin-bottom: 0;
}
.order-item[data-v-790993c4]:hover {
  background: rgba(255, 255, 255, 0.9);
  transform: translateX(4px);
  border-color: rgba(99, 102, 241, 0.15);
}
.order-no[data-v-790993c4] {
  font-size: 12px;
  font-weight: 600;
  color: #3d3b4f;
  font-family: 'SF Mono', 'Monaco', monospace;
}
.order-customer[data-v-790993c4] {
  font-size: 11px;
  color: #9a96a8;
  margin-top: 2px;
}
.order-right[data-v-790993c4] {
  text-align: right;
}
.order-amount[data-v-790993c4] {
  font-size: 14px;
  font-weight: 700;
  color: #6366f1;
  margin-bottom: 4px;
}

/* 响应式 */
@media (max-width: 1600px) {
.stat-value[data-v-790993c4] {
    font-size: 18px;
}
.weather-temp[data-v-790993c4] {
    font-size: 18px;
}
}
@media (max-width: 1400px) {
.top-section[data-v-790993c4] {
    grid-template-columns: repeat(5, 1fr);
}
.workbench-folder-grid[data-v-790993c4] {
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
}
}
@media (max-width: 1200px) {
.overview-page[data-v-790993c4] {
    grid-template-columns: 1fr 280px;
}
.top-section[data-v-790993c4] {
    grid-template-columns: repeat(3, 1fr);
}
.user-card[data-v-790993c4] {
    grid-column: span 1;
}
.weather-card[data-v-790993c4] {
    grid-column: span 1;
}
.workbench-folder-grid[data-v-790993c4] {
    grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
}
}
@media (max-width: 1000px) {
.overview-page[data-v-790993c4] {
    grid-template-columns: 1fr;
    overflow-y: auto;
}
.main-area[data-v-790993c4] {
    overflow: visible;
}
.top-section[data-v-790993c4] {
    grid-template-columns: repeat(2, 1fr);
}
.user-card[data-v-790993c4] {
    grid-column: span 1;
}
.weather-card[data-v-790993c4] {
    grid-column: span 1;
}
.stat-card[data-v-790993c4]:nth-child(5) {
    grid-column: span 2;
}
.side-area[data-v-790993c4] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
.todo-card[data-v-790993c4],
  .orders-card[data-v-790993c4] {
    min-height: 280px;
}
.chart-card[data-v-790993c4] {
    min-height: 280px;
}
}
@media (max-width: 768px) {
.overview-page[data-v-790993c4] {
    padding: 2px;
    gap: 10px;
}
.top-section[data-v-790993c4] {
    grid-template-columns: 1fr;
    gap: 10px;
}
.user-card[data-v-790993c4] {
    grid-column: span 1;
}
.weather-card[data-v-790993c4] {
    grid-column: span 1;
}
.stat-card[data-v-790993c4] {
    grid-column: span 1 !important;
}
.hitokoto-bar[data-v-790993c4] {
    padding: 10px 14px;
    gap: 10px;
    flex-direction: row !important;
    align-items: center !important;
    min-height: 48px;
}
.hitokoto-icon-wrapper[data-v-790993c4] {
    width: 28px;
    height: 28px;
    flex-shrink: 0;
}
.hitokoto-icon[data-v-790993c4] {
    font-size: 16px;
}
.hitokoto-wrapper > div[data-v-790993c4] {
    flex-direction: row !important;
    gap: 10px;
    align-items: center !important;
}
.hitokoto-bar .hitokoto-content[data-v-790993c4] {
    font-size: 13px;
    line-height: 1.5;
    flex: 1;
}
.hitokoto-bar .hitokoto-from[data-v-790993c4] {
    font-size: 11px;
    flex-shrink: 0;
    white-space: nowrap;
}
.quote-mark[data-v-790993c4] {
    font-size: 14px;
}
.workbench-folder-grid[data-v-790993c4] {
    grid-template-columns: repeat(auto-fill, minmax(85px, 1fr));
    gap: 16px;
}
.wb-folder-item[data-v-790993c4] {
    padding: 16px 10px;
    min-height: 100px;
}
.wb-folder-icon[data-v-790993c4] {
    width: 56px;
    height: 56px;
    margin-bottom: 10px;
}
.wb-folder-icon .n-icon[data-v-790993c4] {
    font-size: 28px;
}
.wb-folder-label[data-v-790993c4] {
    font-size: 13px;
}
.wb-folder-count[data-v-790993c4] {
    font-size: 10px;
}
.folder-apps-grid[data-v-790993c4] {
    grid-template-columns: repeat(auto-fill, minmax(75px, 1fr));
    gap: 16px;
}
.folder-app-item[data-v-790993c4] {
    padding: 12px 8px;
    min-height: 90px;
}
.folder-app-icon[data-v-790993c4] {
    width: 48px;
    height: 48px;
    margin-bottom: 8px;
}
.folder-app-icon .n-icon[data-v-790993c4] {
    font-size: 24px;
}
.folder-app-label[data-v-790993c4] {
    font-size: 12px;
}
.side-area[data-v-790993c4] {
    grid-template-columns: 1fr;
}
.todo-card[data-v-790993c4],
  .orders-card[data-v-790993c4] {
    min-height: 200px;
}
.chart-card[data-v-790993c4] {
    min-height: 220px;
}
.wb-group[data-v-790993c4] {
    padding: 12px;
}
.wb-links[data-v-790993c4] {
    gap: 4px;
}
.card-header[data-v-790993c4] {
    padding: 12px 14px;
}
.card-content[data-v-790993c4] {
    padding: 12px 14px;
}
}
@media (max-width: 480px) {
.user-card[data-v-790993c4] {
    gap: 12px;
    padding: 16px 18px;
}
.avatar-wrapper[data-v-790993c4] {
    width: 42px;
    height: 42px;
}
.avatar-ring[data-v-790993c4] {
    width: 42px;
    height: 42px;
}
.avatar-glow[data-v-790993c4] {
    width: 42px;
    height: 42px;
}
.avatar[data-v-790993c4] {
    width: 34px;
    height: 34px;
    font-size: 14px;
}
.user-content .name[data-v-790993c4] {
    font-size: 16px;
}
.user-content .greeting[data-v-790993c4] {
    font-size: 11px;
}
.greeting-icon[data-v-790993c4] {
    font-size: 13px;
}
.user-content .roles[data-v-790993c4] .n-tag {
    font-size: 10px;
    padding: 2px 8px;
    height: 20px;
}
.stat-icon[data-v-790993c4] {
    width: 32px;
    height: 32px;
}
.stat-value[data-v-790993c4] {
    font-size: 16px;
}
.weather-icon[data-v-790993c4] {
    width: 36px;
    height: 36px;
}
.weather-temp[data-v-790993c4] {
    font-size: 16px;
}
.order-no[data-v-790993c4] {
    font-size: 11px;
}
.order-amount[data-v-790993c4] {
    font-size: 12px;
}
}

.user-count[data-v-ac3f1dbb] {
  font-size: 13px;
  color: #6b7280;
  margin-right: 8px;
}

.item-count[data-v-87d27cd5] {
  font-size: 13px;
  color: #6b7280;
  margin-right: 8px;
}

.item-count[data-v-74756c9d] {
  font-size: 13px;
  color: #6b7280;
  margin-right: 8px;
}

.section-title[data-v-bf2a8572] {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 12px;
  color: #1f2329;
  padding-left: 10px;
  border-left: 3px solid #3370ff;
  line-height: 1;
}
.item-count[data-v-bf2a8572] {
  font-size: 13px;
  color: #6b7280;
  margin-right: 8px;
}
.amount-summary[data-v-bf2a8572] {
  padding: 12px 16px;
  background: #f9fafb;
  border-radius: 4px;
  margin-top: 12px;
}

.section-title[data-v-7aa032da] {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 12px;
  color: #1f2329;
  padding-left: 10px;
  border-left: 3px solid #3370ff;
  line-height: 1;
}
.item-count[data-v-7aa032da] {
  font-size: 13px;
  color: #6b7280;
  margin-right: 8px;
}
.amount-summary[data-v-7aa032da] {
  padding: 12px 16px;
  background: #f9fafb;
  border-radius: 4px;
  margin-top: 12px;
}

.section-title[data-v-737f0598] {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 12px;
  color: #1f2329;
  padding-left: 10px;
  border-left: 3px solid #3370ff;
  line-height: 1;
}
.item-count[data-v-737f0598] {
  font-size: 13px;
  color: #6b7280;
  margin-right: 8px;
}
.amount-summary[data-v-737f0598] {
  padding: 12px 16px;
  background: #f9fafb;
  border-radius: 4px;
  margin-top: 12px;
}

.section-title[data-v-0db03be0] {
  font-weight: 500;
  font-size: 14px;
  color: #1f2329;
  margin-bottom: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid #e0e0e6;
}
.amount-summary[data-v-0db03be0] {
  padding: 12px 16px;
  background: #f7f8fa;
  border-radius: 4px;
  margin-top: 12px;
}

.section-title[data-v-5c40a7ee] {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 12px;
  color: #1f2329;
  padding-left: 10px;
  border-left: 3px solid #3370ff;
  line-height: 1;
}
.item-count[data-v-5c40a7ee] {
  font-size: 13px;
  color: #6b7280;
  margin-right: 8px;
}
.stats-grid[data-v-5c40a7ee] {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 20px;
}
.stat-card[data-v-5c40a7ee] {
  background: #f8f9fa;
  border-radius: 8px;
  padding: 16px;
  text-align: center;
  border: 1px solid #e5e7eb;
}
.stat-value[data-v-5c40a7ee] {
  font-size: 24px;
  font-weight: 600;
  color: #1f2329;
  margin-bottom: 4px;
}
.stat-label[data-v-5c40a7ee] {
  font-size: 13px;
  color: #6b7280;
}
.rate-excellent[data-v-5c40a7ee] {
  color: #18a058;
}
.rate-good[data-v-5c40a7ee] {
  color: #2080f0;
}
.rate-average[data-v-5c40a7ee] {
  color: #f0a020;
}
.rate-poor[data-v-5c40a7ee] {
  color: #d03050;
}
.loading-wrap[data-v-5c40a7ee] {
  display: flex;
  justify-content: center;
  padding: 40px;
}
@media (max-width: 768px) {
.stats-grid[data-v-5c40a7ee] {
    grid-template-columns: repeat(2, 1fr);
}
}

.section-title[data-v-ee1b8b1f] {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 12px;
  color: #1f2329;
  padding-left: 10px;
  border-left: 3px solid #3370ff;
  line-height: 1;
}
.item-count[data-v-ee1b8b1f] {
  font-size: 13px;
  color: #6b7280;
  margin-right: 8px;
}

.item-count[data-v-43be7ed8] {
  font-size: 13px;
  color: #6b7280;
  margin-right: 8px;
}

.item-count[data-v-50a1e9ad] {
  font-size: 13px;
  color: #6b7280;
  margin-right: 8px;
}

.section-title[data-v-b456b45b] {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 12px;
  color: #1f2329;
  padding-left: 10px;
  border-left: 3px solid #3370ff;
  line-height: 1;
}
.item-count[data-v-b456b45b] {
  font-size: 13px;
  color: #6b7280;
  margin-right: 8px;
}

.item-count[data-v-695b3b53] {
  font-size: 13px;
  color: #6b7280;
  margin-right: 8px;
}
.section-label[data-v-695b3b53] {
  font-weight: 600;
  color: #1f2329;
}

/* 缺口物料行高亮 */
[data-v-695b3b53] .shortage-row {
  background-color: rgba(245, 74, 69, 0.08) !important;
}
[data-v-695b3b53] .shortage-row:hover {
  background-color: rgba(245, 74, 69, 0.12) !important;
}
[data-v-695b3b53] .shortage-row .n-data-table-td {
  background-color: rgba(245, 74, 69, 0.08) !important;
}
[data-v-695b3b53] .shortage-row:hover .n-data-table-td {
  background-color: rgba(245, 74, 69, 0.12) !important;
}

.code-text[data-v-cbbf8231] {
  font-family: 'SF Mono', 'Monaco', 'Menlo', 'Consolas', monospace;
  color: #3370ff;
  font-size: 13px;
}

.code-text[data-v-7d05ddc1] {
  font-family: 'SF Mono', 'Monaco', 'Menlo', 'Consolas', monospace;
  color: #3370ff;
  font-size: 13px;
}

/* 使用公共样式 .glass-tab-card 和 .modern-tabs */
/* 本地样式仅保留页面特有的样式 */

.item-count[data-v-9b8d1a83] {
  font-size: 13px;
  color: #6b7280;
  margin-right: 8px;
}

.item-count[data-v-6d7206bb] {
  font-size: 13px;
  color: #6b7280;
  margin-right: 8px;
}

/* 使用公共样式 .glass-tab-card, .modern-tabs, .tab-filter-header, .aging-analysis 等 */
/* 本地样式仅保留页面特有的样式 */
/* =================================================================
   Common Page Layout - Modern Style
   现代风格的页面布局和组件样式
   ================================================================= */

/* 页面基础容器 */
.page-container[data-v-12b35d02] {
  padding: 16px;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: transparent;
}

/* 页面头部 */
.page-header[data-v-12b35d02] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  flex-shrink: 0;
}
.page-header .header-left[data-v-12b35d02] {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* 返回按钮 */
.page-header .header-left > .n-button[data-v-12b35d02]:first-child {
  width: 32px;
  height: 32px;
  border-radius: 6px;
  background-color: #ffffff;
  border: 1px solid #dee0e3;
  transition: all 0.15s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}
.page-header .header-left > .n-button[data-v-12b35d02]:first-child:hover {
  background-color: #f0f1f2;
  border-color: #c9cdd4;
}
.page-header .header-left > .n-button:first-child .n-icon[data-v-12b35d02] {
  font-size: 16px;
  color: #646a73;
}
.page-title[data-v-12b35d02] {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
  color: #1f2329;
}
.page-header .header-actions[data-v-12b35d02] {
  display: flex;
  gap: 8px;
}

/* =================================================================
   Glass List Card - 列表卡片
   ================================================================= */
.glass-list-card[data-v-12b35d02] {
  border-radius: 12px !important;
  border: 1px solid rgba(222, 224, 227, 0.6) !important;
  background-color: rgba(255, 255, 255, 0.85) !important;
  backdrop-filter: blur(12px);
  box-shadow: none !important;
  flex: 1;
  min-height: 0;
  display: flex !important;
  flex-direction: column;
  overflow: hidden;
}
.glass-list-card > .n-card__content[data-v-12b35d02] {
  flex: 1;
  min-height: 0;
  padding: 0 !important;
}
.glass-list-card > .n-card-header[data-v-12b35d02] {
  padding: 14px 20px !important;
  font-weight: 500;
  background-color: rgba(248, 249, 250, 0.8);
  border-bottom: 1px solid rgba(240, 241, 242, 0.8);
}

/* =================================================================
   Glass Card - 通用卡片
   ================================================================= */
.glass-card[data-v-12b35d02] {
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.85) !important;
  backdrop-filter: blur(12px);
  border: 1px solid rgba(222, 224, 227, 0.6) !important;
  box-shadow: none !important;
  transition: border-color 0.15s ease;
}
.glass-card[data-v-12b35d02]:hover {
  border-color: rgba(201, 205, 212, 0.8) !important;
}

/* =================================================================
   Card Header Wrapper - 卡片头部工具栏
   ================================================================= */
.card-header-wrapper[data-v-12b35d02] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  flex-wrap: wrap;
  gap: 12px;
}
.card-header-wrapper .n-input[data-v-12b35d02],
.card-header-wrapper .n-base-selection[data-v-12b35d02],
.card-header-wrapper .n-base-selection-label[data-v-12b35d02],
.card-header-wrapper .n-date-picker[data-v-12b35d02] {
  background-color: rgba(255, 255, 255, 0.7) !important;
  border-radius: 6px !important;
  border-color: rgba(222, 224, 227, 0.6) !important;
}
.card-header-wrapper .n-date-picker .n-input[data-v-12b35d02] {
  background-color: transparent !important;
}
.card-header-wrapper .n-input[data-v-12b35d02]:hover,
.card-header-wrapper .n-base-selection[data-v-12b35d02]:hover,
.card-header-wrapper .n-date-picker[data-v-12b35d02]:hover {
  border-color: rgba(201, 205, 212, 0.8) !important;
  background-color: rgba(255, 255, 255, 0.9) !important;
}
.card-header-wrapper .n-input[data-v-12b35d02]:focus-within,
.card-header-wrapper .n-base-selection--active[data-v-12b35d02] {
  border-color: #3370ff !important;
}

/* =================================================================
   Glass Table Styles - 表格样式
   ================================================================= */
.glass-list-card .n-data-table .n-data-table-th[data-v-12b35d02] {
  background-color: rgba(100, 106, 115, 0.08) !important;
  font-weight: 600;
  color: #1f2329;
  border-bottom: 1px solid rgba(100, 106, 115, 0.15) !important;
  font-size: 13px;
  text-transform: none;
  letter-spacing: normal;
}
.glass-list-card .n-data-table .n-data-table-td[data-v-12b35d02] {
  background-color: rgba(255, 255, 255, 0.7) !important;
  transition: background-color 0.15s ease;
  border-bottom: 1px solid rgba(240, 241, 242, 0.6) !important;
  color: #1f2329;
  font-size: 13px;
}

/* 悬停高亮 */
.glass-list-card .n-data-table .n-data-table-tr:hover .n-data-table-td[data-v-12b35d02] {
  background-color: rgba(100, 106, 115, 0.06) !important;
}

/* 表格变量 */
.glass-list-card .n-data-table[data-v-12b35d02] {
  --n-th-color: rgba(100, 106, 115, 0.08) !important;
  --n-td-color: rgba(255, 255, 255, 0.7) !important;
  --n-border-color: rgba(240, 241, 242, 0.6) !important;
  --n-th-text-color: #1f2329 !important;
}

/* 选中行 */
.glass-list-card .n-data-table .n-data-table-tr--selected .n-data-table-td[data-v-12b35d02] {
  background-color: rgba(51, 112, 255, 0.1) !important;
}

/* 表格边框 */
.glass-list-card .n-data-table-wrapper[data-v-12b35d02] {
  border: none !important;
  border-radius: 0;
  overflow: hidden;
}
.glass-list-card .n-data-table-base-table-header[data-v-12b35d02],
.glass-list-card .n-data-table-base-table-body[data-v-12b35d02],
.glass-list-card .n-data-table-base-table[data-v-12b35d02] {
  border-left: none !important;
  border-right: none !important;
  border-top: none !important;
}
.glass-list-card .n-data-table[data-v-12b35d02] {
  border: none !important;
}
.glass-list-card .n-data-table .n-data-table-tr[data-v-12b35d02] {
  border-left: none !important;
  border-right: none !important;
}
.glass-list-card .n-data-table .n-data-table-th[data-v-12b35d02]:first-child,
.glass-list-card .n-data-table .n-data-table-td[data-v-12b35d02]:first-child {
  border-left: none !important;
}
.glass-list-card .n-data-table .n-data-table-th[data-v-12b35d02]:last-child,
.glass-list-card .n-data-table .n-data-table-td[data-v-12b35d02]:last-child {
  border-right: none !important;
}
.glass-list-card .n-data-table thead[data-v-12b35d02],
.glass-list-card .n-data-table tbody[data-v-12b35d02] {
  border-left: none !important;
  border-right: none !important;
}

/* 列分隔线 */
.glass-list-card .n-data-table .n-data-table-th[data-v-12b35d02],
.glass-list-card .n-data-table .n-data-table-td[data-v-12b35d02] {
  border-right: none;
}

/* 分页 */
.list-pagination[data-v-12b35d02] {
  padding: 12px 16px;
  background-color: rgba(255, 255, 255, 0.7);
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  border-top: 1px solid rgba(240, 241, 242, 0.6);
}
.glass-list-card > .n-card__content > .n-data-table > .n-data-table__pagination[data-v-12b35d02] {
  padding: 12px 16px;
  background-color: rgba(255, 255, 255, 0.7);
  justify-content: flex-end;
  border-top: 1px solid rgba(240, 241, 242, 0.6);
}

/* =================================================================
   Detail Section - 详情区块
   ================================================================= */
.detail-section[data-v-12b35d02] {
  margin-bottom: 20px;
  padding: 16px;
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(12px);
  border-radius: 12px;
  border: 1px solid rgba(222, 224, 227, 0.6);
}
.section-title[data-v-12b35d02] {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 16px;
  color: #1f2329;
  padding-left: 10px;
  border-left: 3px solid #3370ff;
  line-height: 1;
}

/* =================================================================
   Info Item - 信息项
   ================================================================= */
.info-item[data-v-12b35d02] {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px;
  background: #f8f9fa;
  border-radius: 6px;
}
.info-item .label[data-v-12b35d02] {
  font-size: 12px;
  color: #8f959e;
  font-weight: 400;
}
.info-item .value[data-v-12b35d02] {
  font-size: 14px;
  color: #1f2329;
  font-weight: 500;
}

/* =================================================================
   Card Header - 卡片头部
   ================================================================= */
.card-header[data-v-12b35d02] {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 600;
  color: #1f2329;
}
.card-header-icon[data-v-12b35d02] {
  font-size: 18px;
  color: #3370ff;
  padding: 6px;
  background: rgba(51, 112, 255, 0.1);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.card-header-icon.info[data-v-12b35d02] {
  color: #3370ff;
  background: rgba(51, 112, 255, 0.1);
}
.card-header-icon.success[data-v-12b35d02] {
  color: #34c724;
  background: rgba(52, 199, 36, 0.1);
}
.card-header-icon.warning[data-v-12b35d02] {
  color: #ff7d00;
  background: rgba(255, 125, 0, 0.1);
}
.card-header-icon.danger[data-v-12b35d02] {
  color: #f54a45;
  background: rgba(245, 74, 69, 0.1);
}

/* =================================================================
   Loading & Empty States
   ================================================================= */
.loading-state[data-v-12b35d02] {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 40px 0;
}
.loading-wrap[data-v-12b35d02] {
  display: flex;
  justify-content: center;
  padding: 24px;
}
.empty-state[data-v-12b35d02] {
  padding: 40px 0;
}
.empty-list[data-v-12b35d02] {
  text-align: center;
  padding: 24px;
  color: #8f959e;
  font-size: 13px;
}

/* =================================================================
   Count Badge
   ================================================================= */
.item-count[data-v-12b35d02],
.role-count[data-v-12b35d02],
.user-count[data-v-12b35d02],
.log-count[data-v-12b35d02] {
  font-size: 13px;
  color: #8f959e;
  margin-right: 8px;
}

/* =================================================================
   Custom Scrollbar
   ================================================================= */
.custom-scrollbar[data-v-12b35d02]::-webkit-scrollbar {
  width: 6px;
}
.custom-scrollbar[data-v-12b35d02]::-webkit-scrollbar-track {
  background: transparent;
}
.custom-scrollbar[data-v-12b35d02]::-webkit-scrollbar-thumb {
  background: #c9cdd4;
  border-radius: 3px;
}
.custom-scrollbar[data-v-12b35d02]::-webkit-scrollbar-thumb:hover {
  background: #8f959e;
}

/* =================================================================
   Split Container - 分栏布局
   ================================================================= */
.split-container[data-v-12b35d02] {
  display: flex !important;
  flex-direction: row !important;
  overflow: hidden;
  padding: 0 !important;
}

/* =================================================================
   Tree Panel - 树形面板
   ================================================================= */
.tree-panel[data-v-12b35d02] {
  width: 280px;
  border-right: 1px solid rgba(222, 224, 227, 0.6);
  display: flex;
  flex-direction: column;
  background: rgba(255, 255, 255, 0.8);
}
.panel-header[data-v-12b35d02] {
  padding: 12px 16px;
  display: flex;
  gap: 10px;
  align-items: center;
  border-bottom: 1px solid rgba(240, 241, 242, 0.6);
  background: rgba(255, 255, 255, 0.5);
}
.panel-body[data-v-12b35d02] {
  flex: 1;
  overflow-y: auto;
  padding: 12px;
}
.panel-footer[data-v-12b35d02] {
  padding: 12px 16px;
  background: rgba(248, 249, 250, 0.8);
  border-top: 1px solid rgba(240, 241, 242, 0.6);
}

/* =================================================================
   Detail Panel - 详情面板
   ================================================================= */
.detail-panel[data-v-12b35d02] {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
  background: transparent;
}
.detail-header[data-v-12b35d02] {
  padding: 20px 24px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  background: rgba(255, 255, 255, 0.8);
  border-bottom: 1px solid rgba(240, 241, 242, 0.6);
}
.detail-scroll[data-v-12b35d02] {
  flex: 1;
  overflow-y: auto;
  padding: 20px 24px;
}
.detail-empty[data-v-12b35d02] {
  margin: auto;
}

/* =================================================================
   Icon Box
   ================================================================= */
.icon-box[data-v-12b35d02] {
  background: #f8f9fa;
  padding: 10px;
  border-radius: 8px;
  border: 1px solid #dee0e3;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* =================================================================
   Danger Zone
   ================================================================= */
.danger-card[data-v-12b35d02] {
  background: #fff2f1 !important;
  border: 1px solid rgba(245, 74, 69, 0.2) !important;
}
.danger-card .n-card-header[data-v-12b35d02] {
  border-bottom: 1px solid rgba(245, 74, 69, 0.12);
}
.card-header.danger[data-v-12b35d02] {
  color: #f54a45;
}
.card-header.danger .card-header-icon[data-v-12b35d02] {
  color: #f54a45;
  background: rgba(245, 74, 69, 0.1);
}

/* =================================================================
   Modal Styles - 弹窗样式
   ================================================================= */
.modal-content[data-v-12b35d02] {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.modal-header-bar[data-v-12b35d02] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  background: #f8f9fa;
  border-radius: 6px;
  border: 1px solid #dee0e3;
}
.modal-header-bar .info[data-v-12b35d02] {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  color: #1f2329;
}
.modal-table-wrapper[data-v-12b35d02] {
  border: 1px solid #dee0e3;
  border-radius: 6px;
  overflow: hidden;
}
.modal-table-wrapper .n-data-table-th[data-v-12b35d02] {
  background: #f8f9fa !important;
  font-weight: 500;
  font-size: 13px;
}
.modal-table-wrapper .n-data-table-td[data-v-12b35d02] {
  padding: 10px 12px !important;
}
.modal-table-wrapper .n-data-table-tr:hover .n-data-table-td[data-v-12b35d02] {
  background: #f5f6f7 !important;
}
.modal-footer-info[data-v-12b35d02] {
  text-align: right;
  padding: 8px 0;
  font-size: 13px;
  color: #8f959e;
}
.modal-loading[data-v-12b35d02] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 40px;
  color: #8f959e;
}
.modal-empty[data-v-12b35d02] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px;
  color: #8f959e;
}

/* =================================================================
   Form Modal Styles
   ================================================================= */
.modal-form[data-v-12b35d02] {
  max-width: 100%;
}
.modal-form .n-form-item[data-v-12b35d02] {
  margin-bottom: 16px;
}
.modal-form .n-form-item-label[data-v-12b35d02] {
  font-weight: 500;
  color: #1f2329;
}
.modal-form .n-input[data-v-12b35d02],
.modal-form .n-select .n-base-selection[data-v-12b35d02] {
  background-color: #ffffff;
}

/* =================================================================
   Code Text
   ================================================================= */
.code-text[data-v-12b35d02] {
  font-family: 'SF Mono', 'Monaco', 'Menlo', 'Consolas', monospace;
  color: #3370ff;
  font-size: 13px;
}
.code-text.muted[data-v-12b35d02] {
  color: #8f959e;
}

/* =================================================================
   Tab Card - 现代风格 Tab 页签卡片
   ================================================================= */

/* Tab 卡片容器 */
.glass-tab-card[data-v-12b35d02] {
  border-radius: 12px !important;
  border: 1px solid rgba(222, 224, 227, 0.6) !important;
  background-color: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(12px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
  flex: 1;
  min-height: 0;
  display: flex !important;
  flex-direction: column;
  overflow: hidden;
}

/* Tab 组件 - 现代简洁设计 */
.modern-tabs[data-v-12b35d02] {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.modern-tabs .n-tabs-nav[data-v-12b35d02] {
  padding: 0 20px;
  background: #ffffff;
  border-bottom: 1px solid #ebedf0;
  position: relative;
}
.modern-tabs .n-tabs-nav[data-v-12b35d02]::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, #ebedf0 10%, #ebedf0 90%, transparent 100%);
}
.modern-tabs .n-tabs-tab[data-v-12b35d02] {
  padding: 14px 20px;
  font-size: 14px;
  font-weight: 500;
  color: #8f959e;
  transition: all 0.2s ease;
  border-radius: 0;
  margin: 0;
  position: relative;
  background: transparent;
  letter-spacing: 0.3px;
}
.modern-tabs .n-tabs-tab[data-v-12b35d02]::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%) scaleX(0);
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, #3370ff 0%, #5b8def 100%);
  border-radius: 2px 2px 0 0;
  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
.modern-tabs .n-tabs-tab[data-v-12b35d02]:hover {
  color: #3370ff;
  background: transparent;
}
.modern-tabs .n-tabs-tab[data-v-12b35d02]:hover::before {
  transform: translateX(-50%) scaleX(0.6);
}
.modern-tabs .n-tabs-tab--active[data-v-12b35d02] {
  color: #3370ff;
  font-weight: 600;
  background: transparent;
}
.modern-tabs .n-tabs-tab--active[data-v-12b35d02]::before {
  transform: translateX(-50%) scaleX(1);
}
.modern-tabs .n-tabs-bar[data-v-12b35d02] {
  display: none;
}
.modern-tabs .n-tabs-tab-pad[data-v-12b35d02] {
  width: 8px;
}
.modern-tabs .n-tabs-pane-wrapper[data-v-12b35d02] {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.modern-tabs .n-tab-pane[data-v-12b35d02] {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 0 !important;
}

/* Tab 标签文字动画效果 */
.modern-tabs .n-tabs-tab .n-tabs-tab__label[data-v-12b35d02] {
  position: relative;
  display: inline-block;
}

/* 选中状态的微妙缩放效果 */
.modern-tabs .n-tabs-tab--active .n-tabs-tab__label[data-v-12b35d02] {
  transform: scale(1.02);
}

/* Tab 内容面板 */
.tab-pane-content[data-v-12b35d02] {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

/* Tab 筛选栏样式 */
.tab-filter-header[data-v-12b35d02] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 24px;
  background: linear-gradient(180deg, #fafbfc 0%, #ffffff 100%);
  border-bottom: 1px solid #ebedf0;
  flex-wrap: wrap;
  gap: 12px;
}

/* 逾期行高亮 */
.overdue-row td[data-v-12b35d02] {
  background-color: rgba(208, 48, 80, 0.08) !important;
}
.overdue-row:hover td[data-v-12b35d02] {
  background-color: rgba(208, 48, 80, 0.12) !important;
}

/* 账龄分析样式 */
.aging-analysis[data-v-12b35d02] {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}
.aging-item[data-v-12b35d02] {
  padding: 20px 16px;
  background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
  border-radius: 10px;
  text-align: center;
  border: 1px solid #ebedf0;
  transition: all 0.2s ease;
}
.aging-item[data-v-12b35d02]:hover {
  border-color: #d0d3d6;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}
.aging-label[data-v-12b35d02] {
  font-size: 13px;
  color: #8f959e;
  margin-bottom: 10px;
  font-weight: 500;
}
.aging-value[data-v-12b35d02] {
  font-size: 22px;
  font-weight: 600;
  color: #1f2329;
}
.aging-value.warning[data-v-12b35d02] {
  color: #f0a020;
}
.aging-value.danger[data-v-12b35d02] {
  color: #d03050;
}

/* =================================================================
   Responsive Styles
   ================================================================= */
@media (max-width: 1200px) {
.page-container[data-v-12b35d02] {
    padding: 16px 20px;
}
.page-title[data-v-12b35d02] {
    font-size: 18px;
}
.tree-panel[data-v-12b35d02] {
    width: 260px;
}
}
@media (max-width: 1024px) {
.page-container[data-v-12b35d02] {
    padding: 12px 16px;
}
.page-header[data-v-12b35d02] {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 12px;
}
.page-header .header-left[data-v-12b35d02] {
    width: 100%;
}
.page-header .header-actions[data-v-12b35d02] {
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 8px;
}
.page-title[data-v-12b35d02] {
    font-size: 16px;
}
.card-header-wrapper[data-v-12b35d02] {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
}
.card-header-wrapper[data-v-12b35d02] > * {
    width: 100%;
}
.split-container[data-v-12b35d02] {
    flex-direction: column !important;
}
.tree-panel[data-v-12b35d02] {
    width: 100%;
    max-height: 280px;
    border-right: none;
    border-bottom: 1px solid #dee0e3;
}
.detail-panel[data-v-12b35d02] {
    min-height: 400px;
}
.glass-list-card .n-data-table-wrapper[data-v-12b35d02] {
    overflow-x: auto;
}
.glass-list-card .n-data-table[data-v-12b35d02] {
    min-width: 600px;
}
.glass-list-card .n-pagination[data-v-12b35d02] {
    padding: 10px 12px;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
}
}
@media (max-width: 768px) {
.page-container[data-v-12b35d02] {
    padding: 12px;
}
.page-header[data-v-12b35d02] {
    margin-bottom: 10px;
}
.page-header .header-left > .n-button[data-v-12b35d02]:first-child {
    width: 28px;
    height: 28px;
}
.page-title[data-v-12b35d02] {
    font-size: 15px;
}
.page-header .header-actions[data-v-12b35d02] {
    gap: 6px;
}
.page-header .header-actions .n-button[data-v-12b35d02] {
    font-size: 12px;
    padding: 0 10px;
    height: 28px;
}
.glass-list-card[data-v-12b35d02] {
    border-radius: 6px !important;
}
.glass-list-card > .n-card-header[data-v-12b35d02] {
    padding: 10px 12px !important;
    font-size: 14px;
}
.glass-list-card .n-data-table[data-v-12b35d02] {
    min-width: 500px;
    font-size: 12px;
}
.glass-list-card .n-data-table .n-data-table-th[data-v-12b35d02],
  .glass-list-card .n-data-table .n-data-table-td[data-v-12b35d02] {
    padding: 8px 10px !important;
    font-size: 12px;
}
.glass-list-card .n-pagination[data-v-12b35d02] {
    padding: 8px 10px;
}
.glass-list-card .n-pagination .n-pagination-item[data-v-12b35d02] {
    min-width: 28px;
    height: 28px;
    font-size: 12px;
}
.detail-section[data-v-12b35d02] {
    padding: 12px;
    margin-bottom: 12px;
}
.section-title[data-v-12b35d02] {
    font-size: 13px;
    margin-bottom: 12px;
}
.info-item[data-v-12b35d02] {
    padding: 10px;
}
.info-item .label[data-v-12b35d02] {
    font-size: 11px;
}
.info-item .value[data-v-12b35d02] {
    font-size: 13px;
}
.tree-panel[data-v-12b35d02] {
    max-height: 240px;
}
.panel-header[data-v-12b35d02] {
    padding: 10px 12px;
}
.panel-body[data-v-12b35d02] {
    padding: 8px;
}
.detail-header[data-v-12b35d02] {
    padding: 14px 16px;
    flex-direction: column;
    gap: 12px;
}
.detail-scroll[data-v-12b35d02] {
    padding: 14px 16px;
}
.modal-header-bar[data-v-12b35d02] {
    padding: 10px 12px;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
}
.modal-table-wrapper .n-data-table-th[data-v-12b35d02],
  .modal-table-wrapper .n-data-table-td[data-v-12b35d02] {
    padding: 8px !important;
    font-size: 12px;
}
}
@media (max-width: 480px) {
.page-container[data-v-12b35d02] {
    padding: 10px;
}
.page-title[data-v-12b35d02] {
    font-size: 14px;
}
.page-header .header-actions .n-button[data-v-12b35d02] {
    font-size: 11px;
    padding: 0 8px;
    height: 26px;
}
.glass-list-card .n-data-table[data-v-12b35d02] {
    min-width: 400px;
}
.glass-list-card .n-data-table .n-data-table-th[data-v-12b35d02],
  .glass-list-card .n-data-table .n-data-table-td[data-v-12b35d02] {
    padding: 6px 8px !important;
    font-size: 11px;
}
.glass-list-card .n-pagination .n-pagination-item[data-v-12b35d02] {
    min-width: 24px;
    height: 24px;
    font-size: 11px;
}
.tree-panel[data-v-12b35d02] {
    max-height: 200px;
}
.detail-header[data-v-12b35d02] {
    padding: 12px;
}
.detail-scroll[data-v-12b35d02] {
    padding: 12px;
}
.icon-box[data-v-12b35d02] {
    padding: 8px;
    border-radius: 6px;
}
}

/* 凭证详情样式 */
.voucher-detail[data-v-05ff460f] {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.voucher-detail .detail-section[data-v-05ff460f] {
  margin-bottom: 0;
}

.finance-reports-wrapper[data-v-631b1416] {
  height: 100%;
  width: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  position: relative;
}
.finance-reports[data-v-631b1416] {
  padding: 20px;
  background: #f5f7fa;
  overflow-y: auto;
  overflow-x: hidden;
  flex: 1;
  min-height: 0;
  -webkit-overflow-scrolling: touch;
  /* 隐藏滚动条但保持滚动功能 */
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE 10+ */
}
.finance-reports[data-v-631b1416]::-webkit-scrollbar {
  display: none; /* Chrome, Safari, Opera */
}
.stats-section[data-v-631b1416] {
  margin-bottom: 20px;
}
.detailed-stats-section[data-v-631b1416] {
  margin-bottom: 20px;
}
.charts-section[data-v-631b1416] {
  margin-bottom: 20px;
}
.table-section[data-v-631b1416] {
  margin-bottom: 20px;
}

/* 核心指标卡片样式 */
.stat-card[data-v-631b1416] {
  border-radius: 12px;
  transition: all 0.3s ease;
  overflow: hidden;
}
.stat-card[data-v-631b1416]:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}
.stat-card-content[data-v-631b1416] {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 8px;
}
.stat-icon-wrapper[data-v-631b1416] {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.stat-icon-wrapper.receivable[data-v-631b1416] {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
}
.stat-icon-wrapper.payable[data-v-631b1416] {
  background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
  color: white;
}
.stat-icon-wrapper.cashflow[data-v-631b1416] {
  background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
  color: white;
}
.stat-icon-wrapper.risk[data-v-631b1416] {
  background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
  color: white;
}
.stat-info[data-v-631b1416] {
  flex: 1;
  min-width: 0;
}
.stat-label[data-v-631b1416] {
  font-size: 13px;
  color: #8f959e;
  margin-bottom: 8px;
  font-weight: 500;
}
.stat-value[data-v-631b1416] {
  font-size: 24px;
  font-weight: 700;
  color: #1f2329;
  margin-bottom: 8px;
  line-height: 1.2;
}
.stat-value.positive[data-v-631b1416] {
  color: #18a058;
}
.stat-value.negative[data-v-631b1416] {
  color: #d03050;
}
.stat-detail[data-v-631b1416] {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
}
.detail-item[data-v-631b1416] {
  color: #646a73;
}
.detail-item.success[data-v-631b1416] {
  color: #18a058;
}
.detail-item.warning[data-v-631b1416] {
  color: #f0a020;
}
.detail-item.danger[data-v-631b1416] {
  color: #d03050;
}

/* 详细统计卡片样式 */
.detailed-card[data-v-631b1416] {
  height: 100%;
}
.detailed-card[data-v-631b1416] .n-card__content {
  padding: 20px !important;
}
.detailed-stats-grid[data-v-631b1416] {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}
.detailed-stat-item[data-v-631b1416] {
  padding: 16px;
  background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
  border-radius: 10px;
  border: 1px solid #ebedf0;
  transition: all 0.3s ease;
}
.detailed-stat-item[data-v-631b1416]:hover {
  border-color: #3370ff;
  box-shadow: 0 4px 12px rgba(51, 112, 255, 0.1);
}
.detailed-stat-label[data-v-631b1416] {
  font-size: 13px;
  color: #8f959e;
  margin-bottom: 8px;
  font-weight: 500;
}
.detailed-stat-value[data-v-631b1416] {
  font-size: 22px;
  font-weight: 700;
  color: #1f2329;
  margin-bottom: 8px;
}
.detailed-stat-value.primary[data-v-631b1416] {
  color: #3370ff;
}
.detailed-stat-value.success[data-v-631b1416] {
  color: #18a058;
}
.detailed-stat-value.warning[data-v-631b1416] {
  color: #f0a020;
}
.detailed-stat-value.danger[data-v-631b1416] {
  color: #d03050;
}
.detailed-stat-trend[data-v-631b1416] {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: #646a73;
}
.trend-text[data-v-631b1416] {
  font-weight: 500;
}
.detailed-stat-rate[data-v-631b1416] {
  font-size: 12px;
  color: #8f959e;
  margin-top: 4px;
}

/* 图表卡片样式 */
.chart-card[data-v-631b1416] {
  height: 100%;
}
.chart-card[data-v-631b1416] .n-card__content {
  padding: 20px !important;
  height: calc(100% - 50px);
}
.chart-container[data-v-631b1416] {
  width: 100%;
  height: 320px;
  min-height: 320px;
}

/* 表格卡片样式 */
.table-card[data-v-631b1416] {
  margin-top: 16px;
}
.table-card[data-v-631b1416] .n-card__content {
  padding: 0 !important;
}
.table-card[data-v-631b1416] .n-data-table {
  font-size: 13px;
}
.table-card[data-v-631b1416] .n-data-table .n-data-table-th {
  background: #fafafa;
  font-weight: 600;
  color: #1f2329;
}
.table-card[data-v-631b1416] .overdue-row {
  background-color: #fff2f0 !important;
}
.table-card[data-v-631b1416] .overdue-row:hover {
  background-color: #ffece8 !important;
}

/* 响应式布局 */
@media (max-width: 1400px) {
.stat-value[data-v-631b1416] {
    font-size: 20px;
}
.detailed-stats-grid[data-v-631b1416] {
    grid-template-columns: 1fr;
}
}
@media (max-width: 1200px) {
.finance-reports[data-v-631b1416] .n-grid {
    grid-template-columns: repeat(2, 1fr) !important;
}
.stat-value[data-v-631b1416] {
    font-size: 18px;
}
.detailed-stat-value[data-v-631b1416] {
    font-size: 20px;
}
}
@media (max-width: 768px) {
.finance-reports[data-v-631b1416] {
    padding: 12px;
}
.page-header[data-v-631b1416] {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}
.page-header .header-actions[data-v-631b1416] {
    width: 100%;
    flex-wrap: wrap;
}
.finance-reports[data-v-631b1416] .n-grid {
    grid-template-columns: 1fr !important;
}
.stat-card-content[data-v-631b1416] {
    flex-direction: column;
    text-align: center;
}
.stat-icon-wrapper[data-v-631b1416] {
    width: 48px;
    height: 48px;
}
.stat-value[data-v-631b1416] {
    font-size: 20px;
}
.detailed-stat-value[data-v-631b1416] {
    font-size: 18px;
}
.chart-container[data-v-631b1416] {
    height: 260px;
    min-height: 260px;
}
}

.split-container[data-v-86f5643b] {
  display: flex !important;
  flex-direction: row !important;
  overflow: hidden;
  padding: 0 !important;
}

/* ==================== 左侧树面板 ==================== */
.tree-panel[data-v-86f5643b] {
  width: 320px;
  border-right: 1px solid rgba(79, 70, 140, 0.1);
  display: flex;
  flex-direction: column;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.6) 0%, rgba(249, 250, 251, 0.4) 100%);
}
.panel-header[data-v-86f5643b] {
  padding: 16px;
  display: flex;
  gap: 10px;
  align-items: center;
  border-bottom: 1px solid rgba(79, 70, 140, 0.08);
  background: rgba(255, 255, 255, 0.5);
}
.panel-header[data-v-86f5643b] .n-input {
  background: rgba(255, 255, 255, 0.8) !important;
  border: 1px solid rgba(79, 70, 140, 0.15);
  border-radius: 8px;
}
.panel-header[data-v-86f5643b] .n-input:hover,
.panel-header[data-v-86f5643b] .n-input:focus-within {
  border-color: rgba(79, 70, 140, 0.35);
  box-shadow: 0 0 0 2px rgba(79, 70, 140, 0.08);
}
.tree-actions[data-v-86f5643b] .n-button {
  background: rgba(79, 70, 140, 0.08);
  border: 1px solid rgba(79, 70, 140, 0.15);
}
.tree-actions[data-v-86f5643b] .n-button:hover {
  background: rgba(79, 70, 140, 0.15);
  border-color: rgba(79, 70, 140, 0.25);
}
.panel-body[data-v-86f5643b] {
  flex: 1;
  overflow-y: auto;
  padding: 12px;
}
.panel-body[data-v-86f5643b]::-webkit-scrollbar {
  width: 6px;
}
.panel-body[data-v-86f5643b]::-webkit-scrollbar-thumb {
  background: rgba(79, 70, 140, 0.2);
  border-radius: 3px;
}
.panel-body[data-v-86f5643b]::-webkit-scrollbar-thumb:hover {
  background: rgba(79, 70, 140, 0.35);
}
.panel-footer[data-v-86f5643b] {
  padding: 12px 16px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.4) 0%, rgba(249, 250, 251, 0.6) 100%);
  border-top: 1px solid rgba(79, 70, 140, 0.08);
}

/* ==================== 右侧详情面板 ==================== */
.detail-panel[data-v-86f5643b] {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  position: relative;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.3) 0%, rgba(249, 250, 251, 0.5) 100%);
}
.detail-empty[data-v-86f5643b] {
  margin: auto;
}
.detail-empty[data-v-86f5643b] .n-empty__description {
  color: #9ca3af;
}
.node-detail[data-v-86f5643b] {
  display: flex;
  flex-direction: column;
  height: 100%;
  animation: fadeIn-86f5643b 0.3s ease;
}
@keyframes fadeIn-86f5643b {
from {
    opacity: 0;
    transform: translateY(10px);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}
.detail-header[data-v-86f5643b] {
  padding: 24px 28px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  background: linear-gradient(135deg, rgba(79, 70, 140, 0.06) 0%, rgba(255, 255, 255, 0.5) 100%);
  border-bottom: 1px solid rgba(79, 70, 140, 0.08);
}
.header-main[data-v-86f5643b] {
  display: flex;
  align-items: center;
  gap: 16px;
}
.node-icon-large[data-v-86f5643b] {
  background: linear-gradient(135deg, #fff 0%, #f8f9ff 100%);
  padding: 12px;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(79, 70, 140, 0.12);
  border: 1px solid rgba(79, 70, 140, 0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.header-info[data-v-86f5643b] {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
}
.node-title[data-v-86f5643b] {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  color: #1f2937;
  display: flex;
  align-items: center;
  letter-spacing: -0.025em;
  line-height: 1.2;
}
.node-code[data-v-86f5643b] {
  font-size: 13px;
  color: #6b7280;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  background: rgba(79, 70, 140, 0.06);
  border-radius: 6px;
  width: fit-content;
  margin-top: 6px;
}
.header-ops[data-v-86f5643b] .n-button {
  background: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(79, 70, 140, 0.15);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
}
.header-ops[data-v-86f5643b] .n-button:hover {
  background: rgba(79, 70, 140, 0.1);
  border-color: rgba(79, 70, 140, 0.25);
}
.detail-scroll[data-v-86f5643b] {
  flex: 1;
  overflow-y: auto;
  padding: 28px;
}
.detail-scroll[data-v-86f5643b]::-webkit-scrollbar {
  width: 6px;
}
.detail-scroll[data-v-86f5643b]::-webkit-scrollbar-thumb {
  background: rgba(79, 70, 140, 0.2);
  border-radius: 3px;
}

/* ==================== 详情区块 ==================== */
.detail-section[data-v-86f5643b] {
  margin-bottom: 28px;
  padding: 20px;
  background: rgba(255, 255, 255, 0.95);
  border-radius: 12px;
  border: 1px solid rgba(79, 70, 140, 0.15);
  box-shadow: 0 4px 12px rgba(79, 70, 140, 0.08);
}
.section-title[data-v-86f5643b] {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 20px;
  color: #4f468c;
  padding-left: 10px;
  border-left: 3px solid #6366f1;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.info-item[data-v-86f5643b] {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 16px;
  background: linear-gradient(135deg, #f8f9fc 0%, #f3f4f8 100%);
  border-radius: 10px;
  border: 1px solid rgba(79, 70, 140, 0.12);
}
.info-item .label[data-v-86f5643b] {
  font-size: 11px;
  color: #6b7280;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
}
.info-item .value[data-v-86f5643b] {
  font-size: 14px;
  color: #1f2937;
  font-weight: 500;
}

/* ==================== 员工卡片 ==================== */
.employee-grid[data-v-86f5643b] {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 14px;
}
.employee-card[data-v-86f5643b] {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border-radius: 10px;
  background: linear-gradient(135deg, #fff 0%, #fafbff 100%);
  border: 1px solid rgba(79, 70, 140, 0.1);
  transition: all 0.25s ease;
  cursor: pointer;
}
.employee-card[data-v-86f5643b]:hover {
  box-shadow: 0 8px 16px -4px rgba(79, 70, 140, 0.15);
  transform: translateY(-3px);
  border-color: rgba(79, 70, 140, 0.2);
}
.employee-card[data-v-86f5643b] .n-avatar {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.emp-info[data-v-86f5643b] {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  gap: 2px;
}
.emp-name[data-v-86f5643b] {
  font-weight: 600;
  font-size: 14px;
  color: #1f2937;
}
.emp-no[data-v-86f5643b] {
  font-size: 12px;
  color: #9ca3af;
}
.empty-list[data-v-86f5643b] {
  text-align: center;
  padding: 24px;
  color: #9ca3af;
  font-size: 13px;
}
.loading-wrap[data-v-86f5643b] {
  display: flex;
  justify-content: center;
  padding: 24px;
}
.loading-state[data-v-86f5643b] {
  display: flex;
  justify-content: center;
  padding: 40px 0;
}
.empty-state[data-v-86f5643b] {
  padding: 40px 0;
}

/* ==================== 组织树节点样式 ==================== */
.org-tree[data-v-86f5643b] .n-tree-node {
  border-radius: 8px;
  margin: 4px 0;
  transition: all 0.2s ease;
}
.org-tree[data-v-86f5643b] .n-tree-node-wrapper {
  padding: 2px 0;
}
.org-tree[data-v-86f5643b] .n-tree-node-content {
  padding: 8px 12px;
  border-radius: 8px;
  background: linear-gradient(135deg, #f0f0f8 0%, #e8e8f0 100%);
  border: 1px solid rgba(79, 70, 140, 0.18);
  transition: all 0.25s ease;
  cursor: pointer;
  box-shadow: 0 2px 4px rgba(79, 70, 140, 0.08);
}
.org-tree[data-v-86f5643b] .n-tree-node-content:hover {
  background: linear-gradient(135deg, rgba(79, 70, 140, 0.08) 0%, rgba(79, 70, 140, 0.04) 100%);
  border-color: rgba(79, 70, 140, 0.25);
  transform: translateX(4px);
  box-shadow: 0 4px 8px rgba(79, 70, 140, 0.1);
}
.org-tree[data-v-86f5643b] .n-tree-node--selected > .n-tree-node-content {
  background: linear-gradient(135deg, rgba(79, 70, 140, 0.15) 0%, rgba(79, 70, 140, 0.08) 100%);
  border-color: rgba(79, 70, 140, 0.35);
  box-shadow: 0 4px 12px rgba(79, 70, 140, 0.18);
}
.org-tree[data-v-86f5643b] .n-tree-node-content__text {
  color: #374151;
  font-weight: 500;
  font-size: 14px;
}
.org-tree[data-v-86f5643b] .n-tree-node--selected .n-tree-node-content__text {
  color: #4f468c;
  font-weight: 600;
}
.org-tree[data-v-86f5643b] .n-tree-node-switcher {
  color: #9ca3af;
  transition: all 0.2s ease;
}
.org-tree[data-v-86f5643b] .n-tree-node-switcher:hover {
  color: #4f468c;
  transform: scale(1.1);
}

/* 批量模式 checkbox 对齐 */
.org-tree[data-v-86f5643b] .n-tree-node-checkbox {
  display: flex;
  align-items: center;
  align-self: center;
  margin-right: 8px;
}
.org-tree[data-v-86f5643b] .n-tree-node-content-wrapper {
  display: flex;
  align-items: center;
}

.user-count[data-v-20ae0c32] {
  font-size: 13px;
  color: #6b7280;
  margin-right: 8px;
}

/* 修复表格内头像和用户名的对齐 */
[data-v-20ae0c32] .n-data-table-td .n-space {
  display: inline-flex !important;
  align-items: center !important;
}
[data-v-20ae0c32] .n-data-table-td .n-avatar {
  flex-shrink: 0;
}

/* 修复头像内文字垂直居中 */
[data-v-20ae0c32] .n-avatar {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
[data-v-20ae0c32] .n-avatar__text {
  line-height: 1 !important;
}

/* 页面特有样式已移除，使用 common-page.css */

/* 邀请弹窗样式 */
[data-v-20ae0c32] .invite-modal .n-card-header {
  display: none;
}
[data-v-20ae0c32] .invite-modal .n-card__content {
  padding: 0 !important;
}
[data-v-20ae0c32] .invite-modal .n-card__footer {
  padding: 24px 32px 32px !important;
  background: white;
}
.invite-header[data-v-20ae0c32] {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 40px 32px 24px;
  background: linear-gradient(180deg, rgba(79, 70, 140, 0.05) 0%, rgba(255, 255, 255, 0) 100%);
}
.close-btn[data-v-20ae0c32] {
  position: absolute;
  top: 16px;
  right: 16px;
  transition: transform 0.2s;
}
.close-btn[data-v-20ae0c32]:hover {
  background-color: rgba(0, 0, 0, 0.05);
  transform: rotate(90deg);
}
.invite-icon-wrapper[data-v-20ae0c32] {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: white;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(79, 70, 140, 0.1);
  margin-bottom: 20px;
}
.invite-title[data-v-20ae0c32] {
  font-size: 20px;
  font-weight: 600;
  color: #1f2937;
  margin-bottom: 8px;
}
.invite-subtitle[data-v-20ae0c32] {
  font-size: 14px;
  color: #6b7280;
}
.invite-form[data-v-20ae0c32] {
  padding: 0 48px;
}
.custom-input[data-v-20ae0c32],
.custom-select[data-v-20ae0c32] {
  text-align: left;
}
[data-v-20ae0c32] .custom-input .n-input__input-el,[data-v-20ae0c32] .custom-select .n-base-selection-label {
  height: 46px;
}
[data-v-20ae0c32] .n-input,[data-v-20ae0c32] .n-base-selection {
  border-radius: 10px;
}
[data-v-20ae0c32] .n-input:hover,[data-v-20ae0c32] .n-base-selection:hover {
  box-shadow: 0 0 0 1px #4f468c inset;
}
[data-v-20ae0c32] .n-input--focus,[data-v-20ae0c32] .n-base-selection--active {
  box-shadow: 0 0 0 2px rgba(79, 70, 140, 0.2);
}
.invite-hint[data-v-20ae0c32] {
  margin: 16px 48px 0;
  padding: 12px 16px;
  background: rgba(99, 102, 241, 0.08); /* Indigo-50 with opacity */
  border-radius: 10px;
  display: flex;
  align-items: flex-start;
  font-size: 13px;
  color: #4338ca; /* Indigo-700 */
  line-height: 1.5;
}
.invite-footer[data-v-20ae0c32] {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin-top: 8px;
}

.role-count[data-v-d34f300a] {
  font-size: 13px;
  color: #6b7280;
  margin-right: 8px;
}

/* 权限弹窗使用公共样式，仅保留特定覆盖 */
.permission-content[data-v-d34f300a] {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.permission-header[data-v-d34f300a] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  background: linear-gradient(135deg, rgba(79, 70, 140, 0.08) 0%, rgba(99, 102, 241, 0.05) 100%);
  border-radius: 10px;
  border: 1px solid rgba(79, 70, 140, 0.12);
}
.role-info[data-v-d34f300a] {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  color: #374151;
}
.permission-table-wrapper[data-v-d34f300a] {
  border: 1px solid rgba(79, 70, 140, 0.12);
  border-radius: 10px;
  overflow: hidden;
}
.permission-table-wrapper[data-v-d34f300a] .n-data-table-th {
  background: rgba(79, 70, 140, 0.08) !important;
  font-weight: 600;
  font-size: 13px;
}
.permission-table-wrapper[data-v-d34f300a] .n-data-table-td {
  padding: 10px 12px !important;
}
.permission-table-wrapper[data-v-d34f300a] .n-data-table-tr:hover .n-data-table-td {
  background: rgba(79, 70, 140, 0.04) !important;
}
.permission-summary[data-v-d34f300a] {
  text-align: right;
  padding: 8px 0;
  font-size: 13px;
}
.loading-permissions[data-v-d34f300a] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 40px;
  color: #6b7280;
}

.log-count[data-v-f37fa123] {
  font-size: 13px;
  color: #6b7280;
  margin-right: 8px;
}
.log-action[data-v-f37fa123] {
  word-break: break-word;
  max-width: 500px;
}
.log-details-section[data-v-f37fa123] {
  margin-top: 16px;
  border: 1px solid var(--n-border-color);
  border-radius: 4px;
  overflow: hidden;
}
.log-details-header[data-v-f37fa123] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 12px;
  background: var(--n-color-modal);
  border-bottom: 1px solid var(--n-border-color);
  font-weight: 600;
  font-size: 14px;
}
.log-details-content[data-v-f37fa123] {
  background: var(--n-color);
  padding: 12px;
  font-family: 'Consolas', 'Monaco', monospace;
  font-size: 12px;
  line-height: 1.6;
  margin: 0;
  white-space: pre-wrap;
  word-break: break-all;
}

.workflow-monitor[data-v-da05233c] {
  padding: 16px;
}
.stats-overview[data-v-da05233c] {
  margin-bottom: 16px;
}
.stat-card[data-v-da05233c] {
  padding: 12px 16px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.stat-card[data-v-da05233c]:hover {
  transform: translateY(-2px);
}
.stat-card.active[data-v-da05233c] {
  border-color: #3370ff !important;
  background: rgba(51, 112, 255, 0.05) !important;
}
.stat-content[data-v-da05233c] {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.stat-info[data-v-da05233c] {
  display: flex;
  flex-direction: column;
}
.stat-label[data-v-da05233c] {
  font-size: 12px;
  color: #8f959e;
  margin-bottom: 4px;
}
.stat-value[data-v-da05233c] {
  font-size: 20px;
  font-weight: 700;
  color: #1f2329;
}
.stat-icon[data-v-da05233c] {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.detail-content[data-v-da05233c] {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.workflow-steps[data-v-da05233c] {
  padding: 12px 0;
}
.record-user[data-v-da05233c] {
  font-weight: 500;
  color: #1f2329;
}
.record-content[data-v-da05233c] {
  margin-top: 4px;
}
.record-opinion[data-v-da05233c] {
  margin: 0 0 4px 0;
  color: #646a73;
  font-size: 13px;
}
.record-time[data-v-da05233c] {
  font-size: 12px;
  color: #8f959e;
}
@media (max-width: 1200px) {
.stats-overview[data-v-da05233c] .n-grid {
    --n-cols: 3 !important;
}
}
@media (max-width: 768px) {
.stats-overview[data-v-da05233c] .n-grid {
    --n-cols: 2 !important;
}
.stat-card[data-v-da05233c] {
    padding: 10px 12px;
}
.stat-value[data-v-da05233c] {
    font-size: 18px;
}
}

/* 页面容器 */
.page-container[data-v-2cd39032] {
  display: flex;
  flex-direction: column;
  height: 100%;
  /* 移除背景色，使用系统默认背景 */
  padding: 24px;
  overflow: hidden;
}

/* 页面头部 */
.page-header[data-v-2cd39032] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
  flex-shrink: 0;
}
.header-left[data-v-2cd39032] {
  display: flex;
  align-items: center;
  gap: 12px;
}
.page-title[data-v-2cd39032] {
  font-size: 22px;
  font-weight: 700;
  color: #1f2937;
  margin: 0;
  letter-spacing: -0.5px;
}
.header-actions[data-v-2cd39032] {
  display: flex;
  gap: 12px;
}

/* 滚动区域 */
.settings-scroll-area[data-v-2cd39032] {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
  overflow-y: auto;
  padding-bottom: 24px;
  padding-right: 8px; /* 给滚动条留空间 */
}
.settings-scroll-area.has-warning-bar[data-v-2cd39032] {
  padding-bottom: 100px;
}

/* 美化滚动条 */
.settings-scroll-area[data-v-2cd39032]::-webkit-scrollbar {
  width: 8px;
}
.settings-scroll-area[data-v-2cd39032]::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.04);
  border-radius: 4px;
}
.settings-scroll-area[data-v-2cd39032]::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #c4b5fd 0%, #a78bfa 100%);
  border-radius: 4px;
  transition: background 0.2s;
}
.settings-scroll-area[data-v-2cd39032]::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #a78bfa 0%, #8b5cf6 100%);
}

/* Firefox 滚动条 */
.settings-scroll-area[data-v-2cd39032] {
  scrollbar-width: thin;
  scrollbar-color: #a78bfa rgba(0, 0, 0, 0.04);
}

/* 加载容器 */
.loading-container[data-v-2cd39032] {
  padding: 40px 24px;
  min-height: 300px;
  background: rgba(255, 255, 255, 0.85);
  border-radius: 12px;
  backdrop-filter: blur(12px);
}

/* 玻璃卡片 */
.glass-card[data-v-2cd39032] {
  border-radius: 16px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  backdrop-filter: blur(16px);
  border: 1px solid rgba(79, 70, 140, 0.1) !important;
  box-shadow:
    0 4px 24px rgba(79, 70, 140, 0.08),
    0 1px 2px rgba(0, 0, 0, 0.04) !important;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}
.glass-card[data-v-2cd39032]:hover {
  box-shadow:
    0 8px 32px rgba(79, 70, 140, 0.12),
    0 2px 4px rgba(0, 0, 0, 0.04) !important;
}
.settings-card[data-v-2cd39032] .n-card-header {
  padding: 20px 24px 16px 24px;
  border-bottom: 1px solid rgba(79, 70, 140, 0.08);
}
.settings-card[data-v-2cd39032] .n-card__content {
  padding: 24px;
}

/* 卡片头部 */
.card-header[data-v-2cd39032] {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 17px;
  font-weight: 600;
  color: #1f2937;
}
.card-header-icon[data-v-2cd39032] {
  font-size: 22px;
  width: 40px;
  height: 40px;
  color: #4f468c;
  padding: 8px;
  background: rgba(79, 70, 140, 0.1);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.card-header-icon.security[data-v-2cd39032] {
  color: #2080f0;
  background: rgba(32, 128, 240, 0.1);
}
.card-header-icon.upload[data-v-2cd39032] {
  color: #18a058;
  background: rgba(24, 160, 88, 0.1);
}

/* 卡片内容布局 */
.settings-card-body[data-v-2cd39032] {
  display: flex;
  gap: 32px;
}
.settings-form-section[data-v-2cd39032] {
  flex: 1;
  min-width: 0;
}

/* 配置行 */
.config-grid[data-v-2cd39032] {
  display: flex;
  flex-direction: column;
}
.config-row[data-v-2cd39032] {
  display: flex;
  align-items: flex-start;
  padding: 16px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
}
.config-row[data-v-2cd39032]:last-child {
  border-bottom: none;
}
.config-row.logo-row[data-v-2cd39032] {
  padding-bottom: 24px;
  margin-bottom: 8px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.config-label-col[data-v-2cd39032] {
  width: 140px;
  flex-shrink: 0;
  padding-top: 6px;
}
.label-text[data-v-2cd39032] {
  display: block;
  font-size: 14px;
  font-weight: 500;
  color: #374151;
  margin-bottom: 4px;
}
.label-hint[data-v-2cd39032] {
  display: block;
  font-size: 12px;
  color: #9ca3af;
}
.system-badge[data-v-2cd39032] {
  color: #d03050;
  font-weight: bold;
  margin-left: 2px;
}
.config-value-col[data-v-2cd39032] {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.config-value-col[data-v-2cd39032] .n-input {
  max-width: 400px;
}

/* Logo 上传区域 */
.logo-upload-area[data-v-2cd39032] {
  flex-shrink: 0;
}
.logo-uploader-trigger[data-v-2cd39032] {
  width: 100px;
  height: 100px;
  border: 2px dashed #d1d5db;
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  transition: all 0.25s ease;
  background: #fafafa;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.logo-uploader-trigger[data-v-2cd39032]:hover {
  border-color: #4f468c;
  background: #faf9ff;
}
.logo-uploader-trigger.has-logo:hover .upload-overlay[data-v-2cd39032] {
  opacity: 1;
}
.logo-preview[data-v-2cd39032] {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 8px;
}
.logo-placeholder[data-v-2cd39032] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  color: #9ca3af;
  transition: color 0.2s;
}
.logo-placeholder span[data-v-2cd39032] {
  font-size: 12px;
}
.logo-uploader-trigger:hover .logo-placeholder[data-v-2cd39032] {
  color: #4f468c;
}
.upload-overlay[data-v-2cd39032] {
  position: absolute;
  inset: 0;
  background: rgba(79, 70, 140, 0.85);
  color: white;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  opacity: 0;
  transition: opacity 0.2s;
}
.upload-overlay span[data-v-2cd39032] {
  font-size: 12px;
}
.logo-url-section[data-v-2cd39032] {
  flex: 1;
  max-width: 300px;
}
.input-hint[data-v-2cd39032] {
  margin: 8px 0 0;
  font-size: 12px;
  color: #9ca3af;
  line-height: 1.5;
}

/* 右侧信息面板 */
.info-panel[data-v-2cd39032] {
  width: 260px;
  flex-shrink: 0;
  padding: 20px;
  background: linear-gradient(135deg, rgba(79, 70, 140, 0.04) 0%, rgba(99, 102, 241, 0.06) 100%);
  border-radius: 12px;
  border: 1px solid rgba(79, 70, 140, 0.12);
}
.info-panel-header[data-v-2cd39032] {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 600;
  color: #1f2937;
  margin-bottom: 16px;
}
.info-item[data-v-2cd39032] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
}
.info-label[data-v-2cd39032] {
  font-size: 13px;
  color: #6b7280;
}
.info-value[data-v-2cd39032] {
  font-size: 13px;
  font-weight: 500;
  color: #374151;
}
.info-tip[data-v-2cd39032] {
  display: flex;
  align-items: flex-start;
  gap: 6px;
  font-size: 12px;
  color: #9ca3af;
  line-height: 1.5;
  margin: 0;
}
.info-tip .n-icon[data-v-2cd39032] {
  flex-shrink: 0;
  margin-top: 2px;
  color: #f0a020;
}

/* 浮动警告条 */
.fixed-warning-bar[data-v-2cd39032] {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 100;
  width: auto;
  max-width: 600px;
  background: #fff !important;
  border-radius: 12px !important;
  box-shadow:
    0 4px 24px rgba(0, 0, 0, 0.12),
    0 0 0 1px rgba(240, 160, 32, 0.2) !important;
  padding: 12px 20px !important;
}

/* 滑入动画 */
.slide-up-enter-active[data-v-2cd39032],
.slide-up-leave-active[data-v-2cd39032] {
  transition: all 0.3s ease;
}
.slide-up-enter-from[data-v-2cd39032],
.slide-up-leave-to[data-v-2cd39032] {
  opacity: 0;
  transform: translateX(-50%) translateY(20px);
}

/* 响应式 */
@media (max-width: 1024px) {
.settings-card-body[data-v-2cd39032] {
    flex-direction: column;
}
.info-panel[data-v-2cd39032] {
    width: 100%;
}
}
@media (max-width: 768px) {
.page-container[data-v-2cd39032] {
    padding: 16px;
}
.config-row[data-v-2cd39032] {
    flex-direction: column;
    gap: 8px;
}
.config-row.logo-row[data-v-2cd39032] {
    flex-direction: column;
}
.config-label-col[data-v-2cd39032] {
    width: 100%;
    padding-top: 0;
}
.config-value-col[data-v-2cd39032] {
    width: 100%;
    flex-wrap: wrap;
}
.config-value-col[data-v-2cd39032] .n-input {
    max-width: 100%;
}
.logo-url-section[data-v-2cd39032] {
    max-width: 100%;
    width: 100%;
}
}

.settings-scroll-area[data-v-a53e4e8c] {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding-bottom: 24px;
}

/* 当有浮动保存条时，增加底部空间 */
.settings-scroll-area.has-warning-bar[data-v-a53e4e8c] {
  padding-bottom: 100px;
}
.loading-container[data-v-a53e4e8c] {
  padding: 40px 24px;
  min-height: 300px;
  background: rgba(255, 255, 255, 0.85);
  border-radius: 12px;
  backdrop-filter: blur(12px);
}

/* 玻璃卡片 */
.glass-card[data-v-a53e4e8c] {
  border-radius: 16px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  backdrop-filter: blur(16px);
  border: 1px solid rgba(79, 70, 140, 0.1) !important;
  box-shadow:
    0 4px 24px rgba(79, 70, 140, 0.08),
    0 1px 2px rgba(0, 0, 0, 0.04) !important;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}
.glass-card[data-v-a53e4e8c]:hover {
  box-shadow:
    0 8px 32px rgba(79, 70, 140, 0.12),
    0 2px 4px rgba(0, 0, 0, 0.04) !important;
}
.settings-card[data-v-a53e4e8c] .n-card-header {
  padding: 20px 24px 16px 24px;
  border-bottom: 1px solid rgba(79, 70, 140, 0.08);
}
.settings-card[data-v-a53e4e8c] .n-card__content {
  padding: 20px 24px 24px 24px;
}

/* 卡片头部 */
.card-header[data-v-a53e4e8c] {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 17px;
  font-weight: 600;
  color: #1f2937;
}
.card-header-icon[data-v-a53e4e8c] {
  font-size: 20px;
  color: #4f468c;
  padding: 8px;
  background: rgba(79, 70, 140, 0.1);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  flex-shrink: 0;
}
.card-header-icon.invite[data-v-a53e4e8c] {
  color: #2080f0;
  background: rgba(32, 128, 240, 0.1);
}
.card-header.danger[data-v-a53e4e8c] {
  color: #d03050;
}
.card-header.danger .card-header-icon[data-v-a53e4e8c] {
  color: #d03050;
  background: rgba(208, 48, 80, 0.1);
}

/* 表单 */
.config-form[data-v-a53e4e8c] {
  max-width: 100%;
}
.config-form[data-v-a53e4e8c] .n-form-item {
  margin-bottom: 22px;
}
.config-form[data-v-a53e4e8c] .n-form-item-label {
  font-weight: 500;
  color: #374151;
}
.config-form[data-v-a53e4e8c] .n-input {
  background-color: rgba(255, 255, 255, 0.8);
}
.config-form[data-v-a53e4e8c] .n-input:hover,
.config-form[data-v-a53e4e8c] .n-input:focus-within {
  background-color: rgba(255, 255, 255, 1);
}

/* 卡片内容左右布局 */
.settings-card-body[data-v-a53e4e8c] {
  display: flex;
  gap: 32px;
}
.settings-form-section[data-v-a53e4e8c] {
  flex: 1;
  min-width: 0;
}

/* 右侧邀请成员区域 */
.invite-section[data-v-a53e4e8c] {
  width: 280px;
  flex-shrink: 0;
  padding: 20px;
  background: linear-gradient(135deg, rgba(32, 128, 240, 0.04) 0%, rgba(79, 70, 140, 0.06) 100%);
  border-radius: 12px;
  border: 1px solid rgba(32, 128, 240, 0.12);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.invite-section-header[data-v-a53e4e8c] {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 600;
  color: #1f2937;
  margin-bottom: 12px;
}
.invite-desc[data-v-a53e4e8c] {
  font-size: 13px;
  line-height: 1.6;
}
.invite-code-box[data-v-a53e4e8c] {
  margin-top: 20px;
  padding: 16px;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 10px;
  border: 1px solid rgba(79, 70, 140, 0.15);
  width: 100%;
}
.invite-code-box .invite-code-label[data-v-a53e4e8c] {
  font-size: 12px;
  color: #6b7280;
  margin-bottom: 8px;
}
.invite-code-box .invite-code-value[data-v-a53e4e8c] {
  font-family: 'SF Mono', 'Monaco', 'Menlo', 'Consolas', monospace;
  font-size: 24px;
  font-weight: 700;
  color: #4f468c;
  letter-spacing: 4px;
  margin-bottom: 12px;
}
.invite-code-box .invite-code-hint[data-v-a53e4e8c] {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  margin-top: 12px;
  font-size: 12px;
}

/* Logo上传区域 */
.logo-upload-area[data-v-a53e4e8c] {
  display: flex;
  gap: 24px;
  align-items: flex-start;
}
.logo-uploader-trigger[data-v-a53e4e8c] {
  width: 100px;
  height: 100px;
  border: 2px dashed rgba(79, 70, 140, 0.25);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  background: linear-gradient(135deg, rgba(79, 70, 140, 0.03) 0%, rgba(79, 70, 140, 0.06) 100%);
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
}
.logo-uploader-trigger[data-v-a53e4e8c]:hover {
  border-color: #4f468c;
  background: linear-gradient(135deg, rgba(79, 70, 140, 0.06) 0%, rgba(79, 70, 140, 0.1) 100%);
}
.logo-uploader-trigger.has-logo[data-v-a53e4e8c] {
  border-style: solid;
  border-color: rgba(79, 70, 140, 0.2);
}
.logo-placeholder[data-v-a53e4e8c] {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  color: #6b7280;
  font-size: 12px;
}
.logo-preview[data-v-a53e4e8c] {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 8px;
}
.logo-overlay[data-v-a53e4e8c] {
  position: absolute;
  inset: 0;
  background: rgba(79, 70, 140, 0.7);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  color: white;
  font-size: 12px;
  opacity: 0;
  transition: opacity 0.2s ease;
}
.logo-uploader-trigger:hover .logo-overlay[data-v-a53e4e8c] {
  opacity: 1;
}
.logo-input-group[data-v-a53e4e8c] {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.logo-hint[data-v-a53e4e8c] {
  font-size: 12px;
  line-height: 1.5;
}

/* 危险区域 */
.danger-card[data-v-a53e4e8c] {
  background: linear-gradient(
    135deg,
    rgba(254, 242, 242, 0.95) 0%,
    rgba(254, 226, 226, 0.9) 100%
  ) !important;
  border: 1px solid rgba(208, 48, 80, 0.2) !important;
}
.danger-card[data-v-a53e4e8c] .n-card-header {
  border-bottom: 1px solid rgba(208, 48, 80, 0.12);
}
.danger-item[data-v-a53e4e8c] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
}
.danger-info[data-v-a53e4e8c] {
  flex: 1;
}
.danger-title[data-v-a53e4e8c] {
  display: block;
  font-size: 15px;
  margin-bottom: 8px;
  color: #991b1b;
}
.danger-desc[data-v-a53e4e8c] {
  display: block;
  font-size: 13px;
  line-height: 1.7;
  color: #7f1d1d;
}

/* 浮动保存条 */
.fixed-warning-bar[data-v-a53e4e8c] {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  width: auto;
  min-width: 420px;
  max-width: 600px;
  z-index: 1000;
  background: rgba(255, 255, 255, 0.98) !important;
  backdrop-filter: blur(16px);
  box-shadow:
    0 12px 40px rgba(79, 70, 140, 0.2),
    0 4px 12px rgba(0, 0, 0, 0.08);
  border-radius: 16px !important;
  border: 1px solid rgba(79, 70, 140, 0.1);
}

/* 动画 */
.slide-up-enter-active[data-v-a53e4e8c],
.slide-up-leave-active[data-v-a53e4e8c] {
  transition: all 0.3s ease;
}
.slide-up-enter-from[data-v-a53e4e8c],
.slide-up-leave-to[data-v-a53e4e8c] {
  opacity: 0;
  transform: translateX(-50%) translateY(20px);
}
@media (max-width: 768px) {
.settings-card-body[data-v-a53e4e8c] {
    flex-direction: column;
}
.invite-section[data-v-a53e4e8c] {
    width: 100%;
}
.logo-upload-area[data-v-a53e4e8c] {
    flex-direction: column;
    gap: 16px;
}
.logo-uploader-trigger[data-v-a53e4e8c] {
    width: 100%;
    max-width: 120px;
}
.logo-input-group[data-v-a53e4e8c] {
    width: 100%;
}
.danger-item[data-v-a53e4e8c] {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
}
.fixed-warning-bar[data-v-a53e4e8c] {
    left: 16px;
    right: 16px;
    transform: none;
    min-width: auto;
}
.slide-up-enter-from[data-v-a53e4e8c],
  .slide-up-leave-to[data-v-a53e4e8c] {
    transform: translateY(20px);
}
.plans-grid[data-v-a53e4e8c] {
    grid-template-columns: 1fr;
}
}

/* 升级套餐弹窗 */
.upgrade-content[data-v-a53e4e8c] {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.current-plan-info[data-v-a53e4e8c] {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  background: linear-gradient(135deg, rgba(79, 70, 140, 0.08) 0%, rgba(99, 102, 241, 0.05) 100%);
  border-radius: 10px;
  border: 1px solid rgba(79, 70, 140, 0.12);
  font-size: 14px;
  color: #374151;
  width: fit-content;
}

/* 布局: 左右分栏 */
.selection-layout[data-v-a53e4e8c] {
  display: flex;
  gap: 32px;
  align-items: flex-start;
}
.plans-column[data-v-a53e4e8c] {
  flex: 1;
}
.duration-sidebar[data-v-a53e4e8c] {
  width: 280px;
  flex-shrink: 0;
}

/* Sidebar Styling */
.sidebar-card[data-v-a53e4e8c] {
  background: #fff;
  border-radius: 12px;
  padding: 24px;
  border: 1px solid #eef0f3;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
}
.sidebar-title[data-v-a53e4e8c] {
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 16px 0;
  color: #1f2937;
}
.duration-list[data-v-a53e4e8c] {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.duration-option[data-v-a53e4e8c] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s;
}
.duration-option[data-v-a53e4e8c]:hover:not(.disabled) {
  border-color: #4f468c;
  background: #fbfbfe;
}
.duration-option.selected[data-v-a53e4e8c] {
  border-color: #4f468c;
  background: linear-gradient(135deg, rgba(79, 70, 140, 0.05) 0%, rgba(99, 102, 241, 0.08) 100%);
}
.duration-option.disabled[data-v-a53e4e8c] {
  opacity: 0.5;
  cursor: not-allowed;
  background: #f9fafb;
}
.duration-info-col[data-v-a53e4e8c] {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.duration-top-row[data-v-a53e4e8c] {
  display: flex;
  align-items: center;
}
.duration-text[data-v-a53e4e8c] {
  font-size: 14px;
  color: #374151;
  font-weight: 500;
}
.duration-avg-price[data-v-a53e4e8c] {
  font-size: 12px;
  color: #18a058;
  margin-top: 4px;
  font-weight: 500;
}

/* 订单摘要 */
.order-summary[data-v-a53e4e8c] {
  margin-top: 8px;
  display: flex;
  flex-direction: column;
}
.summary-row[data-v-a53e4e8c] {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 8px;
  font-size: 13px;
  color: #6b7280;
}
.summary-row.upgrade-diff[data-v-a53e4e8c] {
  color: #f59e0b;
}
.summary-row.total span[data-v-a53e4e8c]:first-child {
  font-size: 15px;
  color: #4b5563;
  font-weight: 500;
}
.final-price-wrapper[data-v-a53e4e8c] {
  color: #d03050;
  display: flex;
  align-items: baseline;
}
.price-symbol[data-v-a53e4e8c] {
  font-size: 16px;
  font-weight: 600;
  margin-right: 2px;
}
.final-price[data-v-a53e4e8c] {
  font-size: 28px;
  font-weight: 800;
  line-height: 1;
}
.summary-tip[data-v-a53e4e8c] {
  align-self: flex-end;
  text-align: right;
  font-size: 12px;
  color: #18a058;
  background: #f0fdf4;
  padding: 4px 8px;
  border-radius: 4px;
  margin-top: 4px;
}

/* 套餐卡片网格 */
.plans-grid[data-v-a53e4e8c] {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
.plan-card[data-v-a53e4e8c] {
  border: 1px solid #eef0f3;
  border-radius: 12px;
  padding: 24px 20px;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  background: #fff;
  display: flex;
  flex-direction: column;
  width: calc((100% - 32px) / 3);
  min-width: 180px;
}
.plan-card[data-v-a53e4e8c]:hover:not(.disabled):not(.current) {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  border-color: transparent;
}
.plan-card.selected[data-v-a53e4e8c] {
  border-color: #4f468c !important;
  background: linear-gradient(
    135deg,
    rgba(79, 70, 140, 0.05) 0%,
    rgba(99, 102, 241, 0.08) 100%
  ) !important;
  box-shadow: 0 0 0 1px #4f468c !important;
}
.plan-card.current[data-v-a53e4e8c] {
  border-color: #4f468c;
  background: linear-gradient(135deg, rgba(79, 70, 140, 0.05) 0%, rgba(99, 102, 241, 0.08) 100%);
}
.plan-card.disabled[data-v-a53e4e8c] {
  opacity: 0.5;
  cursor: not-allowed;
}
.plan-badge[data-v-a53e4e8c] {
  position: absolute;
  top: -8px;
  right: 12px;
  background: linear-gradient(135deg, #4f468c 0%, #6366f1 100%);
  color: white;
  font-size: 11px;
  padding: 2px 10px;
  border-radius: 10px;
  font-weight: 500;
}
.plan-badge.recommend[data-v-a53e4e8c] {
  background: linear-gradient(135deg, #f59e0b 0%, #f97316 100%);
}
.plan-header h3[data-v-a53e4e8c] {
  margin: 0 0 12px 0;
  font-size: 16px;
  color: #1f2937;
}
.price[data-v-a53e4e8c] {
  margin-bottom: 8px;
  color: #1f2937;
}
.price.free .amount[data-v-a53e4e8c] {
  font-size: 24px;
  color: #18a058;
}
.currency[data-v-a53e4e8c] {
  font-size: 14px;
  vertical-align: top;
  margin-right: 2px;
}
.amount[data-v-a53e4e8c] {
  font-size: 28px;
  font-weight: bold;
}
.period[data-v-a53e4e8c] {
  font-size: 12px;
  color: #9ca3af;
}
.features[data-v-a53e4e8c] {
  list-style: none;
  padding: 0;
  margin: 0;
  flex: 1;
}
.features li[data-v-a53e4e8c] {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  font-size: 13px;
  color: #4b5563;
}
.select-indicator[data-v-a53e4e8c] {
  position: absolute;
  top: 12px;
  right: 12px;
  color: #4f468c;
  font-size: 22px;
  opacity: 0;
  transition: opacity 0.3s;
}
.plan-card.selected .select-indicator[data-v-a53e4e8c] {
  opacity: 1;
}

/* 响应式 */
@media (max-width: 1024px) {
.selection-layout[data-v-a53e4e8c] {
    flex-direction: column;
}
.duration-sidebar[data-v-a53e4e8c] {
    width: 100%;
}
.plan-card[data-v-a53e4e8c] {
    width: calc((100% - 16px) / 2);
}
}
@media (max-width: 600px) {
.plan-card[data-v-a53e4e8c] {
    width: 100%;
}
}

.page-container[data-v-994ed557] {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 20px;
  overflow: hidden;
}
.page-header[data-v-994ed557] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  flex-shrink: 0;
}
.header-left[data-v-994ed557] {
  display: flex;
  align-items: center;
  gap: 12px;
}
.page-title[data-v-994ed557] {
  font-size: 20px;
  font-weight: 600;
  color: #1f2329;
  margin: 0;
}
.loading-container[data-v-994ed557] {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}
.changelog-scroll-area[data-v-994ed557] {
  flex: 1;
  overflow-y: auto;
  overflow-x: hidden;
}
.changelog-card[data-v-994ed557] {
  min-height: 100%;
  border-radius: 16px;
}
.changelog-timeline[data-v-994ed557] {
  position: relative;
  padding: 16px 0 8px 8px;
}
.timeline-line[data-v-994ed557] {
  position: absolute;
  top: 32px;
  bottom: 16px;
  left: 18px;
  width: 2px;
  background: linear-gradient(to bottom, #e5e7eb, #d1d5db);
}
.changelog-item[data-v-994ed557] {
  position: relative;
  display: flex;
  gap: 12px;
  padding: 12px 16px 12px 32px;
}
.timeline-dot[data-v-994ed557] {
  position: absolute;
  left: 12px;
  top: 22px;
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: #4f46e5;
  box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.16);
}
.changelog-inner[data-v-994ed557] {
  flex: 1;
  padding: 12px 16px;
  border-radius: 12px;
  background: linear-gradient(135deg, #f9fafb 0%, #ffffff 100%);
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04);
  border: 1px solid #edf0f5;
}
.changelog-header[data-v-994ed557] {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
}
.changelog-date[data-v-994ed557] {
  font-size: 13px;
  color: #8f959e;
}
.changelog-title[data-v-994ed557] {
  font-size: 16px;
  font-weight: 600;
  color: #1f2329;
  margin-bottom: 8px;
}
.changelog-list[data-v-994ed557] {
  margin: 0;
  padding-left: 24px;
  list-style-type: disc;
}
.changelog-list li[data-v-994ed557] {
  font-size: 14px;
  color: #646a73;
  line-height: 1.8;
  margin-bottom: 4px;
}
.changelog-list li[data-v-994ed557]:last-child {
  margin-bottom: 0;
}

/* 响应式 */
@media (max-width: 768px) {
.page-container[data-v-994ed557] {
    padding: 16px;
}
}

.page-container[data-v-09d35ea1] {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 20px;
  overflow: hidden;
}
.page-header[data-v-09d35ea1] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  flex-shrink: 0;
}
.header-left[data-v-09d35ea1] {
  display: flex;
  align-items: center;
  gap: 12px;
}
.page-title[data-v-09d35ea1] {
  font-size: 20px;
  font-weight: 600;
  color: #1f2329;
  margin: 0;
}
.header-actions[data-v-09d35ea1] {
  display: flex;
  gap: 8px;
}
.card-header-wrapper[data-v-09d35ea1] {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.log-count[data-v-09d35ea1] {
  font-size: 13px;
  color: #6b7280;
}
.items-editor[data-v-09d35ea1] {
  width: 100%;
}
.item-row[data-v-09d35ea1] {
  display: flex;
  gap: 8px;
  margin-bottom: 8px;
}
.item-row .n-input[data-v-09d35ea1] {
  flex: 1;
}

/* 响应式 */
@media (max-width: 768px) {
.page-container[data-v-09d35ea1] {
    padding: 16px;
}
}

.onboarding-page[data-v-88750a3d] {
  min-height: 100vh;
  background-color: #f3f4f6;
  display: flex;
  justify-content: center;
  align-items: center; /* 垂直居中整个容器 */
  padding: 40px 20px;
}
.onboarding-container[data-v-88750a3d] {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  /* 宽容器适配左右布局 */
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
  padding: 32px 40px;
  display: flex;
  flex-direction: column;
  transition: all 0.3s ease;
}
.top-nav[data-v-88750a3d] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}
.header[data-v-88750a3d] {
  text-align: center;
  margin-bottom: 40px;
}
.header h1[data-v-88750a3d] {
  font-size: 28px;
  color: #111827;
  letter-spacing: -0.5px;
  margin-bottom: 8px;
}
.subtitle[data-v-88750a3d] {
  color: #6b7280;
  font-size: 16px;
}
.steps-bar[data-v-88750a3d] {
  margin: 0 auto 40px;
  padding: 0 60px;
  width: 100%;
  max-width: 600px;
  display: flex;
  justify-content: center;
}
.steps-bar[data-v-88750a3d] .n-steps {
  justify-content: center;
}
.steps-bar[data-v-88750a3d] .n-step {
  flex: 0 0 auto;
  padding: 0 20px;
}
.content-area[data-v-88750a3d] {
  flex: 1;
}

/* 布局重构: 左右分栏 */
.selection-layout[data-v-88750a3d] {
  display: flex;
  gap: 32px;
  align-items: flex-start;
}
.plans-column[data-v-88750a3d] {
  flex: 1;
}
.duration-sidebar[data-v-88750a3d] {
  width: 300px; /* 固定右侧宽度 */
  flex-shrink: 0;
  position: sticky;
  top: 0;
}

/* Sidebar Styling */
.sidebar-card[data-v-88750a3d] {
  background: #fff;
  border-radius: 12px;
  padding: 24px;
  border: 1px solid #eef0f3;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
}
.sidebar-title[data-v-88750a3d] {
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 16px 0;
  color: #1f2937;
}
.duration-list[data-v-88750a3d] {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.duration-option[data-v-88750a3d] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s;
}
.duration-option[data-v-88750a3d]:hover:not(.disabled) {
  border-color: #4f468c;
  background: #fbfbfe;
}
.duration-option.selected[data-v-88750a3d] {
  border-color: #4f468c;
  background: linear-gradient(135deg, rgba(79, 70, 140, 0.05) 0%, rgba(99, 102, 241, 0.08) 100%);
}
.duration-option.disabled[data-v-88750a3d] {
  opacity: 0.5;
  cursor: not-allowed;
  background: #f9fafb;
}
.duration-info[data-v-88750a3d] {
  display: flex;
  align-items: center;
}

/* Summary Styling */
.order-summary[data-v-88750a3d] {
  margin-top: 8px;
  display: flex;
  flex-direction: column; /* 垂直排列 */
}
.summary-row[data-v-88750a3d] {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 4px;
}
.summary-row.total span[data-v-88750a3d]:first-child {
  font-size: 15px;
  color: #4b5563;
  font-weight: 500;
}
.final-price-wrapper[data-v-88750a3d] {
  color: #d03050;
  display: flex;
  align-items: baseline;
}
.price-symbol[data-v-88750a3d] {
  font-size: 16px;
  font-weight: 600;
  margin-right: 2px;
}
.final-price[data-v-88750a3d] {
  font-size: 28px;
  font-weight: 800;
  line-height: 1;
}

/* ... */
.summary-tip[data-v-88750a3d] {
  align-self: flex-end; /* Flex 右对齐 */
  text-align: right;
  font-size: 12px;
  color: #18a058;
  background: #f0fdf4;
  padding: 4px 8px;
  border-radius: 4px;
  margin-top: 4px;
}

/* New Duration Styles */
.duration-info-col[data-v-88750a3d] {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.duration-top-row[data-v-88750a3d] {
  display: flex;
  align-items: center;
}
.duration-avg-price[data-v-88750a3d] {
  font-size: 12px;
  color: #18a058; /* 绿色表示优惠 */
  margin-top: 4px;
  font-weight: 500;
}
/* ... */
.plans-grid[data-v-88750a3d] {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  /* justify-content: flex-start;  Let's flow naturally */
}
.plan-card[data-v-88750a3d] {
  border: 1px solid #eef0f3;
  border-radius: 12px;
  padding: 24px 20px;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  background: #fff;
  display: flex;
  flex-direction: column;

  /* 调整宽度以适应 Flex 布局 */
  /* 计算：(100% - gap*2) / 3 */
  width: calc((100% - 32px) / 3);
  min-width: 200px;
}
.plan-card[data-v-88750a3d]:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  border-color: transparent;
}
.plan-card.selected[data-v-88750a3d] {
  border-color: #4f468c !important;
  background: linear-gradient(
    135deg,
    rgba(79, 70, 140, 0.05) 0%,
    rgba(99, 102, 241, 0.08) 100%
  ) !important;
  box-shadow: 0 0 0 1px #4f468c !important;
}
.plan-header h3[data-v-88750a3d] {
  margin: 0 0 12px 0;
  font-size: 16px;
  color: #1f2937;
}
.price[data-v-88750a3d] {
  margin-bottom: 8px;
  color: #1f2937;
}
.price.free .amount[data-v-88750a3d] {
  font-size: 24px;
  color: #18a058;
}
.currency[data-v-88750a3d] {
  font-size: 14px;
  vertical-align: top;
  margin-right: 2px;
}
.amount[data-v-88750a3d] {
  font-size: 28px;
  font-weight: bold;
}
.period[data-v-88750a3d] {
  font-size: 12px;
  color: #9ca3af;
}
.total-price[data-v-88750a3d] {
  font-size: 13px;
  color: #6b7280;
  margin-bottom: 16px;
  display: flex;
  align-items: baseline;
  gap: 4px;
}
.total-amount-card[data-v-88750a3d] {
  color: #6b7280;
  font-weight: 600;
}
.plan-card.selected .total-amount-card[data-v-88750a3d] {
  color: #4f468c;
}
.features[data-v-88750a3d] {
  list-style: none;
  padding: 0;
  margin: 0;
  flex: 1;
}
.features li[data-v-88750a3d] {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  font-size: 13px;
  color: #4b5563;
}
.select-indicator[data-v-88750a3d] {
  position: absolute;
  top: 12px;
  right: 12px;
  color: #4f468c;
  font-size: 22px;
  opacity: 0;
  transition: opacity 0.3s;
}
.plan-card.selected .select-indicator[data-v-88750a3d] {
  opacity: 1;
}
.form-content[data-v-88750a3d] {
  max-width: 500px;
  margin: 40px auto 0;
}
.result-content[data-v-88750a3d] {
  display: flex;
  justify-content: center;
  padding-top: 60px;
}
.footer-actions[data-v-88750a3d] {
  margin-top: 40px;
  display: flex;
  justify-content: center;
  width: 100%;
  gap: 16px;
}
.long-btn[data-v-88750a3d] {
  min-width: 160px;
}

/* 响应式 */
@media (max-width: 1024px) {
.selection-layout[data-v-88750a3d] {
    flex-direction: column;
}
.duration-sidebar[data-v-88750a3d] {
    width: 100%;
    position: static;
}
.plan-card[data-v-88750a3d] {
    width: calc((100% - 16px) / 2);
}
}
@media (max-width: 600px) {
.plan-card[data-v-88750a3d] {
    width: 100%;
}
.onboarding-container[data-v-88750a3d] {
    padding: 20px;
}
}

.onboarding-page[data-v-09563e83] {
  min-height: 100vh;
  background: #f5f7fa;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20px;
}
.onboarding-container[data-v-09563e83] {
  width: 100%;
  max-width: 600px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.header[data-v-09563e83] {
  text-align: center;
}
.header h1[data-v-09563e83] {
  font-size: 28px;
  color: #333;
  margin-bottom: 8px;
}
.header p[data-v-09563e83] {
  color: #666;
}
.join-card[data-v-09563e83] {
  border-radius: 16px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
}
.form-area[data-v-09563e83] {
  padding: 40px 20px;
  text-align: center;
}
.code-input[data-v-09563e83] {
  text-align: center;
  letter-spacing: 4px;
  font-size: 18px;
  font-weight: bold;
}
.hint[data-v-09563e83] {
  margin-top: 16px;
  color: #999;
  font-size: 13px;
}
.qr-area[data-v-09563e83] {
  padding: 40px;
  display: flex;
  justify-content: center;
}
.qr-placeholder[data-v-09563e83] {
  width: 200px;
  height: 200px;
  border: 2px dashed #ccc;
  border-radius: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #999;
  cursor: pointer;
}
.qr-placeholder[data-v-09563e83]:hover {
  border-color: #18a058;
  color: #18a058;
}
.footer[data-v-09563e83] {
  text-align: center;
}

.select-tenant-page[data-v-aa24e881] {
  min-height: 100vh;
  background: linear-gradient(135deg, #e9f1f6 0%, #dce6ed 100%);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 40px 20px;
  position: relative;
  overflow: hidden;
}

/* 星光效果 */
.stars-canvas[data-v-aa24e881] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}
.select-tenant-container[data-v-aa24e881] {
  width: 100%;
  max-width: 600px;
  background: rgba(255, 255, 255, 0.55);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  box-shadow:
    0 8px 32px rgba(61, 59, 79, 0.12),
    0 2px 8px rgba(61, 59, 79, 0.06);
  padding: 48px;
  position: relative;
  z-index: 1;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}
.select-tenant-container[data-v-aa24e881]:hover {
  transform: translateY(-4px);
  box-shadow:
    0 16px 48px rgba(61, 59, 79, 0.15),
    0 4px 12px rgba(61, 59, 79, 0.08);
}
.header[data-v-aa24e881] {
  text-align: center;
  margin-bottom: 40px;
}
.empty-state[data-v-aa24e881] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 200px;
  padding: 40px 20px;
}
.logo-area[data-v-aa24e881] {
  width: 80px;
  height: 80px;
  background: linear-gradient(135deg, rgba(79, 70, 140, 0.1) 0%, rgba(118, 75, 162, 0.1) 100%);
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}
.header h1[data-v-aa24e881] {
  font-size: 28px;
  font-weight: 700;
  color: #1f2937;
  margin-bottom: 8px;
}
.header p[data-v-aa24e881] {
  color: #6b7280;
  font-size: 15px;
}
.tenants-list[data-v-aa24e881] {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 32px;
}
.tenant-card[data-v-aa24e881] {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px;
  background: rgba(255, 255, 255, 0.7);
  border: 2px solid rgba(61, 59, 79, 0.1);
  border-radius: 16px;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.tenant-card[data-v-aa24e881]:hover {
  background: rgba(255, 255, 255, 0.85);
  border-color: rgba(107, 91, 138, 0.3);
  transform: translateX(4px);
  box-shadow: 0 4px 12px rgba(61, 59, 79, 0.08);
}
.tenant-card.selected[data-v-aa24e881] {
  border-color: #4f468c;
  background: linear-gradient(135deg, rgba(79, 70, 140, 0.08) 0%, rgba(99, 102, 241, 0.12) 100%);
  box-shadow:
    0 0 0 1px #4f468c,
    0 4px 12px rgba(79, 70, 140, 0.15);
}
.tenant-logo[data-v-aa24e881] {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}
.tenant-logo img[data-v-aa24e881] {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tenant-info[data-v-aa24e881] {
  flex: 1;
  min-width: 0;
}
.tenant-info h3[data-v-aa24e881] {
  font-size: 16px;
  font-weight: 600;
  color: #1f2937;
  margin: 0 0 8px 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.tenant-meta[data-v-aa24e881] {
  display: flex;
  align-items: center;
  gap: 12px;
}
.role-name[data-v-aa24e881] {
  font-size: 13px;
  color: #6b7280;
}
.select-indicator[data-v-aa24e881] {
  color: #4f468c;
  opacity: 0;
  transition: opacity 0.3s;
}
.tenant-card.selected .select-indicator[data-v-aa24e881] {
  opacity: 1;
}
.actions[data-v-aa24e881] {
  text-align: center;
}
.actions .n-button[type='primary'][data-v-aa24e881] {
  width: 100%;
  height: 48px;
  font-size: 16px;
  font-weight: 600;
  --n-color: #5a4a7a;
  --n-color-hover: #6b5b8a;
  --n-color-pressed: #4a3d6a;
  --n-text-color: #fff;
  letter-spacing: 2px;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.actions .n-button[type='primary'][data-v-aa24e881]:hover:not(:disabled) {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(90, 74, 122, 0.35);
}
.secondary-actions[data-v-aa24e881] {
  display: flex;
  justify-content: center;
  gap: 32px;
}
.footer-info[data-v-aa24e881] {
  margin-top: 24px;
  text-align: center;
  padding-top: 24px;
  border-top: 1px solid #e5e7eb;
}
@media (max-width: 600px) {
.select-tenant-container[data-v-aa24e881] {
    padding: 32px 24px;
    border-radius: 20px;
}
.header h1[data-v-aa24e881] {
    font-size: 24px;
}
.secondary-actions[data-v-aa24e881] {
    flex-direction: column;
    gap: 12px;
}
}

.notification-list[data-v-3c3ffe23] {
  flex: 1;
  overflow-y: auto;
  padding: 0;
}
.notification-item[data-v-3c3ffe23] {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 16px 20px;
  border-bottom: 1px solid #f0f1f2;
  cursor: pointer;
  transition: all 0.2s ease;
  animation: slideUp-3c3ffe23 0.3s ease forwards;
  animation-delay: var(--delay, 0s);
  opacity: 0;
}
@keyframes slideUp-3c3ffe23 {
from {
    opacity: 0;
    transform: translateY(10px);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}
.notification-item[data-v-3c3ffe23]:hover {
  background: #f8f9fa;
}
.notification-item.unread[data-v-3c3ffe23] {
  background: rgba(51, 112, 255, 0.02);
}
.notification-item.unread[data-v-3c3ffe23]::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: #3370ff;
}
.notification-icon[data-v-3c3ffe23] {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.notification-icon.type-1[data-v-3c3ffe23] {
  background: rgba(51, 112, 255, 0.1);
  color: #3370ff;
}
.notification-icon.type-2[data-v-3c3ffe23] {
  background: rgba(90, 74, 122, 0.1);
  color: #5a4a7a;
}
.notification-icon.type-3[data-v-3c3ffe23] {
  background: rgba(250, 173, 20, 0.1);
  color: #faad14;
}
.notification-icon.type-4[data-v-3c3ffe23] {
  background: rgba(82, 196, 26, 0.1);
  color: #52c41a;
}
.notification-content[data-v-3c3ffe23] {
  flex: 1;
  min-width: 0;
}
.notification-title[data-v-3c3ffe23] {
  font-size: 14px;
  font-weight: 500;
  color: #1f2329;
  margin-bottom: 4px;
}
.notification-desc[data-v-3c3ffe23] {
  font-size: 13px;
  color: #646a73;
  margin-bottom: 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
}
.notification-meta[data-v-3c3ffe23] {
  display: flex;
  align-items: center;
  gap: 12px;
}
.notification-time[data-v-3c3ffe23] {
  font-size: 12px;
  color: #8f959e;
}
.notification-actions[data-v-3c3ffe23] {
  flex-shrink: 0;
}
.notification-count[data-v-3c3ffe23] {
  font-size: 13px;
  color: #646a73;
}
.list-footer[data-v-3c3ffe23] {
  padding: 12px 20px;
  border-top: 1px solid #f0f1f2;
  display: flex;
  justify-content: flex-end;
}
.card-header-wrapper[data-v-3c3ffe23] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.page-container[data-v-bc3228d8] {
  padding: 24px;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.task-list[data-v-bc3228d8] {
  flex: 1;
  overflow-y: auto;
  padding: 0;
}
.task-item[data-v-bc3228d8] {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 16px 20px;
  border-bottom: 1px solid #f0f1f2;
  cursor: pointer;
  transition: all 0.2s ease;
  position: relative;
}
.task-item[data-v-bc3228d8]:hover {
  background: #f8f9fa;
}
.task-item.overdue[data-v-bc3228d8] {
  background: rgba(255, 77, 79, 0.03);
}
.task-item.completed[data-v-bc3228d8] {
  opacity: 0.6;
}
.task-priority[data-v-bc3228d8] {
  width: 4px;
  height: 48px;
  border-radius: 2px;
  flex-shrink: 0;
  margin-top: 4px;
}
.task-priority.priority-1[data-v-bc3228d8] {
  background: #52c41a;
}
.task-priority.priority-2[data-v-bc3228d8] {
  background: #faad14;
}
.task-priority.priority-3[data-v-bc3228d8] {
  background: #ff4d4f;
}
.task-content[data-v-bc3228d8] {
  flex: 1;
  min-width: 0;
}
.task-header[data-v-bc3228d8] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}
.task-title[data-v-bc3228d8] {
  font-size: 14px;
  font-weight: 500;
  color: #1f2329;
}
.task-desc[data-v-bc3228d8] {
  font-size: 13px;
  color: #646a73;
  margin-bottom: 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.task-meta[data-v-bc3228d8] {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 12px;
  color: #8f959e;
}
.task-source[data-v-bc3228d8],
.task-time[data-v-bc3228d8] {
  display: flex;
  align-items: center;
  gap: 4px;
}
.task-time.warning[data-v-bc3228d8] {
  color: #faad14;
}
.task-actions[data-v-bc3228d8] {
  flex-shrink: 0;
  align-self: center;
}
.list-footer[data-v-bc3228d8] {
  padding: 12px 20px;
  border-top: 1px solid #f0f1f2;
  display: flex;
  justify-content: flex-end;
}
.card-header-wrapper[data-v-bc3228d8] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.current-task-info[data-v-bc3228d8] {
  background: #f8f9fadb;
  padding: 12px;
  border-radius: 8px;
  border: 1px solid #eef0f2;
}
.info-item[data-v-bc3228d8] {
  display: flex;
  margin-bottom: 4px;
  font-size: 13px;
}
.info-item[data-v-bc3228d8]:last-child {
  margin-bottom: 0;
}
.info-item .label[data-v-bc3228d8] {
  color: #8f959e;
  width: 70px;
}
.info-item .value[data-v-bc3228d8] {
  color: #1f2329;
  font-weight: 500;
}
.glass-list-card[data-v-bc3228d8] {
  background: rgba(255, 255, 255, 0.8) !important;
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  border-radius: 16px !important;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.workflow-config[data-v-90f671a5] {
  padding: 24px;
  height: 100%;
  overflow-y: auto;
}
.stat-card[data-v-90f671a5] {
  padding: 16px;
  height: 100%;
}
.stat-content[data-v-90f671a5] {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.stat-info[data-v-90f671a5] {
  display: flex;
  flex-direction: column;
}
.stat-label[data-v-90f671a5] {
  font-size: 13px;
  color: #8f959e;
  margin-bottom: 8px;
}
.stat-value[data-v-90f671a5] {
  font-size: 24px;
  font-weight: 700;
  color: #1f2329;
}
.stat-icon[data-v-90f671a5] {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.filter-card[data-v-90f671a5] {
  margin: 20px 0;
  padding: 12px 20px;
}
.workflow-item-card[data-v-90f671a5] {
  transition: all 0.3s ease;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.workflow-item-card[data-v-90f671a5]:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.08);
}
.card-top[data-v-90f671a5] {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 16px;
}
.workflow-name[data-v-90f671a5] {
  font-size: 16px;
  font-weight: 600;
  color: #1f2329;
  margin: 0 0 8px 0;
}
.workflow-desc[data-v-90f671a5] {
  font-size: 13px;
  color: #646a73;
  line-height: 1.5;
  margin-bottom: 16px;
  height: 40px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
}
.workflow-meta[data-v-90f671a5] {
  display: flex;
  gap: 16px;
  margin-bottom: 20px;
}
.meta-item[data-v-90f671a5] {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: #8f959e;
}
.card-footer[data-v-90f671a5] {
  margin-top: auto;
  padding-top: 16px;
  border-top: 1px solid #f0f1f2;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.status-wrapper[data-v-90f671a5] {
  display: flex;
  align-items: center;
  gap: 8px;
}
.status-text[data-v-90f671a5] {
  font-size: 12px;
  color: #646a73;
}
.node-editor-container[data-v-90f671a5] {
  padding: 20px;
  min-height: 100%;
}
.node-list-header[data-v-90f671a5] {
  margin-bottom: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.node-timeline[data-v-90f671a5] {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 40px;
}
.start-node[data-v-90f671a5],
.end-node[data-v-90f671a5] {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 0;
}
.node-icon[data-v-90f671a5] {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f0f2f5;
  color: #8f959e;
  flex-shrink: 0;
}
.node-icon.start[data-v-90f671a5] {
  background: linear-gradient(135deg, #52c41a 0%, #73d13d 100%);
  color: #fff;
  box-shadow: 0 4px 12px rgba(82, 196, 26, 0.3);
}
.node-icon.end[data-v-90f671a5] {
  background: linear-gradient(135deg, #ff4d4f 0%, #ff7875 100%);
  color: #fff;
  box-shadow: 0 4px 12px rgba(255, 77, 79, 0.3);
}
.node-name[data-v-90f671a5] {
  font-size: 14px;
  font-weight: 500;
  color: #1f2329;
}
.node-connector[data-v-90f671a5] {
  width: 2px;
  height: 24px;
  background: linear-gradient(180deg, #d9d9d9 0%, #bfbfbf 100%);
  margin: 4px 0;
}
.workflow-node-item[data-v-90f671a5] {
  width: 100%;
  max-width: 520px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.node-card[data-v-90f671a5] {
  width: 100%;
  border-radius: 12px !important;
  border: 1px solid #e8e8e8 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  transition: all 0.2s ease;
  background: #fff !important;
}
.node-card[data-v-90f671a5]:hover {
  border-color: #d9d9d9 !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}
.node-card[data-v-90f671a5] .n-card-header {
  padding: 12px 16px !important;
  border-bottom: 1px solid #f0f0f0;
}
.node-card[data-v-90f671a5] .n-card__content {
  padding: 16px !important;
}
.node-card[data-v-90f671a5] .n-form-item {
  margin-bottom: 12px;
}
.node-card[data-v-90f671a5] .n-form-item:last-child {
  margin-bottom: 0;
}
.glass-card[data-v-90f671a5] {
  background: rgba(255, 255, 255, 0.85) !important;
  backdrop-filter: blur(8px);
  border: 1px solid rgba(222, 224, 227, 0.6) !important;
  border-radius: 12px !important;
}
.glass-drawer[data-v-90f671a5] .n-drawer-content {
  background: #f5f7fa;
}
.glass-drawer[data-v-90f671a5] .n-drawer-header {
  background: #fff;
  border-bottom: 1px solid #f0f0f0;
}
.glass-drawer[data-v-90f671a5] .n-drawer-footer {
  background: #fff;
  border-top: 1px solid #f0f0f0;
}
.workflow-grid[data-v-90f671a5] {
  margin-top: 20px;
}
@media (max-width: 1200px) {
.workflow-grid[data-v-90f671a5] .n-grid {
    --n-cols: 2 !important;
}
}
@media (max-width: 768px) {
.workflow-config[data-v-90f671a5] {
    padding: 16px;
}
.workflow-grid[data-v-90f671a5] .n-grid {
    --n-cols: 1 !important;
}
.stats-overview[data-v-90f671a5] .n-grid {
    --n-cols: 2 !important;
}
}