/* 基础样式 */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    line-height: 1.4;
    color: #333;
    background-color: #efe8e6;
    padding: 6px;
}

/* 主界面与登录页同一套天空底（卡片/顶栏仍用不透明底，保证数字可读） */
.page-boot-bg {
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

.main-content {
    position: relative;
    z-index: 1;
}

/* 总体概况区域样式 */
.overview-section {
    background: white;
    border-radius: 4px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
    padding: 6px 12px;
    margin-bottom: 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 32px;
}

.overview-item {
    display: flex;
    align-items: center;
    gap: 4px;
}

.overview-label {
    color: #666;
    font-size: 12px;
}

.overview-value {
    font-size: 13px;
    font-weight: 500;
}

/* 表格容器 */
.table-container {
    background: white;
    border-radius: 4px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    margin: 4px auto;
    max-width: 1800px;
    -webkit-overflow-scrolling: touch; /* 在iOS上提供惯性滚�?*/
    scroll-behavior: smooth; /* 平滑滚动 */
}

/* 表格样式 */
table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: white;
    font-size: 13px;
}

/* 表头样式 */
thead {
    background: #fafafa;
    position: sticky;
    top: 0;
    z-index: 1;
}

th {
    padding: 12px;
    font-weight: 600;
    font-size: 13px;
    color: #1f1f1f;
    text-align: left;
    border-bottom: 2px solid #f0f0f0;
    transition: background-color 0.2s;
    white-space: nowrap;
}

th:hover {
    background-color: #eef2f7;
}

/* 表格内容 */
td {
    padding: 10px 12px;
    border-bottom: 1px solid #f0f0f0;
    transition: all 0.2s;
    line-height: 1.4;
}

/* 行样�?*/
tr {
    transition: all 0.3s ease;
}

tr:hover {
    background-color: #fafafa;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

/* 已售完行样式 */
.completed-row {
    position: relative;
    opacity: 0.8;
}

.completed-row td {
    position: relative;
    color: #999;
    text-decoration: line-through;
    background-color: #f8f8f8;
}

/* 价格上涨和下跌样�?*/
.price-up {
    color: #f56c6c; /* 红色 - 表示盈利 */
}

.price-down {
    color: #67c23a; /* 绿色 - 表示亏损 */
}

/* 轻微亏损样式 */
.price-slight-loss {
    color: #fa8c16;
}

/* 断层标记样式 */
.price-fault {
    color: #ff4d4f !important; /* 深红色 - 表示断层 */
    font-weight: bold;
    background-color: rgba(255, 77, 79, 0.1); /* 浅红色背景 */
    border: 1px solid #ff4d4f;
    border-radius: 3px;
}

/* 可购买价格标记样式 */
.price-buyable {
    color: #52c41a !important; /* 绿色 - 表示可购买 */
    font-weight: bold;
    background-color: rgba(82, 196, 26, 0.1); /* 浅绿色背景 */
    border: 1px solid #52c41a;
}

/* 可卖出价格标记样式 */
.price-sellable {
    color: #722ed1 !important; /* 紫色 - 表示可卖出盈利 */
    font-weight: bold;
    border-radius: 3px;
}

/* 分类标题�?*/
.category-title {
    background: #f7f7f7;
    color: #1f1f1f;
    font-weight: 600;
    padding: 12px 16px;
    text-align: left;
    font-size: 14px;
    letter-spacing: 0.5px;
}

/* 物品列样�?*/
td:nth-child(5) {
    max-width: 400px;
    white-space: normal;
    line-height: 1.5;
}

/* 状态标�?*/
.status-tag {
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
}

/* 动画效果 */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.fade-in {
    animation: fadeIn 0.3s ease-out forwards;
}

/* 条样�?*/
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #999;
}

/* 响应式布局 */
@media (max-width: 1200px) {
    td:nth-child(5) {
        max-width: 300px;
    }
}

/* 工具提示样式 */
.detail-tip {
    position: absolute;
    background: white;
    border-radius: 8px;
    padding: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    z-index: 1000;
    max-width: 300px;
    animation: fadeIn 0.2s ease-out;
}

.detail-tip div {
    margin: 6px 0;
    color: #666;
}

/* 斑马�?*/
tbody tr:nth-child(even) {
    background-color: #fafbfc;
}

/* 加载进度条容�?*/
.loading-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.95);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.loading-content {
    text-align: center;
    padding: 20px;
    border-radius: 8px;
    background: white;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    width: 300px;
}

.progress-bar {
    width: 100%;
    height: 6px;
    background: #f0f0f0;
    border-radius: 3px;
    overflow: hidden;
    margin: 10px 0;
}

.progress {
    width: 0%;
    height: 100%;
    background: #1890ff;
    transition: width 0.3s ease;
}

.loading-text {
    color: #333;
    margin: 10px 0;
    font-size: 14px;
}

.loading-count {
    color: #666;
    font-size: 12px;
}

/* 主内容区�?*/
.main-content {
    opacity: 0;
    transition: opacity 0.3s ease;
    max-width: 100%;
    overflow-x: hidden;
    box-sizing: border-box;
}

.main-content.visible {
    opacity: 1;
}

/* 添加加载动画样式 */
.loading-spinner {
    width: 48px;
    height: 48px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #1890ff;
    border-radius: 50%;
    margin: 0 auto 12px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* 调整加载界面布局 */
.loading-header {
    text-align: center;
    margin-bottom: 24px;
}

.loading-header h2 {
    margin: 12px 0;
    color: #1f1f1f;
    font-size: 20px;
}

.tip-item {
    display: flex;
    align-items: center;
    padding: 8px 0;
    opacity: 0;
    animation: fadeInUp 0.5s forwards;
}

.tip-item:nth-child(1) { animation-delay: 0.2s; }
.tip-item:nth-child(2) { animation-delay: 0.4s; }
.tip-item:nth-child(3) { animation-delay: 0.6s; }

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.tip-icon {
    margin-right: 12px;
    font-size: 18px;
}

/* 状态列样式 */
.status-cell {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 12px;
    margin: 0 2px;
    white-space: nowrap;
}

/* 调整胶囊样式颜色为更浅的版本 - 进一步降低饱和度 */
.status-50 {
    background-color: rgba(144, 238, 144, 0.4);
    border: 1px solid rgba(0, 128, 0, 0.3);
    color: #006400;
}

.status-40 {
    background-color: rgba(173, 216, 230, 0.4);
    border: 1px solid rgba(0, 0, 139, 0.3);
    color: #00008B;
}

.status-30 {
    background-color: rgba(255, 228, 181, 0.4);
    border: 1px solid rgba(184, 134, 11, 0.3);
    color: #8B4513;
}

.status-20 {
    background-color: rgba(255, 182, 193, 0.4);
    border: 1px solid rgba(178, 34, 34, 0.3);
    color: #8B0000;
}

.status-10 {
    background-color: rgba(255, 160, 122, 0.4);
    border: 1px solid rgba(139, 0, 0, 0.3);
    color: #8B0000;
}

.status-sell {
    background-color: rgba(216, 191, 216, 0.4);
    border: 1px solid rgba(128, 0, 128, 0.3);
    color: #4B0082;
}

.status-normal {
    background-color: rgba(211, 211, 211, 0.4);
    border: 1px solid rgba(105, 105, 105, 0.3);
    color: #333;
}

/* 危险状态（红色警告�?*/
.status-danger {
    background-color: #fff1f0;
    color: #f5222d;
    border: 1px solid #ffa39e;
}

/* 安全状态（绿色提示�?*/
.status-safe {
    background-color: #f6ffed;
    color: #52c41a;
    border: 1px solid #b7eb8f;
}

/* 警告状态（CD过处理） */
.status-warning {
    background-color: #fff7e6;
    color: #fa8c16;
    border: 1px solid #ffd591;
}

/* 普通状�?*/
.status-normal {
    background-color: #f5f5f5;
    color: #8c8c8c;
    border: 1px solid #d9d9d9;
}

/* 服务器样�?*/
.server-pingzhuan {
    background-color: #f5f5f5 !important;  /* 平转�?- 灰色 */
    color: #666 !important;
    border: 1px solid #d9d9d9 !important;
}

.server-kaiqu {
    background-color: #f6ffed !important;  /* 开区服 - 绿色 */
    color: #52c41a !important;
    border: 1px solid #b7eb8f !important;
}

.server-xiaoyanhua {
    background-color: #fff0f6 !important;  /* 小烟�?- 粉色 */
    color: #eb2f96 !important;
    border: 1px solid #ffadd2 !important;
}

.server-dayanhua {
    background-color: #fff1f0 !important;  /* 大烟花 - 红色 */
    color: #f5222d !important;
    border: 1px solid #ffa39e !important;
}

.server-normal {
    background-color: #f5f5f5 !important;  /* 默认 - 灰色 */
    color: #8c8c8c !important;
    border: 1px solid #d9d9d9 !important;
}

.server-niannei {
    background-color: #e6f7ff !important;  /* 年内 - 蓝色 */
    color: #1890ff !important;
    border: 1px solid #91d5ff !important;
}

.server-3niannei {
    background-color: #f9f0ff !important;  /* 3年内 - 紫色 */
    color: #722ed1 !important;
    border: 1px solid #d3adf7 !important;
}

/* 提示框样?*/
.tooltip {
    position: absolute;
    z-index: 1000;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
    padding: 16px;
    min-width: 700px;
    max-width: 900px;
    pointer-events: auto;
    animation: fadeIn 0.2s ease-out;
}

/* 添加状态胶囊容器样�?*/
.status-pill-container {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}

/* 添加标签式切换样�?*/
.tooltip-tabs {
    display: flex;
    gap: 2px;
    margin-bottom: 15px;
    overflow-x: auto;
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 8px;
}

.tooltip-tab {
    padding: 6px 12px;
    background: #f5f5f5;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
    font-size: 13px;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.2s ease;
}

.tooltip-tab .item-icon {
    width: 14px;
    height: 14px;
    object-fit: contain;
    vertical-align: -2px;
    margin-right: 4px;
}

.tooltip-tab:hover {
    background: #e9e9e9;
}

.tooltip-tab.active {
    background: #1890ff;
    color: white;
    border-color: #1890ff;
}

.tooltip-items-container {
    position: relative;
}

.tooltip-item-content {
    animation: fadeIn 0.2s ease-out;
}

.price-chart-container {
    margin-top: 12px;
    height: 280px;     /* 增加图表高度 */
    width: 100%;
}

.no-chart-data {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 200px;
    color: #999;
    font-size: 14px;
    background: #f9f9f9;
    border-radius: 4px;
}

.server-name {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin-left: 8px;
}

.tooltip-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #f0f0f0;
}

.tooltip-header h3 {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: #333;
    display: flex;
    align-items: center;
    gap: 6px;
}

/* tooltip 标题中月销量徽章 */
.tooltip-sales-badge {
    display: inline-flex;
    align-items: center;
    font-size: 11px;
    font-weight: 600;
    padding: 1px 6px;
    border-radius: 10px;
    margin-left: 6px;
    vertical-align: middle;
    white-space: nowrap;
    line-height: 1.6;
}
.tooltip-sales-super  { background-color: #f5222d; color: #fff; }
.tooltip-sales-high   { background-color: #fa8c16; color: #fff; }
.tooltip-sales-medium { background-color: #52c41a; color: #fff; }
.tooltip-sales-low    { background-color: #909399; color: #fff; }
.tooltip-maxmin-badge {
    display: inline-flex;
    align-items: center;
    font-size: 11px;
    font-weight: 600;
    padding: 1px 6px;
    border-radius: 10px;
    margin-left: 4px;
    vertical-align: middle;
    white-space: nowrap;
    line-height: 1.6;
}
.tooltip-max-badge {
    background-color: rgba(245, 34, 45, 0.12);
    color: #cf1322;
    border: 1px solid rgba(245, 34, 45, 0.25);
}
.tooltip-min-badge {
    background-color: rgba(82, 196, 26, 0.12);
    color: #389e0d;
    border: 1px solid rgba(82, 196, 26, 0.25);
}

/* 道具 tip 标题：卖调比 = 卖出件数÷调价次数×100%（越高表示调价越少、卖出越多） */
.tooltip-sell-adjust-badge {
    display: inline-flex;
    align-items: center;
    font-size: 11px;
    font-weight: 600;
    padding: 1px 6px;
    border-radius: 10px;
    margin-left: 4px;
    vertical-align: middle;
    white-space: nowrap;
    line-height: 1.6;
    border: 1px solid transparent;
}
.tooltip-sell-adjust-none {
    background-color: #f4f4f5;
    color: #8c8c8c;
    border-color: #e8e8e8;
}
.tooltip-sell-adjust-perfect {
    background-color: rgba(82, 196, 26, 0.18);
    color: #237804;
    border-color: rgba(82, 196, 26, 0.35);
}
.tooltip-sell-adjust-excellent {
    background-color: rgba(82, 196, 26, 0.22);
    color: #135200;
    border-color: rgba(82, 196, 26, 0.4);
}
.tooltip-sell-adjust-good {
    background-color: rgba(24, 144, 255, 0.12);
    color: #096dd9;
    border-color: rgba(24, 144, 255, 0.28);
}
.tooltip-sell-adjust-mid {
    background-color: rgba(250, 173, 20, 0.18);
    color: #ad6800;
    border-color: rgba(250, 173, 20, 0.35);
}
.tooltip-sell-adjust-low {
    background-color: rgba(250, 140, 22, 0.15);
    color: #d46b08;
    border-color: rgba(250, 140, 22, 0.32);
}
.tooltip-sell-adjust-bad {
    background-color: rgba(245, 34, 45, 0.12);
    color: #cf1322;
    border-color: rgba(245, 34, 45, 0.28);
}

.tooltip-close-btn {
    background: none;
    border: none;
    font-size: 18px;
    cursor: pointer;
    color: #999;
    padding: 2px 6px;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.tooltip-close-btn:hover {
    background-color: #f5f5f5;
    color: #333;
}

.tooltip-title {
    font-size: 16px;
    font-weight: 600;
    color: #1f1f1f;
}

.tooltip-content {
    font-size: 14px;
}

.tooltip-row {
    display: flex;
    justify-content: space-between;
    margin: 4px 0;
}

.tooltip-label {
    color: #666;
    margin-right: 12px;
}

.tooltip-value {
    color: #1f1f1f;
    font-weight: 500;
}

.tooltip-divider {
    margin: 8px 0;
    border-top: 1px solid #f0f0f0;
}

.tooltip-items {
    margin-top: 8px;
}

.tooltip-item {
    border-bottom: 1px solid #f0f0f0;
    padding: 12px 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.tooltip-item-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #f0f0f0;
}
/* 物品名称前置小图标（用于弹窗与悬浮窗） */
.tooltip-item-header .item-name,
.market-detail-tooltip h3 .item-name,
.dialog-header h2 .item-name {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.tooltip-item-header .item-name .item-icon,
.market-detail-tooltip h3 .item-name .item-icon,
.dialog-header h2 .item-name .item-icon {
    width: 16px;
    height: 16px;
    object-fit: contain;
    flex-shrink: 0;
}

.tooltip-data-container {
    display: flex;
    gap: 20px;
    margin-bottom: 12px;
}

.tooltip-column {
    flex: 1;
    min-width: 200px;
}

.tooltip-basic-info {
    background: #f9f9f9;
    padding: 12px;
    border-radius: 4px;
}

.tooltip-item-details {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.item-detail {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.market-section {
    background: #f9f9f9;
    padding: 5px; /* 减小内边�?*/
    border-radius: 4px;
    min-width: 100px; /* 减小最小宽�?*/
}

.price-list {
    display: flex;
    flex-direction: column;
    gap: 1px;
    font-family: monospace;
    font-size: 11px;
}

.price-item {
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

/* 统计信息面板样式 */
.stats-panel {
    background: white;
    padding: 16px;
    margin-bottom: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.stats-item {
    /* padding: 0 20px; */
    border-right: 1px solid #f0f0f0;
}

.stats-item:last-child {
    border-right: none;
}

.stats-label {
    color: #666;
    font-size: 14px;
    margin-right: 8px;
}

.stats-value {
    font-size: 16px;
    font-weight: 600;
    color: #1f1f1f;
}

.stats-change {
    margin-left: 8px;
    font-size: 14px;
}

.stats-change.positive {
    color: #f5222d;
}

.stats-change.negative {
    color: #52c41a;
}

/* 状态列容器 */
.status-container {
    display: flex;
    gap: 4px;
    align-items: center;
    white-space: nowrap;
    min-width: 180px;
}

/* 在售数量胶囊样式 */
.status-count {
    background-color: #e6f7ff;
    color: #1890ff;
    border: 1px solid #91d5ff;
}

/* 已售数量�?时的样式 */
.status-count-zero {
    background-color: #fff1f0;
    color: #f5222d;
    border: 1px solid #ffa39e;
}

/* 满标记胶囊样�?*/
.status-max {
    background-color: #fff1f0;
    color: #f5222d;
    border: 1px solid #ffa39e;
}

/* 服务器列样式 */
td:nth-child(3) .status-cell,
td:nth-child(4) .status-cell {
    width: 100%;  /* 让胶囊填满单元格 */
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;  /* 文字超出时显示省略号 */
}

.stats-container {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 4px 6px;
    background-color: transparent;
    border-radius: 4px;
    margin-bottom: 8px;
    width: 100%;
    max-width: 100%;
    overflow: visible;
    box-sizing: border-box;
}

/* 主界面顶栏：指标/刷新一行，操作按钮可换行占满下一行 */
#mainContent .stats-toolbar.log-buttons-container,
#mainContent .stats-container > .log-buttons-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    flex: 1;
    gap: 6px 8px;
    width: 100%;
    min-width: 0;
    margin: 0;
    overflow: visible;
}

#mainContent .stats-toolbar.log-buttons-container > .site-brand {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    margin-right: 6px;
    padding-right: 10px;
    border-right: 1px solid rgba(26, 43, 52, 0.12);
    white-space: nowrap;
}

#mainContent .stats-toolbar.log-buttons-container .site-brand-logo {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
    box-shadow: 0 1px 4px rgba(26, 43, 52, 0.18);
}

#mainContent .stats-toolbar.log-buttons-container .site-brand-name {
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: #1a2b34;
    line-height: 1;
}

#mainContent .stats-toolbar.log-buttons-container > .stats-item {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    flex-shrink: 0;
    overflow: visible;
    text-overflow: clip;
    white-space: nowrap;
}

#mainContent .stats-toolbar.log-buttons-container > .refresh-data-wrap {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center;
    flex-shrink: 0;
    gap: 6px;
    margin: 0 4px;
    padding: 0 8px;
    border-left: 1px solid rgba(26, 43, 52, 0.12);
    border-right: 1px solid rgba(26, 43, 52, 0.12);
}

/* 第一行右侧：用户管理 / 会员 / 退出 */
#mainContent .stats-toolbar.log-buttons-container > .main-session-controls {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    margin-left: auto;
    min-width: 0;
}

/* 第二行操作按钮：与 Tab 同行，统一浅蓝描边 */
#mainContent .main-data-tabs-row > .main-actions-wrap {
    display: inline-flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    padding: 8px 4px 0 0;
    background: none;
    border: none;
    overflow: visible;
}

#mainContent .soft-action-btn,
#mainContent .main-actions-wrap > .compare-btn,
#mainContent .main-actions-wrap > .profit-analysis-btn,
#mainContent .main-actions-wrap > .sales-analysis-btn,
#mainContent .main-actions-wrap > .log-btn,
#mainContent .main-actions-wrap > .profitable-list-btn {
    appearance: none;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: auto !important;
    min-width: 0 !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 6px 12px !important;
    min-height: 28px;
    box-sizing: border-box;
    border: 1px solid rgba(42, 111, 151, 0.35) !important;
    border-radius: 999px !important;
    background: #f0f7fb !important;
    color: #1f5575 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.2;
    white-space: nowrap !important;
    box-shadow: none !important;
    cursor: pointer;
    transform: none !important;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

#mainContent .soft-action-btn:hover,
#mainContent .main-actions-wrap > .compare-btn:hover,
#mainContent .main-actions-wrap > .profit-analysis-btn:hover,
#mainContent .main-actions-wrap > .sales-analysis-btn:hover,
#mainContent .main-actions-wrap > .log-btn:hover,
#mainContent .main-actions-wrap > .profitable-list-btn:hover {
    background: #e4f0f8 !important;
    border-color: rgba(42, 111, 151, 0.55) !important;
    color: #1a2b34 !important;
    transform: none !important;
    box-shadow: none !important;
}

#mainContent .soft-action-btn:active,
#mainContent .main-actions-wrap > .compare-btn:active,
#mainContent .main-actions-wrap > .profit-analysis-btn:active,
#mainContent .main-actions-wrap > .sales-analysis-btn:active,
#mainContent .main-actions-wrap > .log-btn:active,
#mainContent .main-actions-wrap > .profitable-list-btn:active {
    background: #d7eaf5 !important;
    border-color: rgba(42, 111, 151, 0.7) !important;
    color: #1f5575 !important;
    box-shadow: none !important;
    transform: none !important;
}

/* 日志按钮有未读：用暖色底替换旧红点（按登录账号记录查看时间） */
#mainContent .log-btn.has-log-new,
#mainContent .main-actions-wrap > .log-btn.has-log-new {
    background: #fff1f0 !important;
    border-color: rgba(198, 40, 40, 0.55) !important;
    color: #a01818 !important;
}
#mainContent .log-btn.has-log-new:hover,
#mainContent .main-actions-wrap > .log-btn.has-log-new:hover {
    background: #ffe4e1 !important;
    border-color: rgba(198, 40, 40, 0.7) !important;
    color: #8e1a1a !important;
}

/* 记录中心：五个日志/卖出入口合并为一个切卡弹窗 */
.records-hub-dialog {
    width: 94%;
    max-width: 1400px;
    height: 90vh;
    max-height: 90vh;
}
.records-hub-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 10px 16px;
    border-bottom: 1px solid rgba(26, 43, 52, 0.12);
    background: rgba(255, 255, 255, 0.4);
    flex: 0 0 auto;
}
.records-hub-tab {
    appearance: none;
    border: 1px solid rgba(42, 111, 151, 0.35);
    background: #f0f7fb;
    color: #1f5575;
    border-radius: 999px;
    padding: 6px 14px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    line-height: 1.2;
}
.records-hub-tab:hover {
    background: #e4f0f8;
    border-color: rgba(42, 111, 151, 0.55);
    color: #1a2b34;
}
.records-hub-tab.is-active {
    background: linear-gradient(135deg, #2a6f97 0%, #1f5575 100%);
    color: #fff;
    border-color: transparent;
}
.records-hub-tab.has-log-new:not(.is-active) {
    background: #fff1f0;
    border-color: rgba(198, 40, 40, 0.55);
    color: #a01818;
}
.records-hub-panes {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.records-hub-pane {
    flex: 1;
    min-height: 0;
    overflow: hidden;
    display: none;
    flex-direction: column;
}
.records-hub-pane.is-active {
    display: flex;
}
.records-hub-pane .log-dialog-content {
    flex: 1;
    min-height: 0;
    overflow: hidden;
}
.records-hub-pane .log-content-wrapper {
    flex: 1;
    min-height: 0;
    overflow: auto;
}
.records-hub-pane .sales-modal {
    width: 100%;
    max-width: none;
    max-height: none;
    height: 100%;
    flex: 1;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}
.records-hub-pane .sales-modal .modal-header {
    display: none;
}
.records-hub-pane .sales-modal .monthly-stats-container {
    flex: 0 0 auto !important;
}
.records-hub-pane .sales-modal .modal-body {
    flex: 1;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    padding: 12px 16px;
}
.records-hub-pane .sales-modal .chart-container {
    flex-grow: 0;
    height: 360px;
    min-height: 320px;
    margin-bottom: 12px;
}

#mainContent .session-user-label {
    font-size: 12px;
    font-weight: 500;
    color: #1a2b34;
    white-space: nowrap;
    max-width: min(280px, 36vw);
    overflow: hidden;
    text-overflow: ellipsis;
}

#mainContent .logout-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 6px 12px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    min-height: 28px;
    border: 1px solid #c45c4a;
    background: #fff7f5;
    color: #a33b2b;
    border-radius: 999px;
    cursor: pointer;
    white-space: nowrap;
}

#mainContent .logout-btn:hover {
    background: #fde8e4;
}

.stats-item {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    margin-right: 0px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.stats-label {
    font-weight: 500;
    color: #666;
    margin-right: 0px;
    font-size: 10px;
}

.stats-value {
    font-weight: 600;
    color: #333;
    font-size: 13px;
}

/* 利润率颜色样�?*/
.stats-value.price-up {
    color: #f5222d;  /* 上涨红色 */
    font-weight: bold;
}

.stats-value.price-down {
    color: #52c41a;  /* 下跌绿色 */
    font-weight: bold;
}

/* 冻结资金 / 可流转资金（原流动资金区域） */
.fund-split-container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}

.fund-split-container .fund-pct {
    font-size: 9px;
    color: #666;
    font-weight: 500;
}

/* 冻结/流转：单行紧凑，颜色由占比继承（主样式见下方统一排版） */
#mainContent .stats-toolbar.log-buttons-container #frozenFunds .fund-split-container .value-amount,
#mainContent .stats-toolbar.log-buttons-container #transferableFunds .fund-split-container .value-amount {
    display: inline;
}

/* 响应式优化 - 小屏幕 */
@media (max-width: 1200px) {
    .stats-container {
        padding: 3px 1px;
    }
    
    .stats-item {
        margin-right: 1px;
    }
    
    .stats-label {
        font-size: 10px;
        margin-right: 1px;
    }
    
    .stats-value {
        font-size: 10px;
    }
    
    .fund-split-container .value-amount {
        font-size: 12px;
    }
    
    .fund-split-container .fund-pct {
        font-size: 8px;
    }
    
    #compareBtn,
    .profit-analysis-btn,
    .sales-analysis-btn {
        padding: 4px 8px;
        font-size: 11px;
    }
    
    .log-btn {
        padding: 3px 5px;
        font-size: 10px;
    }
    
    .log-buttons-container {
        gap: 1px;
        margin-right: 1px;
    }
    
    /* 小屏幕下进一步缩小每日卖出和日志按钮间距 */
    #dailySalesBtn {
        margin-right: 0px !important;
    }
    
    .log-buttons-container {
        margin-left: 0px !important;
    }

    #mainContent .stats-toolbar.log-buttons-container .stats-label {
        font-size: 12px !important;
    }

    #mainContent .stats-toolbar.log-buttons-container .site-brand-name {
        display: none;
    }

    #mainContent .stats-toolbar.log-buttons-container .stats-value,
    #mainContent .stats-toolbar.log-buttons-container #totalValue .value-amount,
    #mainContent .stats-toolbar.log-buttons-container #frozenFunds .fund-split-container .value-amount,
    #mainContent .stats-toolbar.log-buttons-container #transferableFunds .fund-split-container .value-amount,
    #mainContent .stats-toolbar.log-buttons-container #currentDate.stats-value,
    #mainContent .stats-toolbar.log-buttons-container #totalCost.stats-value {
        font-size: 13px !important;
    }

    #mainContent .stats-toolbar.log-buttons-container #totalValue .value-changes,
    #mainContent .stats-toolbar.log-buttons-container .fund-split-container .fund-pct {
        font-size: 11px !important;
    }
}

/* 响应式优化 - 超小屏幕 */
@media (max-width: 1000px) {
    .stats-container {
        padding: 2px 0px;
        flex-wrap: nowrap;
        justify-content: flex-start;
    }
    
    .stats-item {
        margin-right: 0px;
        margin-bottom: 1px;
    }
    
    .stats-label {
        font-size: 9px;
        margin-right: 0px;
    }
    
    .stats-value {
        font-size: 9px;
    }
    
    .fund-split-container .value-amount {
        font-size: 11px;
    }
    
    .fund-split-container .fund-pct {
        font-size: 7px;
    }
    
    #compareBtn,
    .profit-analysis-btn,
    .sales-analysis-btn {
        padding: 3px 6px;
        font-size: 10px;
    }
    
    .log-btn {
        padding: 2px 4px;
        font-size: 9px;
    }
    
    .log-buttons-container {
        gap: 1px;
        margin-right: 0px;
    }
    
    /* 超小屏幕下进一步缩小每日卖出和日志按钮间距 */
    #dailySalesBtn {
        margin-right: 0px !important;
    }
    
    .log-buttons-container {
        margin-left: 0px !important;
    }

    #mainContent .stats-toolbar.log-buttons-container .stats-label {
        font-size: 11px !important;
    }

    #mainContent .stats-toolbar.log-buttons-container .stats-value,
    #mainContent .stats-toolbar.log-buttons-container #totalValue .value-amount,
    #mainContent .stats-toolbar.log-buttons-container #frozenFunds .fund-split-container .value-amount,
    #mainContent .stats-toolbar.log-buttons-container #transferableFunds .fund-split-container .value-amount,
    #mainContent .stats-toolbar.log-buttons-container #currentDate.stats-value,
    #mainContent .stats-toolbar.log-buttons-container #totalCost.stats-value {
        font-size: 12px !important;
    }

    #mainContent .stats-toolbar.log-buttons-container #totalValue .total-value-container {
        padding: 0;
    }

    #mainContent .stats-toolbar.log-buttons-container #totalValue .value-changes,
    #mainContent .stats-toolbar.log-buttons-container .fund-split-container .fund-pct {
        font-size: 11px !important;
    }
}

.fund-split-container .value-amount {
    font-size: 14px;
    font-weight: bold;
}

.stats-value.error {
    color: #faad14;
    font-style: italic;
}

/* 对比按钮样式优化 */
.compare-btn-container {
    margin: 0 1px 0 0 !important;
}

/* 每日卖出按钮和日志按钮之间的间距优化 */
#dailySalesBtn {
    margin-right: 0px !important;
}

.log-buttons-container {
    margin-left: 0px !important;
}

/* 统计栏排版：标签用标题色，主数字统一，辅文略小 */
#mainContent .stats-toolbar.log-buttons-container > .stats-item {
    gap: 4px;
}

#mainContent .stats-toolbar.log-buttons-container > .stats-item.stats-item-total-value {
    align-items: center;
    align-self: center;
    white-space: nowrap;
    flex-shrink: 0;
}

#mainContent .stats-toolbar.log-buttons-container .stats-label {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #5a6b75 !important;
    margin-right: 0;
    letter-spacing: 0.02em;
    line-height: 1.2;
}

#mainContent .stats-toolbar.log-buttons-container .stats-value {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #1a2b34;
    font-variant-numeric: tabular-nums;
    -webkit-font-smoothing: antialiased;
    letter-spacing: 0;
    line-height: 1.2;
}

#mainContent .stats-toolbar.log-buttons-container .stats-value.price-up {
    color: #f5222d !important;
}

#mainContent .stats-toolbar.log-buttons-container .stats-value.price-down {
    color: #52c41a !important;
}

#mainContent .stats-toolbar.log-buttons-container #totalValue.stats-value {
    white-space: nowrap;
    max-width: none;
    min-width: 0;
    color: #1a2b34 !important;
}

#mainContent .stats-toolbar.log-buttons-container #totalValue .total-value-container {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: baseline;
    gap: 6px;
    line-height: 1.2;
    padding: 0;
    background: transparent;
    box-shadow: none;
    border: none;
}

#mainContent .stats-toolbar.log-buttons-container #totalValue .value-amount,
#mainContent .stats-toolbar.log-buttons-container #currentDate.stats-value,
#mainContent .stats-toolbar.log-buttons-container #totalCost.stats-value,
#mainContent .stats-toolbar.log-buttons-container > .stats-item-total-value > #totalValue.stats-value:not(:has(.total-value-container)) {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: #1a2b34 !important;
    -webkit-text-fill-color: #1a2b34 !important;
    letter-spacing: 0;
    font-variant-numeric: tabular-nums;
    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
    background-image: none !important;
    filter: none !important;
}

#mainContent .stats-toolbar.log-buttons-container #profitRate.stats-value {
    font-size: 14px !important;
    font-weight: 700 !important;
}

#mainContent .stats-toolbar.log-buttons-container .fund-split-container {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: baseline;
    gap: 4px;
}

#mainContent .stats-toolbar.log-buttons-container .fund-split-container .value-amount {
    font-size: 14px !important;
    font-weight: 700 !important;
    color: inherit;
    -webkit-text-fill-color: currentColor;
    letter-spacing: 0;
    font-variant-numeric: tabular-nums;
}

#mainContent .stats-toolbar.log-buttons-container #totalValue .value-changes {
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 4px;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-shadow: none;
}

#mainContent .stats-toolbar.log-buttons-container .fund-split-container .fund-pct {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: inherit;
}

#mainContent .stats-toolbar.log-buttons-container #frozenFunds.stats-value.fund-pct-eq50 .fund-split-container .value-amount,
#mainContent .stats-toolbar.log-buttons-container #transferableFunds.stats-value.fund-pct-eq50 .fund-split-container .value-amount {
    color: #1a2b34 !important;
    -webkit-text-fill-color: #1a2b34 !important;
}

#mainContent .stats-toolbar.log-buttons-container #frozenFunds.stats-value.fund-pct-eq50 .fund-split-container .fund-pct,
#mainContent .stats-toolbar.log-buttons-container #transferableFunds.stats-value.fund-pct-eq50 .fund-split-container .fund-pct {
    color: #5a6b75 !important;
}

#mainContent .stats-toolbar.log-buttons-container .account-json-meta-time {
    font-size: 12px;
    font-weight: 500;
    color: #8c8c8c;
}

#mainContent .stats-toolbar.log-buttons-container .account-json-meta-status {
    font-size: 11px;
    font-weight: 600;
}

/* 顶栏操作按钮样式见上方 .soft-action-btn */

.sales-analysis-btn {
    margin-right: 0px !important;
}

#changePriceLogBtn {
    margin-left: 0px !important;
}

#compareBtn .icon {
    font-size: 14px;
}

/* 图例样式优化 */
.chart-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 4px;
    font-size: 12px;
}

.legend-item {
    display: flex;
    align-items: center;
    gap: 4px;
}

.legend-color {
    width: 12px;
    height: 12px;
    border-radius: 2px;
}

.market-data {
    display: flex;
    gap: 20px;
    margin: 12px 0;
    padding: 12px;
    background: #f9f9f9;
    border-radius: 4px;
}

.market-section {
    flex: 1;
}

.section-title {
    font-weight: 600;
    color: #333;
    margin-bottom: 5px; /* 减小底部边距 */
    font-size: 12px;
    padding-bottom: 4px;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.section-title-text {
    display: flex;
    align-items: center;
    gap: 4px;
}

.price-list {
    display: flex;
    flex-direction: column;
    gap: 1px;
    font-family: monospace;
    font-size: 11px;
}

.price-item {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 1px 0;
}

.price-index {
    color: #666;
    min-width: 20px;
    text-align: right;
}

.gold-price {
    color: #666;
    margin-left: 8px;
}

.trade-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 12px;
}

.trade-item {
    display: flex;
    justify-content: space-between;
    padding: 3px 6px; /* 减小内边�?*/
    border-radius: 4px;
    background: #f8f9fa; /* 添加与price-entry相同的灰色背�?*/
}

.trade-item:hover {
    background-color: #f5f5f5;
}

.trade-time {
    color: #666;
    min-width: 85px;  /* 固定时间宽度 */
}

.trade-price {
    color: #1f1f1f;
    font-family: monospace;
}

/* 已解锁状态样�?*/
.status-unlocked {
    background-color: #f6ffed;
    color: #52c41a;
    border: 1px solid #b7eb8f;
}

.tooltip-actions {
    display: flex;
    gap: 8px;
}

.action-btn {
    padding: 4px 8px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    background: white;
    cursor: pointer;
    font-size: 12px;
    display: flex;
    align-items: center;
    gap: 4px;
    transition: all 0.3s;
}

.action-btn:hover {
    background: #f5f5f5;
}

.edit-btn {
    color: #1890ff;
    border-color: #1890ff;
}

.delete-btn {
    color: #ff4d4f;
    border-color: #ff4d4f;
}

.add-btn {
    color: #52c41a;
    border-color: #52c41a;
}

.compare-btn {
    background: linear-gradient(135deg, #13c2c2 0%, #1890ff 100%);
    color: white;
    border: none;
    border-radius: 4px;
    padding: 4px 8px;
    cursor: pointer;
    font-size: 11px;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 3px;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(24, 144, 255, 0.3);
    white-space: nowrap;
}

.compare-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(24, 144, 255, 0.4);
}

/* 对话框样�?*/
.edit-dialog {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    /* 默认层；serverCompare 在已有 edit-dialog 时会动态提到 1000001+，账号编辑在对比打开时会再 +1 */
    z-index: 1000000;
    overflow: hidden;
}

.dialog-content {
    background: white;
    padding: 8px;
    border-radius: 8px;
    width: 95%;
    max-width: 1800px;
    max-height: 85vh; /* 减少高度，为滚动条预留更多空间 */
    display: flex;
    flex-direction: column;
    overflow: hidden; /* 确保内容不会溢出 */
    position: relative; /* 为导航按钮定位 */
}

/* 物品导航按钮 */
.item-nav-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 48px;
    border: none;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
}

.item-nav-btn:hover:not(:disabled) {
    transform: translateY(-50%) scale(1.1);
    box-shadow: 0 6px 16px rgba(102, 126, 234, 0.6);
}

.item-nav-btn:active:not(:disabled) {
    transform: translateY(-50%) scale(0.95);
}

.item-nav-btn:disabled {
    opacity: 0.3;
    cursor: not-allowed;
    background: #ccc;
}

.item-nav-prev {
    left: 10px;
}

.item-nav-next {
    right: 10px;
}

.item-nav-btn svg {
    width: 24px;
    height: 24px;
}

/* 物品索引信息 */
.item-index-info {
    font-size: 14px;
    color: #666;
    font-weight: normal;
    margin-left: 8px;
}

.dialog-content h2 {
    margin-bottom: 24px;
    color: #1f1f1f;
    font-size: 18px;
    flex-shrink: 0;
}

.dialog-content form {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
}

.form-content {
    flex: 1;
    overflow-y: auto;
    padding-right: 8px;
}

/* 表单布局 */
.form-row {
    display: flex;
    gap: 15px;
    margin-bottom: 12px;
}

.form-row .form-group {
    flex: 1;
}

.form-group {
    margin-bottom: 12px;
}

.form-group label {
    display: block;
    margin-bottom: 4px;
    font-size: 12px;
    color: #333;
}

.form-group input,
.form-group select {
    width: 100%;
    padding: 4px 8px;
    font-size: 12px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
}

/* 底部按钮固定在底�?*/
.dialog-buttons {
    margin-top: 15px;
    display: flex;
    justify-content: space-between;
    gap: 8px;
    flex-shrink: 0;
    padding-top: 15px;
    border-top: 1px solid #f0f0f0;
    background: white;
}

.dialog-buttons .left-buttons {
    display: flex;
    gap: 8px;
}

.dialog-buttons .right-buttons {
    display: flex;
    gap: 8px;
}

.merge-btn {
    color: #08979c;
    border-color: #08979c;
}

.update-sold-btn {
    color: #13c2c2;
    border-color: #13c2c2;
}

.dialog-buttons button {
    padding: 4px 12px;
    font-size: 12px;
    border-radius: 4px;
}

/* 物品选择区域 */
.items-section {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid #eee;
}

.available-items {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 8px;
    padding: 10px;
    margin-bottom: 12px;
    background: #fafafa;
    border: 1px solid #e8e8e8;
    border-radius: 4px;
    max-height: 120px;
    overflow-y: auto;
}

.item-btn {
    padding: 4px 8px;
    font-size: 12px;
    color: #1890ff;
    background: white;
    border: 1px solid #1890ff;
    border-radius: 4px;
    cursor: pointer;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
}

.item-btn .item-icon {
    flex-shrink: 0;
}

/* 物品表格样式 */
.item-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 8px;
    table-layout: fixed;
}

.item-table th,
.item-table td {
    padding: 6px;
    border: 1px solid #e8e8e8;
    text-align: center;
    font-size: 12px;
}

.item-table th {
    background: #fafafa;
    font-weight: normal;
}

/* 设置列宽 */
.item-table th:nth-child(1),
.item-table td:nth-child(1) {
    width: 35%;  /* 物品名称 */
    text-align: left;
}

.item-table td:nth-child(1) .item-icon {
    vertical-align: middle;
}

.item-table th:nth-child(2),
.item-table td:nth-child(2),
.item-table th:nth-child(3),
.item-table td:nth-child(3),
.item-table th:nth-child(4),
.item-table td:nth-child(4) {
    width: 12%;  /* 数量、价格、已�?*/
}

.item-table th:nth-child(5),
.item-table td:nth-child(5) {
    width: 12%;  /* 调价类型 */
}

.item-table th:nth-child(6),
.item-table td:nth-child(6) {
    width: 17%;  /* 操作�?*/
}

.item-actions {
    display: flex;
    gap: 4px;
    justify-content: center;
}

.transfer-item-btn {
    color: #1890ff;
    border-color: #1890ff;
    padding: 2px 4px;
    font-size: 11px;
}

.mark-sold-btn {
    color: #13c2c2;
    border-color: #13c2c2;
    padding: 2px 4px;
    font-size: 11px;
}

/* 输入框样�?*/
.quantity-input,
.price-input,
.hadSale-input {
    width: 80%;
    padding: 4px;
    font-size: 12px;
    border: 1px solid #d9d9d9;
    border-radius: 3px;
}

.transfer-hint {
    font-size: 12px;
    color: #8c8c8c;
    margin-left: 6px;
}

.transfer-amount-max-btn {
    margin-left: 8px;
    padding: 4px 10px;
    font-size: 12px;
    color: #1890ff;
    background: white;
    border: 1px solid #1890ff;
    border-radius: 4px;
    cursor: pointer;
    white-space: nowrap;
    vertical-align: middle;
}

.transfer-amount-max-btn:hover {
    background: #e6f7ff;
}

.transfer-dialog .form-group input.quantity-input {
    width: 100px;
}

/* 转入/转回时间输入框与「现在」按钮 */
.datetime-input-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
}

.datetime-input-wrap .datetime-input {
    flex: 1;
    min-width: 0;
}

.datetime-now-btn {
    padding: 4px 10px;
    font-size: 12px;
    color: #1890ff;
    background: white;
    border: 1px solid #1890ff;
    border-radius: 4px;
    cursor: pointer;
    white-space: nowrap;
}

.datetime-now-btn:hover {
    color: #40a9ff;
    border-color: #40a9ff;
}

/* 服务器建议框 */
.server-suggestions {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    max-height: 200px;
    overflow-y: auto;
    z-index: 1100;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    display: none;
}

.server-suggestion {
    padding: 6px 12px;
    cursor: pointer;
    font-size: 12px;
}

.server-suggestion:hover {
    background: #f5f5f5;
}

.server-input-container {
    position: relative;
}

/* 服务器表格容器样�?*/
.server-table-container {
    margin-top: -20px;
    max-height: 400px; /* 恢复高度限制 */
    overflow-y: auto; /* 恢复垂直滚动 */
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    -webkit-overflow-scrolling: touch; /* 在iOS上提供惯性滚�?*/
    scroll-behavior: smooth; /* 平滑滚动 */
}

/* 服务器表格样�?*/
.server-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    table-layout: fixed;
}

/* 添加表格斑马纹，提高行间区分�?*/
.server-table tbody tr:nth-child(even) {
    background-color: rgba(249, 250, 251, 0.7);
}

.server-table th,
.server-table td {
    padding: 6px 8px;
    line-height: 1.4;
    text-align: left;
    border: 1px solid #e5e7eb;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 调整列宽比例 - 优化常见列宽�?*/
.server-table th[data-sort="server"] { width: 120px; }     /* 服务器名称，增加宽度 */
.server-table th[data-sort="type"] { width: 70px; }       /* 开服状态，稍微增加宽度 */
.server-table td.server-type-cell { overflow: visible; text-overflow: clip; } /* 开服状态列不截断 */
.server-table th[data-sort="price"]{ width: 55px; } 
.server-table th[data-sort="fivePrice"]{ width: 55px; } 
.server-table th[data-sort="minPrice"] { width: 55px; }   /* 价格相关列，稍增加宽�?*/
.server-table th[data-sort="mhbPrice"] { width: 70px; }   /* 金币价 */
.server-table th[data-sort="count"] { width: 50px; }      /* 数量 */
.server-table th[data-sort="dayChange"] { width: 65px; }  /* 环比 */
.server-table th[data-sort="historyMin"]{ width: 55px; } 
.server-table th[data-sort="historyMax"]{ width: 55px; } 
.server-table th[data-sort="historyAvg"] { width: 70px; } /* 历史数据 */
.server-table th[data-sort="note"] { width: 90px; }       /* 备注 */
.server-table th[data-sort="daySold"] { width: 55px; }    /* 24时售�?*/
.server-table th[data-sort="tradeFreq"] { width: 75px; }  /* 交易频率 */
.server-table th[data-sort="personalData"] { width: 200px; }/* 个人数据 - 拉宽 */
.server-table th[data-sort="accountRole"] { width: 160px; } /* 账号角色 */

/* 统一表格字体样式 */
.server-table td,
.server-table th {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 12px;
}

/* 数字列样式优化，更好的对齐和字体 */
.server-table td[data-type="number"] {
    text-align: right;
    padding-right: 8px;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    letter-spacing: -0.5px;
}

/* 确保所有单元格内容显示一�?*/
.server-table td {
    padding: 4px 6px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 固定表头样式 */
.server-table th {
    background: #f8fafc;
    font-weight: 600;
    cursor: pointer;
    position: sticky;
    top: 0;
    z-index: 10; /* 提高z-index确保覆盖其他元素 */
    border-bottom: 2px solid #e5e7eb;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05); /* 添加阴影增强视觉效果 */
}

/* 优化行高和间�?*/
.server-table tr {
    height: 32px;  /* 固定行高 */
    transition: all 0.2s ease; /* 添加过渡效果 */
}

/* 改进行悬停效�?*/
.server-table tbody tr:hover {
    background-color: #ebf8ff;
    transform: translateY(-1px);
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

/* 计划转入：转出服或目标服 + targets 非空 + itemBuyPrices 含当前道具 */
.server-table tbody tr.row-planned-transfer-item td {
    background-color: #d1c4e9 !important;
}
.server-table tbody tr.row-planned-transfer-item:hover td {
    background-color: #b39ddb !important;
}

/* 今日尚未爬到：回退昨日数据的行用浅灰底，文字略浅 */
.server-table tbody tr.row-yesterday-data td {
    background-color: #eceff1;
    color: #8a949e;
}
.server-table tbody tr.row-yesterday-data td > * {
    opacity: 0.78;
}
.server-table tbody tr.row-yesterday-data:hover td {
    background-color: #dde1e4;
}
.server-table tbody tr.row-planned-transfer-item.row-yesterday-data td {
    background-color: #d1c4e9 !important;
}
.server-table tbody tr.row-planned-transfer-item.row-yesterday-data:hover td {
    background-color: #b39ddb !important;
}

.tooltip-yesterday-badge {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 6px;
    border-radius: 4px;
    background: #eceff1;
    color: #546e7a;
    font-size: 11px;
    font-weight: 500;
    vertical-align: middle;
}

@keyframes bullish-tag-pulse {
    0%, 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(229, 57, 53, 0.55); }
    50% { transform: scale(1.08); box-shadow: 0 0 8px 2px rgba(229, 57, 53, 0.4); }
}
.server-table td.min-price-cell {
    overflow: visible;
    text-align: right;
}
.min-price-inner {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    max-width: 100%;
}
.min-price-value {
    flex-shrink: 0;
}
.bullish-rise-tag {
    display: inline-block;
    flex-shrink: 0;
    padding: 0 5px;
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
    color: #fff;
    background: linear-gradient(180deg, #ff5252, #d32f2f);
    border-radius: 3px;
    animation: bullish-tag-pulse 1.2s ease-in-out infinite;
}

@keyframes mean-discount-buy-pulse {
    0%, 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(82, 196, 26, 0.5); }
    50% { transform: scale(1.08); box-shadow: 0 0 8px 2px rgba(82, 196, 26, 0.38); }
}
.mean-discount-buy-tag {
    display: inline-block;
    flex-shrink: 0;
    padding: 0 5px;
    font-size: 11px;
    font-weight: 700;
    line-height: 16px;
    color: #fff;
    background: linear-gradient(180deg, #73d13d, #389e0d);
    border-radius: 3px;
    animation: mean-discount-buy-pulse 1.2s ease-in-out infinite;
}
.server-table tbody tr td.min-price-cell.mean-discount-buy-cell,
.server-table tbody tr td[data-col="historyAvg"].mean-discount-buy-cell {
    background-color: #c8e6c9 !important;
}

/* 美化表头排序图标 */
.server-table th::after {
    content: '';
    position: absolute;
    right: 6px;
    opacity: 0.4;
    font-size: 10px;
    top: 50%;
    transform: translateY(-50%);
}

/* 突出显示当前排序的列 */
.server-table th.active-sort {
    background-color: #edf2f7;
    color: #2d3748;
}

/* 改进排序指示?*/
.server-table th.sort-asc::after {
    content: '';
    color: #4299e1;
    opacity: 0.8;
}

.server-table th.sort-desc::after {
    content: '';
    color: #4299e1;
    opacity: 0.8;
}

/* 添加分隔?*/
.server-table td {
    border-right: 1px solid #edf2f7;
}

/* 优化服务器类型标签样式 */
.server-table .server-type {
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 11px;
    display: inline-block;
}

/* 添加胶囊样式 */
.tag {
    display: inline-block;
    padding: 2px 6px;
    border-radius: 12px;
    font-size: 11px;
    margin: 0 2px;
    white-space: nowrap;
}

/* 详情表「账号角色」：按该账号库存市价总价值分色，可点击打开账号库存 */
.account-role-cell {
    line-height: 1.7;
}
.account-role-tag {
    cursor: pointer;
    border: 1px solid;
    margin: 1px 2px 1px 0;
    user-select: none;
}
.account-role-tag:hover {
    filter: brightness(0.97);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
}
.account-role-tag:active {
    transform: translateY(0.5px);
}
.account-role-v0 {
    background-color: #f5f5f5;
    border-color: #d9d9d9;
    color: #666;
}
.account-role-v1 {
    background-color: #f6ffed;
    border-color: #b7eb8f;
    color: #389e0d;
}
.account-role-v2 {
    background-color: #e6f7ff;
    border-color: #91d5ff;
    color: #096dd9;
}
.account-role-v3 {
    background-color: #fff7e6;
    border-color: #ffd591;
    color: #d46b08;
}
.account-role-v4 {
    background-color: #fff1f0;
    border-color: #ffa39e;
    color: #cf1322;
}
.account-role-v5 {
    background-color: #f9f0ff;
    border-color: #d3adf7;
    color: #531dab;
}

/* 备注标签样式 */
.tag-low {
    background-color: #f6ffed;
    border-color: #b7eb8f;
    color: #52c41a;
}

.tag-high {
    background-color: #fff1f0;
    border-color: #ffa39e;
    color: #f5222d;
}

.tag-warning {
    background-color: #fff7e6;
    border-color: #ffd591;
    color: #fa8c16;
}

.tag-trader {
    background-color: #f9f0ff;
    border-color: #d3adf7;
    color: #722ed1;
}

.tag-default {
    background-color: #f5f5f5;
    border-color: #d9d9d9;
    color: #666;
}

/* 计划购入价（planned_transfer_in_records itemBuyPrices） */
.tag-planned-buy {
    background-color: #ede7f6;
    border: 1px solid #b39ddb;
    color: #4527a0;
}

/* [售高]标签样式 */
.tag-售高 {
    background-color: #ff7a45;
    border-color: #ff7a45;
    color: #ffffff;
}

/* [售低]标签样式 */
.tag-售低 {
    background-color: #52c41a;
    border-color: #52c41a;
    color: #ffffff;
}

/* [库存少]标签样式 */
.tag-low-stock {
    background-color: #f9f0ff;
    border-color: #d3adf7;
    color: #722ed1;
}

/* 交易频率标签样式 */
.trade-frequency-tag {
    display: inline-block;
    padding: 3px 8px;
    border-radius: 12px;
    font-size: 12px;
    white-space: nowrap;
    font-weight: 600;
    border: 1px solid;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

/* 超爆标签样式 */
.tag-超爆 {
    background-color: #fff1f0;
    border-color: #ffa39e;
    color: #f5222d;
}

/* 火爆标签样式 */
.tag-火爆 {
    background-color: #fff7e6;
    border-color: #ffd591;
    color: #fa8c16;
}

/* 普通标签样式 */
.tag-普通 {
    background-color: #f6ffed;
    border-color: #b7eb8f;
    color: #52c41a;
}

/* 勿入标签样式 */
.tag-勿入 {
    background-color: #f0f0f0;
    border-color: #d9d9d9;
    color: #666;
}

.market-detail-tooltip {
    position: fixed;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
    padding: 15px;
    z-index: 100000; /* 提高z-index，确保在所有弹窗之上 */
    min-width: 1140px; /* 增加宽度以容纳带大区的第三列 */
    max-width: 1400px; /* 增加最大宽度 */
    font-size: 12px;
    /* 外层不接收点击：tip 很宽时，点到「框外空白」实际会穿透到下方详细信息弹窗，从而触发 document 关闭逻辑 */
    pointer-events: none;
}

.market-detail-tooltip .tooltip-content {
    pointer-events: auto;
}

.tooltip-content {
    display: flex;
    flex-direction: column;
    gap: 10px; /* 减小垂直间距 */
}

.tooltip-main-content {
    display: flex;
    flex-direction: column;
    gap: 8px; /* 减小间距 */
}

.tooltip-top-row {
    display: flex;
    gap: 10px; /* 减小列间距以节省空间 */
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
    flex-wrap: nowrap; /* 确保不换行 */
}

.tooltip-bottom-row {
    width: 100%;
}

.tooltip-left, .tooltip-middle, .tooltip-right {
    flex: 1;
    min-width: 150px; /* 减小最小宽�?*/
}

.tooltip-section {
    margin-bottom: 12px; /* 减小底部边距 */
}

/* 为tooltip-top-row内的三列设置特定宽度 */
.tooltip-top-row .tooltip-section {
    flex: 0 0 auto; /* 不增长，不收缩，自动宽度 */
    min-width: 205px; /* 调整为三列布局的最小宽度 */
}

/* 价格列 */
.tooltip-top-row .price-section {
    width: 210px;
}

/* 成交记录列 */
.tooltip-top-row .trade-section {
    width: 210px;
}

/* 高价服务器列（加宽以防右侧胶囊超出边界） */
.tooltip-top-row .high-price-section {
    width: 520px;
    min-width: 300px;
    padding-left: 4px;
    padding-right: 4px;
}

/* 有 attrs_detail_list：独立 tip（与旧 market-detail-tooltip 分离，不污染材料三列） */
.market-attrs-tooltip {
    position: fixed;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
    padding: 15px;
    z-index: 100000;
    min-width: 1100px;
    max-width: min(1480px, 96vw);
    max-height: 90vh;
    overflow-x: hidden;
    overflow-y: auto;
    font-size: 12px;
    pointer-events: none;
}

.market-attrs-tooltip .tooltip-content {
    pointer-events: auto;
}

.market-attrs-tooltip .mat-top-row {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 12px;
    width: 100%;
}

.market-attrs-tooltip .mat-list-panel {
    flex: 1 1 auto;
    min-width: 0;
}

.market-attrs-tooltip .mat-side-stack {
    flex: 0 0 400px;
    width: 400px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.market-attrs-tooltip .mat-panel-title {
    font-size: 13px;
    font-weight: 600;
    margin: 0 0 8px;
    color: #374151;
}

.market-attrs-tooltip .mat-listing-scroll {
    max-height: min(560px, 58vh);
    min-height: 240px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-right: 4px;
}

.market-attrs-tooltip .mat-side-box {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #fff;
    padding: 10px;
}

.market-attrs-tooltip .mat-side-scroll {
    max-height: 180px;
    overflow-y: auto;
}

.market-attrs-tooltip .mat-card {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #fafafa;
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.market-attrs-tooltip .mat-card.mat-card--long-listed {
    background: #f3f4f6;
    border-color: #d1d5db;
}

.market-attrs-tooltip .mat-card.mat-card--fair-show {
    background: #eff6ff;
    border-color: #93c5fd;
}

.market-attrs-tooltip .mat-card.mat-card--hot-collect {
    background: #fff1f2;
    border-color: #fda4af;
}

/* 多重命中时底色优先级：高收藏(红) > 公示(蓝) > 上架过久(灰) */
.market-attrs-tooltip .mat-card.mat-card--long-listed.mat-card--fair-show {
    background: #eff6ff;
    border-color: #93c5fd;
}

.market-attrs-tooltip .mat-card.mat-card--hot-collect.mat-card--fair-show,
.market-attrs-tooltip .mat-card.mat-card--hot-collect.mat-card--long-listed,
.market-attrs-tooltip .mat-card.mat-card--hot-collect.mat-card--fair-show.mat-card--long-listed {
    background: #fff1f2;
    border-color: #fda4af;
}

.market-attrs-tooltip .mat-card:hover {
    background: #f3f4f6;
    border-color: #d1d5db;
}

.market-attrs-tooltip .mat-card.mat-card--long-listed:hover {
    background: #e5e7eb;
}

.market-attrs-tooltip .mat-card.mat-card--fair-show:hover {
    background: #dbeafe;
}

.market-attrs-tooltip .mat-card.mat-card--hot-collect:hover,
.market-attrs-tooltip .mat-card.mat-card--hot-collect.mat-card--fair-show:hover,
.market-attrs-tooltip .mat-card.mat-card--hot-collect.mat-card--long-listed:hover,
.market-attrs-tooltip .mat-card.mat-card--hot-collect.mat-card--fair-show.mat-card--long-listed:hover {
    background: #ffe4e6;
}

.market-attrs-tooltip .mat-card.mat-card--long-listed.mat-card--fair-show:hover {
    background: #dbeafe;
}

.market-attrs-tooltip .mat-hl-tag {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.35;
}

.market-attrs-tooltip .mat-hl-tag.fair-show {
    background: #dbeafe;
    color: #1d4ed8;
    border: 1px solid #93c5fd;
}

.market-attrs-tooltip .mat-hl-tag.hot-collect {
    background: #ffe4e6;
    color: #be123c;
    border: 1px solid #fda4af;
}

.market-attrs-tooltip .mat-hl-tag.long-listed {
    background: #e5e7eb;
    color: #4b5563;
    border: 1px solid #d1d5db;
}

.market-attrs-tooltip .mat-card-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.market-attrs-tooltip .mat-card-head-left {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    flex-wrap: wrap;
}

.market-attrs-tooltip .mat-rank {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    padding: 2px 8px;
    border-radius: 4px;
    background: #3b82f6;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    font-family: ui-monospace, monospace;
}

.market-attrs-tooltip .mat-price {
    color: #dc2626;
    font-size: 16px;
    font-weight: 700;
}

.market-attrs-tooltip .mat-name {
    color: #4b5563;
    font-size: 13px;
    font-weight: 500;
}

.market-attrs-tooltip .mat-meta {
    color: #9ca3af;
    font-size: 12px;
    font-weight: 400;
    white-space: nowrap;
}

.market-attrs-tooltip .mat-gold-col {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
}

.market-attrs-tooltip .mat-gold {
    background: #f59e0b;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: 4px;
}

.market-attrs-tooltip .mat-bargain-badge {
    background: #ecfdf5;
    color: #059669;
    border: 1px solid #a7f3d0;
    font-size: 10px;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 4px;
    white-space: nowrap;
}

.market-attrs-tooltip .mat-buy-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    padding: 2px 8px;
    border-radius: 4px;
    border: 1px solid #86efac;
    background: #ecfdf5;
    color: #047857;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.35;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}

.market-attrs-tooltip .mat-buy-btn:hover {
    background: #d1fae5;
    border-color: #34d399;
    color: #065f46;
}

.market-attrs-tooltip .mat-main {
    display: inline;
    font-size: 12px;
    font-weight: 600;
    color: #4a5f69;
    white-space: nowrap;
}

.market-attrs-tooltip .mat-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.market-attrs-tooltip .mat-chip {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    padding: 3px 8px;
    border-radius: 999px;
    border: 1px solid #e5e7eb;
    background: #f3f4f6;
    color: #374151;
    font-size: 12px;
    line-height: 1.35;
    white-space: nowrap;
}

.market-attrs-tooltip .mat-chip.skill {
    background: #eff6ff;
    border-color: #bfdbfe;
    color: #1d4ed8;
}

.market-attrs-tooltip .mat-chip.addon {
    background: #f5f3ff;
    border-color: #ddd6fe;
    color: #5b21b6;
}

.market-attrs-tooltip .mat-chip.refine {
    background: #fff7ed;
    border-color: #fed7aa;
    color: #c2410c;
}

.market-attrs-tooltip .mat-chip.suit {
    background: #fef3c7;
    border-color: #fcd34d;
    color: #92400e;
}

.market-attrs-tooltip .mat-chip.yupo {
    background: #ecfdf5;
    border-color: #a7f3d0;
    color: #047857;
}

.market-attrs-tooltip .mat-chip.warn {
    background: #fef2f2;
    border-color: #fecaca;
    color: #b91c1c;
    font-weight: 600;
}

.market-attrs-tooltip .mat-empty {
    color: #9ca3af;
    font-size: 12px;
    text-align: center;
    padding: 28px 8px;
    font-style: italic;
}

/* 高价服务器标题特定样式 */
.high-price-section .section-title {
    text-align: left;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-right: 5px; /* 右侧留出一点空间 */
}

.tooltip-section .section-title {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 4px; /* 大幅减小底部间距 */
    font-weight: 600;
    color: #333;
    font-size: 12px; /* 减小字体 */
    width: 100%; /* 确保标题占满宽度 */
    justify-content: flex-start; /* 左对齐 */
    padding-left: 2px; /* 左侧稍微增加内边距 */
}

.tooltip-section .section-icon {
    font-size: 14px;
}

.price-section, .trade-section, .high-price-section {
    background: #f9f9f9;
    padding: 6px; /* 减小内边距 */
    border-radius: 4px;
    border: 1px solid #e8e8e8;
    height: 100%; /* 确保三列高度一致 */
    display: flex;
    flex-direction: column;
}

/* 高价服务器列表样式 */
.high-price-servers {
    display: flex;
    flex-direction: column;
    gap: 2px; /* 与前两列保持一致的间距 */
    flex: 1; /* 填充剩余空间 */
    overflow-y: auto; /* 如果内容过多允许滚动 */
    max-height: 280px; /* 固定高度，约显示10个服务器（10×26px + 9×2px = 278px） */
    min-height: 280px; /* 确保最小高度一致 */
}

.server-entry {
    display: flex;
    align-items: center;
    gap: 8px; /* 增加间距让4个数据分布更均匀 */
    padding: 4px 8px; /* 与前两列保持一致的内边距 */
    background: #f8f9fa;
    border-radius: 4px; /* 与前两列保持一致的圆角 */
    height: 26px; /* 与前两列保持一致的高度 */
    font-size: 11px;
    width: 100%;
    box-sizing: border-box;
    transition: background-color 0.2s ease;
}

.server-entry:hover {
    background-color: #f5f5f5;
}

.server-entry.clickable-server {
    cursor: pointer;
}

.server-entry.clickable-server:hover {
    background-color: #e6f7ff;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.server-entry .server-info {
    display: flex;
    flex-direction: column;
    gap: 1px;
    flex: 1;
    min-width: 0; /* 允许收缩 */
    overflow: hidden;
}

.server-entry .server-name {
    font-weight: 500;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 11px; /* 增大字体大小 */
    width: 100px; /* 增加宽度以显示大区和服务器名 */
    flex-shrink: 0;
}

.server-entry .server-price {
    font-size: 12px; /* 增大字体大小 */
    color: #666;
    white-space: nowrap;
    width: 45px; /* 固定宽度确保均匀分布 */
    text-align: left;
    flex-shrink: 0;
}

/* 高价服务器行：账号在该服该道具库存剩余（颜色由 tooltip-hp-inventory-zero / m1～m10 分档） */
.server-entry .tooltip-hp-inventory {
    font-size: 10px;
    font-weight: 600;
    color: #595959;
    white-space: nowrap;
    flex-shrink: 0;
    min-width: 2.2em;
}

.server-entry .tooltip-hp-inventory.tooltip-hp-inventory-zero {
    color: #bfbfbf;
    font-weight: 500;
}

/* 大于 0：按数量十进制位数分档（1～9、10～99、100～999…，每进 10 倍一级） */
.server-entry .tooltip-hp-inventory.tooltip-hp-inventory-m1 { color: #52c41a; }
.server-entry .tooltip-hp-inventory.tooltip-hp-inventory-m2 { color: #13c2c2; }
.server-entry .tooltip-hp-inventory.tooltip-hp-inventory-m3 { color: #1890ff; }
.server-entry .tooltip-hp-inventory.tooltip-hp-inventory-m4 { color: #722ed1; }
.server-entry .tooltip-hp-inventory.tooltip-hp-inventory-m5 { color: #eb2f96; }
.server-entry .tooltip-hp-inventory.tooltip-hp-inventory-m6 { color: #fa541c; }
.server-entry .tooltip-hp-inventory.tooltip-hp-inventory-m7 { color: #d48806; }
.server-entry .tooltip-hp-inventory.tooltip-hp-inventory-m8 { color: #cf1322; }
.server-entry .tooltip-hp-inventory.tooltip-hp-inventory-m9 { color: #820014; }
.server-entry .tooltip-hp-inventory.tooltip-hp-inventory-m10 { color: #434343; }

.trade-frequency-capsule {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px 5px; /* 稍微增加内边距 */
    border-radius: 10px; /* 与状态胶囊保持一致的圆角 */
    font-size: 9px; /* 适中的字体大小 */
    font-weight: 500;
    min-width: 45px; /* 稍微增加宽度以显示具体数量 */
    height: 18px; /* 与状态胶囊保持一致的高度 */
    flex-shrink: 0; /* 防止收缩 */
}

.trade-frequency-capsule .frequency-text {
    color: white;
}

/* 根据交易频率设置不同的背景色 - 使用类名控制 */
.trade-frequency-capsule.freq-high {
    background-color: #10b981;
}

.trade-frequency-capsule.freq-medium {
    background-color: #f59e0b;
}

.trade-frequency-capsule.freq-low {
    background-color: #ef4444;
}

/* 默认样式 */
.trade-frequency-capsule {
    background-color: #6b7280;
}

/* 服务器状态胶囊样式 */
.server-status-capsule {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 3px 6px; /* 增加内边距 */
    border-radius: 10px; /* 稍微增加圆角 */
    font-size: 10px; /* 适中的字体大小 */
    font-weight: 500;
    min-width: 40px; /* 增加最小宽度 */
    height: 18px; /* 增加高度 */
    flex-shrink: 0;
}

.server-status-capsule .status-text {
    color: white;
}

/* 不同服务器状态的背景色 */
.server-status-capsule.status-kaiqu {
    background-color: #ef4444; /* 红色 - 开区 */
}

.server-status-capsule.status-dayanhua {
    background-color: #f97316; /* 橙色 - 大烟花 */
}

.server-status-capsule.status-xiaoyanhua {
    background-color: #f59e0b; /* 黄色 - 小烟花 */
}

.server-status-capsule.status-niannei {
    background-color: #3b82f6; /* 蓝色 - 年内 */
}

.server-status-capsule.status-3niannei {
    background-color: #8b5cf6; /* 紫色 - 3年内 */
}

.server-status-capsule.status-pingzhuan {
    background-color: #6b7280; /* 灰色 - 平转 */
}

.server-status-capsule.status-normal {
    background-color: #6b7280; /* 灰色 - 普通 */
}

.server-rank {
    color: #666;
    font-size: 10px; /* 增加字体大小 */
    font-family: monospace;
}

.high-price-servers .server-name .history-player-names {
    font-size: 9px !important; /* 小于服务器名的11px */
    color: #999 !important; /* 灰色 */
    font-weight: normal !important;
    margin-left: 4px !important;
    white-space: nowrap !important; /* 不换行 */
    overflow: visible !important;
    text-overflow: clip !important; /* 不省略 */
    display: inline !important; /* 确保是行内元素 */
}

.high-price-servers .server-name {
    color: #333 !important;
    font-size: 11px !important; /* 增加字体大小 */
    font-weight: 500 !important;
    white-space: nowrap !important; /* 不换行 */
    overflow: visible !important; /* 允许超出，可以与价格重叠 */
    text-overflow: clip !important; /* 不显示省略号 */
    min-width: 0 !important;
    width: auto !important; /* 不限制宽度 */
    max-width: none !important;
    display: inline !important; /* 确保是行内元素，允许内容溢出 */
}

.high-price-servers .server-price {
    font-weight: 500;
    color: #f5222d;
    font-size: 11px; /* 增加字体大小 */
}

/* 道具 tip 高价服：名与月销数字紧跟排列；禁止 flex:1 把数字推到块右侧造成大空白 */
.high-price-servers .hp-server-name-block {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
    flex: 0 1 auto;
    max-width: min(200px, 46%);
    overflow: hidden;
}
.high-price-servers .hp-server-name-block .server-name {
    flex: 0 1 auto;
    max-width: 148px;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* 高价服列表：转服方向胶囊（可转入 / 可被转入 / 双向） */
.high-price-servers .hp-transfer-capsule {
    display: inline-flex;
    align-items: center;
    max-width: 148px;
    min-width: 0;
    padding: 1px 6px;
    border-radius: 10px;
    border: 1px solid transparent;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.35;
    flex-shrink: 0;
    overflow: hidden;
    box-sizing: border-box;
}
.high-price-servers .hp-transfer-capsule .hp-transfer-server-label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}
/* 可转入：绿色；可被转入：蓝色（仅两种转服方向色） */
.high-price-servers .hp-transfer-capsule.hp-transfer-to {
    background: #f6ffed;
    border-color: #b7eb8f;
    color: #389e0d;
}
.high-price-servers .hp-transfer-capsule.hp-transfer-from {
    background: #e6f4ff;
    border-color: #91caff;
    color: #0958d9;
}
.high-price-servers .hp-transfer-capsule.hp-transfer-none {
    background: #fafafa;
    border-color: #d9d9d9;
    color: #595959;
}
.high-price-servers .hp-transfer-capsule .history-player-names {
    font-size: 9px;
    color: inherit;
    opacity: 0.75;
    margin-left: 4px;
    font-weight: normal;
}
.high-price-servers .hp-server-name-block .tooltip-hp-monthly-sum,
.high-price-servers .hp-server-name-block .tsrd-monthly-sum {
    flex-shrink: 0;
    color: #595959;
    font-weight: 600;
}

.high-price-servers .server-entry {
    gap: 4px;
    min-width: 0;
    padding: 4px 5px;
    box-sizing: border-box;
}
.high-price-servers .server-entry .status-cell {
    flex-shrink: 0;
    padding: 1px 5px;
    font-size: 10px;
    margin: 0;
}
.high-price-servers .server-entry .server-price {
    flex-shrink: 0;
    width: auto;
    min-width: 50px;
}
.high-price-servers .server-entry .sales-count {
    flex-shrink: 0;
    min-width: 52px;
    padding: 2px 5px;
    font-size: 10px;
}

.no-data {
    color: #999;
    text-align: center;
    padding: 20px 0;
    font-style: italic;
}

/* 当前在售价格列表 */
.current-prices {
    display: flex;
    flex-direction: column;
    gap: 2px; /* 稍微增加间距提高可读性 */
    overflow-y: auto; /* 如果内容过多允许滚动 */
    max-height: 280px; /* 固定高度，约显示10个条目（10×26px + 9×2px = 278px） */
    min-height: 280px; /* 确保最小高度一致 */
}

.price-entry {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 8px; /* 增加内边距 */
    background: #f9f9f9; /* 与第三列背景色一致 */
    border-radius: 4px;
    height: 26px; /* 增加高度 */
    font-size: 11px; /* 与第三列字体大小一致 */
    white-space: nowrap; /* 防止文字换行 */
}

.price-entry:hover {
    background-color: #f5f5f5;
}

.price-entry .amount {
    font-weight: 500;
    color: #f5222d; /* 与第三列价格颜色一致 */
    font-size: 11px; /* 与第三列价格字体大小一致 */
    margin-right: 8px; /* 增加右边距 */
}

/* 添加价格序号样式 */
.price-rank {
    color: #999; /* 浅色文字，不那么显眼 */
    font-size: 10px;
    margin-right: 5px;
    font-family: monospace;
}

.price-entry .gold {
    color: #666;
    font-size: 11px; /* 增加字体大小 */
    flex-shrink: 0; /* 防止收缩 */
}

/* 成交记录列表 */
.trade-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
    overflow: visible;
}

.trade-item {
    display: flex;
    justify-content: space-between;
    padding: 4px 8px; /* 增加内边距 */
    border-radius: 4px;
    background: #f9f9f9; /* 与第三列背景色一致 */
    height: 26px; /* 与price-entry保持一致 */
    font-size: 11px; /* 与第三列字体大小一致 */
    white-space: nowrap; /* 防止文字换行 */
}

.trade-item:hover {
    background-color: #f5f5f5;
}

.trade-time {
    color: #999; /* 浅色文字，与价格序号一致 */
    min-width: 90px;  /* 增加时间宽度确保完整显示 */
    display: flex;
    align-items: center;
    font-size: 10px; /* 与价格序号字体大小一致 */
    flex-shrink: 0; /* 防止收缩 */
}

.trade-price {
    font-weight: 500;
    color: #f5222d; /* 与第三列价格颜色一致 */
    display: flex;
    align-items: center; /* 垂直居中 */
    font-size: 11px; /* 与第三列价格字体大小一致 */
}

/* 价格图表 */
.price-chart {
    height: 280px;  /* 增加图表高度 */
    width: 100%;
    margin-top: 8px; /* 减小顶部边距 */
    margin-bottom: 15px; /* 减小底部边距 */
    position: relative; /* 添加相对定位 */
}

/* 优化图表样式 */
.price-chart canvas {
    background: #fff;
}

/* 图表放大按钮样式 */
.chart-zoom-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    margin-left: 8px;
    font-size: 14px;
    color: #1890ff;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.chart-zoom-btn:hover {
    background-color: rgba(24, 144, 255, 0.1);
    color: #40a9ff;
}

.chart-zoom-btn:active {
    background-color: rgba(24, 144, 255, 0.2);
}

/* 图表放大窗口样式 */
.chart-zoom-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000000; /* 提高到最高层，确保在对比弹窗之上 */
    animation: fadeIn 0.3s ease-out;
}

.chart-zoom-content {
    background: white;
    border-radius: 12px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
    max-width: 95%;
    max-height: 95%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.chart-zoom-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid #f0f0f0;
    background: #fafafa;
}

.chart-zoom-header h2 {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: #333;
}

.chart-zoom-close {
    background: none;
    border: none;
    font-size: 24px;
    color: #999;
    cursor: pointer;
    padding: 4px;
    border-radius: 4px;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
}

.chart-zoom-close:hover {
    background-color: #f5f5f5;
    color: #666;
}

.chart-zoom-body {
    padding: 24px;
    flex: 1;
    min-height: 600px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.chart-zoom-body canvas {
    max-width: 100%;
    max-height: 100%;
    background: white;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* 价格变更日志「每日调价曲线」：与价格走势图放大窗同壳，图表区加宽大、折线细且无描点 */
.log-price-daily-chart-zoom-body {
    min-height: min(640px, 72vh);
    width: 100%;
    box-sizing: border-box;
    align-items: stretch !important;
    justify-content: stretch !important;
}

.log-price-daily-chart-canvas-wrap {
    position: relative;
    width: 100%;
    min-width: min(1180px, 94vw);
    min-height: 560px;
    height: min(620px, 68vh);
    flex: 1;
}

.log-price-daily-chart-sub {
    margin: 6px 0 0;
    font-size: 12px;
    color: #888;
    font-weight: normal;
}

.log-price-daily-chart-panel .chart-zoom-header h2 {
    margin: 0;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .chart-zoom-content {
        max-width: 98%;
        max-height: 98%;
    }
    
    .chart-zoom-header {
        padding: 16px 20px;
    }
    
    .chart-zoom-header h2 {
        font-size: 16px;
    }
    
    .chart-zoom-body {
        padding: 16px;
        min-height: 400px;
    }
}

/* 数量列的颜色样式 */
.count-high {
    color: #ff4d4f !important;  /* 红色 - 数量大于80 */
    font-weight: bold;
}

.count-medium {
    color: #1890ff !important;  /* 蓝色 - 数量�?0-80之间 */
}

.count-low {
    color: #52c41a !important;  /* 绿色 - 数量小于30且大�? */
}

/* 数量�?时持默认颜色 */

/* 胶颜色样�?*/
.item-info {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 6px;
    border-radius: 4px;
    border: 1px solid #e2e8f0;
}

.item-info.up-high {
    background-color: #fef2f2 !important;  /* 非常浅的红色背景 */
    border-color: #fee2e2 !important;
}

.item-info.up-low {
    background-color: #fff5f5 !important;  /* 更浅的红色背�?*/
    border-color: #fef2f2 !important;
}

.item-info.down-high {
    background-color: #f0fdf4 !important;  /* 非常浅的绿色背景 */
    border-color: #dcfce7 !important;
}

.item-info.down-low {
    background-color: #f7fee7 !important;  /* 更浅的绿色背�?*/
    border-color: #f0fdf4 !important;
}

.item-info.neutral {
    background-color: #f8fafc !important;  /* 浅灰色背�?*/
    border-color: #f1f5f9 !important;
}

/* 确保涨跌幅文本颜�?*/
.item-info span.price-up {
    color: #f5222d !important;
}

.item-info span.price-down {
    color: #52c41a !important;
}

/* 主数据区：道具 / 账号 Tab 切换 */
.main-data-workspace {
    margin: 12px 0 20px;
}

.main-data-tabs-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 10px;
    margin-bottom: 10px;
}

.main-data-tabs-row > .main-actions-wrap {
    flex: 1 1 auto;
    justify-content: flex-start;
}

.main-data-tabs {
    display: inline-flex;
    gap: 0;
    margin-bottom: 0;
    padding: 3px;
    background: rgba(26, 43, 52, 0.06);
    border-radius: 10px;
    border: 1px solid rgba(26, 43, 52, 0.1);
}

/* 用户管理 / 会员信息 / 退出（现位于统计栏第一行右侧） */
.main-session-controls {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    min-width: 0;
}

.main-session-controls .session-user-admin-btn {
    appearance: none;
    border: 1px solid rgba(42, 111, 151, 0.35);
    background: #f0f7fb;
    color: #1f5575;
    font-size: 12px;
    font-weight: 600;
    padding: 6px 12px;
    border-radius: 999px;
    cursor: pointer;
    white-space: nowrap;
    line-height: 1.2;
}

.main-session-controls .session-user-admin-btn:hover {
    background: #e4f0f8;
    border-color: rgba(42, 111, 151, 0.55);
}

.main-session-controls .session-user-bar {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding-left: 10px;
    border-left: 1px solid rgba(26, 43, 52, 0.16);
    min-width: 0;
}

.main-session-controls .session-invite-btn {
    appearance: none;
    border: 1px solid rgba(42, 111, 151, 0.35);
    background: #f0f7fb;
    color: #1f5575;
    font-size: 12px;
    font-weight: 600;
    padding: 6px 12px;
    border-radius: 999px;
    cursor: pointer;
    white-space: nowrap;
    line-height: 1.2;
}

.main-session-controls .session-invite-btn:hover {
    background: #e4f0f8;
    border-color: rgba(42, 111, 151, 0.55);
}

/* 会员身份徽章：克制金属边，少动效 */
.session-member-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex: 0 0 auto;
    height: 24px;
    padding: 0 8px 0 6px;
    border-radius: 6px;
    border: 1px solid rgba(120, 130, 140, 0.55);
    background: #f4f6f8;
    color: #3a4650;
    font-size: 11px;
    font-weight: 650;
    letter-spacing: 0.02em;
    line-height: 1;
    white-space: nowrap;
    user-select: none;
    box-sizing: border-box;
}

.session-member-badge-icon {
    width: 12px;
    height: 12px;
    flex: 0 0 auto;
    background-color: currentColor;
    opacity: 0.9;
    /* 默认星点（会员） */
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M8 1.6l1.7 3.5 3.9.6-2.8 2.7.7 3.9L8 10.4l-3.5 1.9.7-3.9L2.4 5.7l3.9-.6L8 1.6z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M8 1.6l1.7 3.5 3.9.6-2.8 2.7.7 3.9L8 10.4l-3.5 1.9.7-3.9L2.4 5.7l3.9-.6L8 1.6z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.session-member-badge[data-tier="admin"] {
    position: relative;
    overflow: hidden;
    color: #2a2108;
    background: linear-gradient(135deg, #f8e7a0 0%, #e4c35a 40%, #c9a227 70%, #a67c00 100%);
    border-color: rgba(212, 175, 55, 0.9);
    box-shadow: 0 0 10px rgba(212, 175, 55, 0.4);
}

.session-member-badge[data-tier="admin"] .session-member-badge-icon {
    /* 盾牌 */
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M8 1.2l5.2 1.6v4.2c0 3.4-2.1 5.9-5.2 7.2C4.9 12.9 2.8 10.4 2.8 7V2.8L8 1.2z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M8 1.2l5.2 1.6v4.2c0 3.4-2.1 5.9-5.2 7.2C4.9 12.9 2.8 10.4 2.8 7V2.8L8 1.2z'/%3E%3C/svg%3E") center / contain no-repeat;
    background: #2a2108;
}

.session-member-badge[data-tier="admin"]::after {
    content: '';
    position: absolute;
    top: 0;
    left: -40%;
    width: 36%;
    height: 100%;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.55), transparent);
    transform: skewX(-18deg);
    animation: uaBadgeShimmer 3s ease-in-out infinite;
    pointer-events: none;
}

.session-member-badge[data-tier="member"],
.session-member-badge[data-tier="normal"] {
    color: #3d5a6c;
    background: #eef3f6;
    border-color: rgba(130, 150, 165, 0.7);
}

.session-member-badge[data-tier="diamond"] {
    color: #4a3db8;
    background: #f0eefc;
    border-color: rgba(91, 79, 207, 0.55);
}

.session-member-badge[data-tier="super"] {
    position: relative;
    overflow: hidden;
    color: #fff8e8;
    background: linear-gradient(135deg, #6d0f18 0%, #c62828 45%, #e53935 70%, #8e1b1b 100%);
    border-color: rgba(255, 213, 79, 0.5);
    box-shadow: 0 0 12px rgba(229, 57, 53, 0.35), 0 0 16px rgba(255, 193, 7, 0.2);
}

.session-member-badge[data-tier="super"]::after {
    content: '';
    position: absolute;
    top: 0;
    left: -40%;
    width: 36%;
    height: 100%;
    background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.5), transparent);
    transform: skewX(-18deg);
    animation: uaBadgeShimmer 2.8s ease-in-out infinite;
    pointer-events: none;
}

.session-member-badge[data-tier="trial"] {
    color: #6a737b;
    background: #f7f8f9;
    border-style: dashed;
    border-color: rgba(120, 128, 136, 0.55);
    font-weight: 600;
}

.session-member-badge[data-tier="trial"] .session-member-badge-icon {
    /* 时钟 */
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M8 1.5A6.5 6.5 0 1 0 14.5 8 6.51 6.51 0 0 0 8 1.5zm.6 3.2h-1.2v4.1l3.4 2.05.6-1.02-2.8-1.68V4.7z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M8 1.5A6.5 6.5 0 1 0 14.5 8 6.51 6.51 0 0 0 8 1.5zm.6 3.2h-1.2v4.1l3.4 2.05.6-1.02-2.8-1.68V4.7z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.session-member-badge.is-urgent {
    color: #a33b2b;
    border-color: rgba(180, 60, 40, 0.65);
    border-style: solid;
    background: #fff7f5;
}

.session-member-badge.is-clickable {
    cursor: pointer;
}

.session-member-badge.is-clickable:hover {
    filter: brightness(0.97);
}

#mainContent .main-session-controls .session-user-label {
    max-width: min(280px, 36vw);
    font-size: 12px;
}

.main-data-tab {
    appearance: none;
    border: none;
    background: transparent;
    color: #5a6b75;
    font-size: 13px;
    font-weight: 600;
    padding: 8px 18px;
    border-radius: 8px;
    cursor: pointer;
    line-height: 1.2;
    transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.main-data-tab:hover {
    color: #1a2b34;
    background: rgba(255, 255, 255, 0.55);
}

.main-data-tab.is-active {
    color: #fff;
    background: linear-gradient(135deg, #2a6f97 0%, #1f5575 100%);
    box-shadow: 0 2px 8px rgba(31, 85, 117, 0.28);
}

.main-data-tab.is-disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.main-data-panels {
    min-height: 120px;
}

.main-data-panel {
    display: none;
}

.main-data-panel.is-active {
    display: block;
}

.main-data-panel .item-stats-container,
.main-data-panel .account-cards-container {
    margin-top: 0;
}

/* 物品统计卡片样式 */
.item-stats-container {
    margin: 20px 0;
    padding: 15px;
    background: transparent;
    border-radius: 8px;
    box-shadow: none;
}

/* 盈亏分类样式 */
.profit-categories {
    display: flex;
    flex-direction: column;
    font-size: 11px;
    line-height: 1.5; /* 保持行高 */
    min-width: 135px; /* 重新调整整体宽度 */
    padding: 2px 0; /* 保持垂直内边�?*/
}

/* 优化每个分类项的布局 */
.profit-category {
    margin: 2px 0; /* 保持垂直间距 */
    white-space: nowrap; /* 防止文本换行 */
    display: block; /* 改为块级元素 */
}


/* 设置不同类型的颜色样�?*/
.profit-category.significant-up2 {
    color: #7c0404; /* 更深的红色表示显著盈�?*/
    font-weight: bold;
}

/* 设置不同类型的颜色样�?*/
.profit-category.significant-up {
    color: #FF3333; /* 更深的红色表示显著盈�?*/
    font-weight: bold;
}

.profit-category.up {
    color: #f56c6c; /* 红色表示盈利 */
}

.profit-category.slight-loss {
    color: #fa8c16; /* 橙色表示轻微亏损 */
}

.profit-category.down {
    color: #67c23a; /* 绿色表示亏损 */
}

.profit-category.significant-down {
    color: #006600; /* 更深的绿色表示显著亏�?*/
    font-weight: bold;
}

/* 特别针对盈亏分类的summary-item调整宽度 */
.summary-item:nth-child(3) {
    min-width: 135px; /* 与profit-categories保持一�?*/
    width: auto; /* 允许自动调整宽度 */
    flex-shrink: 0; /* 防止被挤�?*/
}

/* 让所有summary-item都可以横向排列，避免拥挤 */
.item-details-header {
    display: flex;
    flex-wrap: nowrap; /* 强制单行，避免换行 */
    justify-content: flex-start;
    align-items: flex-start;
    gap: 4px;
    margin-bottom: 2px;
    padding: 2px 0;
    overflow-x: auto; /* 万一超宽时允许横向滚动而不是换行 */
}


.price-significant-up2 {
    color: #550505; /* 更深的红色表示显著盈�?*/
    font-weight: bold;
}

/* 添加新的样式类用于显著盈利和显著亏损 */
.price-significant-up {
    color: #FF3333; /* 更深的红色表示显著盈�?*/
    font-weight: bold;
}



.price-significant-down {
    color: #006600; /* 更深的绿色表示显著亏�?*/
    font-weight: bold;
}

/* 调整summary-item的宽度适应更多内容 */
.summary-item {
    margin-bottom: 0px;
    display: flex;
    flex-direction: column;
    min-width: 100px; /* 设置最小宽�?*/
    padding: 2px 4px; /* 最小化内边距 */
}

.item-stats-grid {
    display: grid;
    /* auto-fill + minmax：少卡时不拉满整行；多卡时列可略伸展吃掉右侧留白 */
    grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
    justify-content: stretch;
    gap: 8px;
    margin-top: 10px;
}

.item-stat-card {
    background-color: #fff;
    border: 1px solid #c8ced8;
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06), 0 2px 8px rgba(15, 23, 42, 0.04);
    padding: 9px 9px 8px;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    min-width: 0;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    position: relative; /* 允许放置背景图标伪元素 */
    overflow: hidden;
    font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
}

/* 卡片四角祥云：轻装饰，不挡字、不抢涨跌色 */
.item-card-ornaments {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
    border-radius: inherit;
}

.item-card-ornament {
    position: absolute;
    width: 52px;
    height: 52px;
    background: url('../assets/brand/xiangyun.jpg') center / contain no-repeat;
    opacity: 0.4;
    mix-blend-mode: multiply;
}

.item-card-ornament-br {
    right: -10px;
    bottom: -12px;
}

.item-card-ornament-bl {
    left: -10px;
    bottom: -12px;
    transform: scaleX(-1);
}

.item-card-ornament-tr {
    right: -10px;
    top: -12px;
    transform: scaleY(-1);
}

.item-card-ornament-tl {
    left: -10px;
    top: -12px;
    transform: scale(-1);
}

/* 刷新后数值变化：卡片描边 + 数字底色闪一下 */
.item-stat-card.card-flash-up {
    animation: item-card-flash-up 0.85s ease-out;
}
.item-stat-card.card-flash-down {
    animation: item-card-flash-down 0.85s ease-out;
}
@keyframes item-card-flash-up {
    0% {
        border-color: #22c55e;
        box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.45), 0 2px 8px rgba(15, 23, 42, 0.06);
    }
    100% {
        box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06), 0 2px 8px rgba(15, 23, 42, 0.04);
    }
}
@keyframes item-card-flash-down {
    0% {
        border-color: #ef4444;
        box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.4), 0 2px 8px rgba(15, 23, 42, 0.06);
    }
    100% {
        box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06), 0 2px 8px rgba(15, 23, 42, 0.04);
    }
}

.stat-num.stat-flash-up,
#totalValue .value-amount.stat-flash-up,
#profitRate.stat-flash-up {
    animation: stat-num-flash-up 0.9s ease-out;
}
.stat-num.stat-flash-down,
#totalValue .value-amount.stat-flash-down,
#profitRate.stat-flash-down {
    animation: stat-num-flash-down 0.9s ease-out;
}
@keyframes stat-num-flash-up {
    0% { color: #1e7e34; background-color: rgba(40, 167, 69, 0.45); border-radius: 3px; }
    100% { background-color: transparent; }
}
@keyframes stat-num-flash-down {
    0% { color: #c82333; background-color: rgba(220, 53, 69, 0.4); border-radius: 3px; }
    100% { background-color: transparent; }
}

@media (prefers-reduced-motion: reduce) {
    .item-stat-card.card-flash-up,
    .item-stat-card.card-flash-down,
    .stat-num.stat-flash-up,
    .stat-num.stat-flash-down,
    #totalValue .value-amount.stat-flash-up,
    #totalValue .value-amount.stat-flash-down,
    #profitRate.stat-flash-up,
    #profitRate.stat-flash-down {
        animation: none !important;
    }
}

.item-stat-card:hover {
    transform: translateY(-2px);
    border-color: #9aa3b2;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12);
    cursor: pointer;
}

/* 持有 / 盈亏：左边强调条；刷光仅给今日涨跌幅极值卡 */
.item-stat-card.owned-item {
    border-left: 3px solid #94a3b8;
}

.item-stat-card.today-loss {
    border-left: 3px solid #22c55e;
}

.item-stat-card.today-profit {
    border-left: 3px solid #ef4444;
}

.item-stat-card.today-peak-up,
.item-stat-card.today-peak-down {
    isolation: isolate;
}

.item-stat-card.today-peak-down {
    border-left: 3px solid #16a34a;
    border-color: rgba(34, 197, 94, 0.55);
    box-shadow:
        0 0 0 1px rgba(34, 197, 94, 0.28),
        0 0 14px rgba(34, 197, 94, 0.38),
        0 0 28px rgba(34, 197, 94, 0.18),
        0 2px 8px rgba(15, 23, 42, 0.06);
    animation: itemCardGlowLoss 2s ease-in-out infinite;
}

.item-stat-card.today-peak-up {
    border-left: 3px solid #dc2626;
    border-color: rgba(239, 68, 68, 0.55);
    box-shadow:
        0 0 0 1px rgba(239, 68, 68, 0.3),
        0 0 14px rgba(239, 68, 68, 0.4),
        0 0 28px rgba(239, 68, 68, 0.2),
        0 2px 8px rgba(15, 23, 42, 0.06);
    animation: itemCardGlowProfit 2s ease-in-out infinite;
}

.item-stat-card.today-peak-up::before,
.item-stat-card.today-peak-down::before {
    display: block !important;
    content: '';
    position: absolute;
    top: -10%;
    left: -55%;
    width: 42%;
    height: 120%;
    z-index: 5;
    pointer-events: none;
    transform: skewX(-22deg);
    border-radius: 4px;
    animation: itemCardShimmer 1.8s ease-in-out infinite;
}

.item-stat-card.today-peak-up::before {
    background: linear-gradient(
        100deg,
        transparent 0%,
        rgba(255, 255, 255, 0.05) 28%,
        rgba(255, 220, 220, 0.55) 45%,
        rgba(255, 255, 255, 0.85) 50%,
        rgba(255, 180, 180, 0.5) 55%,
        rgba(255, 255, 255, 0.08) 72%,
        transparent 100%
    );
    box-shadow: 0 0 18px rgba(255, 120, 120, 0.45);
}

.item-stat-card.today-peak-down::before {
    background: linear-gradient(
        100deg,
        transparent 0%,
        rgba(255, 255, 255, 0.05) 28%,
        rgba(200, 255, 220, 0.5) 45%,
        rgba(255, 255, 255, 0.85) 50%,
        rgba(160, 255, 190, 0.45) 55%,
        rgba(255, 255, 255, 0.08) 72%,
        transparent 100%
    );
    box-shadow: 0 0 18px rgba(80, 220, 140, 0.4);
}

.item-stat-card.today-peak-up::after,
.item-stat-card.today-peak-down::after {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    z-index: 0;
    pointer-events: none;
    opacity: 0.75;
}

.item-stat-card.today-peak-up::after {
    background:
        radial-gradient(ellipse 70% 55% at 15% 0%, rgba(255, 120, 120, 0.35), transparent 55%),
        radial-gradient(ellipse 55% 45% at 90% 100%, rgba(255, 80, 80, 0.22), transparent 60%);
    animation: itemCardAuraPulse 2.2s ease-in-out infinite;
}

.item-stat-card.today-peak-down::after {
    background:
        radial-gradient(ellipse 70% 55% at 15% 0%, rgba(80, 220, 140, 0.32), transparent 55%),
        radial-gradient(ellipse 55% 45% at 90% 100%, rgba(34, 197, 94, 0.2), transparent 60%);
    animation: itemCardAuraPulse 2.2s ease-in-out infinite;
}

.item-stat-card.today-peak-up.has-vip-unlock-hint[data-vip-unlock]::after,
.item-stat-card.today-peak-down.has-vip-unlock-hint[data-vip-unlock]::after {
    inset: auto;
    animation: none;
    opacity: 1;
    background: #f57c00;
    box-shadow: none;
}

.item-stat-card.today-peak-up > *:not(.item-card-ornaments),
.item-stat-card.today-peak-down > *:not(.item-card-ornaments) {
    position: relative;
    z-index: 1;
}

@keyframes itemCardShimmer {
    0% { left: -55%; opacity: 0; }
    12% { opacity: 1; }
    55% { left: 115%; opacity: 0.95; }
    70%, 100% { left: 130%; opacity: 0; }
}

@keyframes itemCardGlowProfit {
    0%, 100% {
        box-shadow:
            0 0 0 1px rgba(239, 68, 68, 0.28),
            0 0 10px rgba(239, 68, 68, 0.28),
            0 0 20px rgba(239, 68, 68, 0.12),
            0 2px 8px rgba(15, 23, 42, 0.06);
    }
    50% {
        box-shadow:
            0 0 0 2px rgba(239, 68, 68, 0.5),
            0 0 18px rgba(239, 68, 68, 0.55),
            0 0 36px rgba(239, 68, 68, 0.28),
            0 4px 14px rgba(15, 23, 42, 0.1);
    }
}

@keyframes itemCardGlowLoss {
    0%, 100% {
        box-shadow:
            0 0 0 1px rgba(34, 197, 94, 0.28),
            0 0 10px rgba(34, 197, 94, 0.28),
            0 0 20px rgba(34, 197, 94, 0.12),
            0 2px 8px rgba(15, 23, 42, 0.06);
    }
    50% {
        box-shadow:
            0 0 0 2px rgba(34, 197, 94, 0.5),
            0 0 18px rgba(34, 197, 94, 0.5),
            0 0 36px rgba(34, 197, 94, 0.26),
            0 4px 14px rgba(15, 23, 42, 0.1);
    }
}

@keyframes itemCardAuraPulse {
    0%, 100% { opacity: 0.45; }
    50% { opacity: 0.9; }
}

@media (prefers-reduced-motion: reduce) {
    .item-stat-card.today-peak-up,
    .item-stat-card.today-peak-down,
    .item-stat-card.today-peak-up::before,
    .item-stat-card.today-peak-down::before,
    .item-stat-card.today-peak-up::after,
    .item-stat-card.today-peak-down::after {
        animation: none !important;
    }
}

/* 市场物品卡片样式（管理员：未持有） */
.item-stat-card.market-item {
    background-color: #f4f5f7;
    border-style: dashed;
    border-color: #b8c0cc;
}

.item-stat-card.market-item:hover {
    border-style: solid;
}

/* 普通会员行情卡：低饱和灰青底，避免刺眼 */
.item-stat-card.viewer-item {
    background: #f3f5f4;
    border-style: solid;
    border-color: #c5cdc9;
    border-left: 3px solid #6b8f86;
    opacity: 1;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 2px 6px rgba(15, 23, 42, 0.03);
}

.item-stat-card.viewer-item:hover {
    background: #eef2f0;
    border-color: #a8b5b0;
    box-shadow: 0 3px 10px rgba(15, 23, 42, 0.08);
}

.item-stat-card.viewer-item .item-stat-details {
    background: rgba(255, 255, 255, 0.78);
    border-color: #d5ddd9;
}

.item-stat-card.viewer-item .item-stat-header {
    border-bottom-color: #d0d8d4;
}

/* 收藏道具：浅金色底，区别于白底 / 灰底行情卡 */
.item-stat-card.is-favorited {
    background-color: #f6edd4 !important;
    background-image: linear-gradient(165deg, #fbf6e6 0%, #f3e4bc 62%, #ead9a8 100%);
    border-style: solid;
    border-color: #d4b56a;
    box-shadow: 0 1px 2px rgba(180, 140, 40, 0.08), 0 2px 8px rgba(180, 140, 40, 0.07);
}

.item-stat-card.is-favorited:hover {
    background-color: #f3e6c4 !important;
    border-color: #c9a227;
    box-shadow: 0 4px 12px rgba(180, 140, 40, 0.16);
}

.item-stat-card.is-favorited:not(.today-profit):not(.today-loss) {
    border-left: 3px solid #c9a227;
}

.item-stat-card.is-favorited .item-stat-details {
    background: rgba(255, 252, 242, 0.72);
    border-color: #e6d5a8;
}

/* 技能图标背景（置于卡片中央、半透明，不影响文字交互） */
/* 取消卡片的大背景图标显示 */
.item-stat-card::before { display: none; }
.item-stat-card .item-icon-bg { display: none; }

/* 道具名称前的小图标 + 按最低价分档的横向底色（无衬线体，减弱塑料感） */
.item-stat-name {
    display: flex;
    align-items: center;
    gap: 5px;
    width: 100%;
    box-sizing: border-box;
    font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
    font-weight: 600;
    font-size: 15px;
    letter-spacing: 0.01em;
    line-height: 1.2;
    color: #1e293b;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    padding: 5px 8px;
    border-radius: 5px;
    border: 1px solid transparent;
    /* 勿用 transition:all，刷新重建时布局抖动会被放大成「名字左右闪」 */
    transition: background-color 0.2s ease, border-color 0.2s ease;
    -webkit-font-smoothing: antialiased;
}

.item-stat-name .item-icon {
    width: 17px;
    height: 17px;
    object-fit: contain;
    flex-shrink: 0;
    filter: none; /* 不再使用透明度 */
}

/* 文本可用宽度容器；内部用 scale 突破浏览器最小字号限制 */
.item-stat-name-scale {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    display: block;
    line-height: 1.25;
}

.item-stat-name-text {
    display: inline-block;
    white-space: nowrap;
    transform-origin: left center;
    font-family: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    max-width: none;
}

.item-stat-name.is-name-tight {
    letter-spacing: 0;
    gap: 3px;
}

/* 最低价 <100 蓝 / 100-500 红 / >500 紫（柔和底，避免刺眼） */
.item-stat-name.name-price-tier-blue {
    background: linear-gradient(90deg, #dbeafe 0%, #eff6ff 55%, #f8fafc 100%);
    border-color: #93c5fd;
    color: #1e3a5f;
}
.item-stat-name.name-price-tier-red {
    background: linear-gradient(90deg, #fecaca 0%, #fee2e2 55%, #fafafa 100%);
    border-color: #f5a3a3;
    color: #7f1d1d;
}
.item-stat-name.name-price-tier-purple {
    background: linear-gradient(90deg, #e9d5ff 0%, #f3e8ff 55%, #fafafa 100%);
    border-color: #c4b5fd;
    color: #4c1d95;
}
.item-stat-name.name-price-tier-none {
    background: linear-gradient(90deg, #eef2f6 0%, #f8fafc 100%);
    border-color: #d5dde6;
    color: #475569;
}

.item-stat-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
    margin: 0 0 6px;
    border-bottom: 1px solid #d0d7e2;
    padding: 0 0 7px;
    min-width: 0;
    position: relative;
    z-index: 1;
}

.item-stat-header .item-stat-name {
    flex: 1 1 auto;
    width: auto !important;
    max-width: none;
    min-width: 0;
}

/* 道具卡片收藏星标 */
.item-fav-btn {
    appearance: none;
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(26, 43, 52, 0.12);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.88);
    color: #9aa7b2;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
    transition: color 0.15s ease, background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
    z-index: 2;
}

.item-fav-btn:hover {
    color: #e6a23c;
    border-color: rgba(230, 162, 60, 0.45);
    background: #fffaf0;
}

.item-fav-btn.is-favorited {
    color: #e6a23c;
    border-color: rgba(230, 162, 60, 0.55);
    background: #fff7e6;
}

.item-fav-btn.is-favorited:hover {
    color: #d48806;
}

.item-fav-btn.is-toggling {
    opacity: 0.7;
    pointer-events: none;
}

.item-fav-icon {
    width: 18px;
    height: 18px;
    display: block;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M8 1.6l1.7 3.5 3.9.6-2.8 2.7.7 3.9L8 10.4l-3.5 1.9.7-3.9L2.4 5.7l3.9-.6L8 1.6z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M8 1.6l1.7 3.5 3.9.6-2.8 2.7.7 3.9L8 10.4l-3.5 1.9.7-3.9L2.4 5.7l3.9-.6L8 1.6z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.item-fav-btn.is-favorited .item-fav-icon {
    /* 实心星 */
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M8 1.2l2.05 4.15 4.58.67-3.31 3.23.78 4.55L8 11.65l-4.1 2.15.78-4.55L1.37 6.02l4.58-.67L8 1.2z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='black' d='M8 1.2l2.05 4.15 4.58.67-3.31 3.23.78 4.55L8 11.65l-4.1 2.15.78-4.55L1.37 6.02l4.58-.67L8 1.2z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.item-stat-name:hover {
    box-shadow: 0 2px 8px rgba(0,0,0,0.12);
    z-index: 10;
}

.item-stat-count {
    font-size: 13px;
    color: #666;
    background: #f5f5f5;
    padding: 2px 6px;
    border-radius: 4px;
    white-space: nowrap;
}

.item-stat-count-inline {
    font-size: 12px;
    color: #666;
    background: #f5f5f5;
    padding: 1px 5px;
    border-radius: 4px;
    margin-left: 6px;
    white-space: nowrap;
    font-weight: normal;
}

.item-stat-details {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.55);
    overflow: hidden;
    position: relative;
    z-index: 1;
}

.item-stat-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
    font-size: 13px;
    min-height: 25px;
    padding: 4px 7px;
    line-height: 1.2;
    border-bottom: 1px solid #e8edf4;
    -webkit-font-smoothing: antialiased;
}

.item-stat-row:nth-child(odd) {
    background: rgba(248, 250, 252, 0.85);
}

.item-stat-row:last-child {
    border-bottom: none;
}

/* 无库存只剩三行：加高行距和内边距，避免卡片显得过扁 */
.item-stat-card--compact {
    padding: 11px 9px 10px;
}

.item-stat-card--compact .item-stat-header {
    margin-bottom: 8px;
    padding-bottom: 9px;
}

.item-stat-card--compact .item-stat-row {
    min-height: 32px;
    padding-top: 7px;
    padding-bottom: 7px;
}

.stat-label {
    color: #64748b;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    min-width: 2.5em;
}

.stat-value {
    font-weight: 600;
    font-size: 13px;
    color: #1e293b;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
}

.item-stat-card .stat-num {
    font-weight: 700;
    font-size: 13px;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum" 1;
    letter-spacing: 0.01em;
}

.item-stat-card .item-stat-count-inline {
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0;
}

/* 价格范围样式 */
.stat-value.price-range {
    color: #007bff;
    font-size: 13px;
    background: #e3f2fd;
    padding: 2px 6px;
    border-radius: 3px;
    border: 1px solid #bbdefb;
}

/* 价格稳定 - 绿色 (差异 < 100%) */
.stat-value.price-range-low {
    color: #28a745;
    font-size: 13px;
    background: #d4edda;
    padding: 2px 6px;
    border-radius: 3px;
    border: 1px solid #c3e6cb;
}

/* 价格中等波动 - 蓝色 (差异 100%-150%) */
.stat-value.price-range-medium {
    color: #007bff;
    font-size: 13px;
    background: #e3f2fd;
    padding: 2px 6px;
    border-radius: 3px;
    border: 1px solid #bbdefb;
}

/* 价格高波动 - 红色 (差异 150%-200%) */
.stat-value.price-range-high {
    color: #dc3545;
    font-size: 13px;
    background: #f8d7da;
    padding: 2px 6px;
    border-radius: 3px;
    border: 1px solid #f5c6cb;
}

/* 价格极端波动 - 深红色 (差异 > 200%) */
.stat-value.price-range-extreme {
    color: #721c24;
    font-size: 13px;
    background: #f5c6cb;
    padding: 2px 6px;
    border-radius: 3px;
    border: 1px solid #dc3545;
}

/* 销量数据样式 */
.stat-value.sales-data {
    color: #17a2b8;
    font-size: 13px;
    background: #d1ecf1;
    padding: 2px 6px;
    border-radius: 3px;
    border: 1px solid #bee5eb;
    white-space: nowrap;
}

/* 库存数据样式 */
.stat-value.stock-data {
    color: #6f42c1;
    font-size: 13px;
    background: #e2d9f3;
    padding: 2px 6px;
    border-radius: 3px;
    border: 1px solid #d1b3ff;
    white-space: nowrap;
}

/* 最低收购价格：醒目徽章，管理员可点改 */
.min-buy-price {
    display: inline-flex;
    align-items: center;
    gap: 1px;
    margin-left: 6px;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: 0.02em;
    color: #9a3412;
    background: #ffedd5;
    border: 1px solid #f97316;
    vertical-align: middle;
    white-space: nowrap;
}
.min-buy-price.is-editable {
    cursor: pointer;
    user-select: none;
    transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.min-buy-price.is-editable:hover {
    background: #fed7aa;
    border-color: #ea580c;
    box-shadow: 0 0 0 2px rgba(249, 115, 22, 0.25);
}
.min-buy-price.is-editing {
    padding: 0 4px;
    background: #fff7ed;
    box-shadow: 0 0 0 2px rgba(249, 115, 22, 0.35);
}
.min-buy-price.is-saving {
    opacity: 0.65;
    pointer-events: none;
}
.min-buy-price-input {
    width: 3.2em;
    min-width: 2.5em;
    max-width: 5em;
    margin: 0;
    padding: 1px 2px;
    border: none;
    outline: none;
    background: transparent;
    color: #9a3412;
    font: inherit;
    font-weight: 700;
    text-align: center;
}
.min-buy-price-input::-webkit-outer-spin-button,
.min-buy-price-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.min-buy-price-input[type='number'] {
    -moz-appearance: textfield;
    appearance: textfield;
}

/* 强制所有统计行单行显示，不省略内容 */
.item-stat-row {
    white-space: nowrap;
    flex-wrap: nowrap;
}

.item-stat-row .stat-label {
    white-space: nowrap;
    flex-shrink: 0;
}

.item-stat-row .stat-value {
    white-space: nowrap;
    flex-shrink: 0;
}

/* 变化指示器样式 */
.change-indicator {
    font-size: 10px;
    margin-left: 4px;
    font-weight: bold;
}

.change-indicator.change-up {
    color: #28a745;
}

.change-indicator.change-down {
    color: #dc3545;
}

/* 商人次数标签 */
.merchant-count-tag {
    font-size: 10px;
    margin-left: 4px;
    color: #722ed1;
    font-weight: bold;
}

/* 物品统计卡片控制面板 */
.item-stats-controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.stats-filters {
    display: flex;
    align-items: center;
    gap: 15px;
    flex: 1;
    min-width: 0;
    flex-wrap: wrap;
}

.stats-sort-select {
    padding: 6px 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    background: #fff;
    color: #333;
    font-size: 14px;
}

.filter-buttons {
    display: flex;
    gap: 5px;
}

.filter-btn {
    padding: 4px 10px;
    border: 1px solid #ddd;
    background: #f5f5f5;
    border-radius: 4px;
    font-size: 12px;
    cursor: pointer;
    color: #555;
}

.filter-btn.active {
    background: #4a90e2;
    color: white;
    border-color: #4a90e2;
}

.category-buttons {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 5px;
    flex: 1;
    min-width: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.category-btn {
    padding: 4px 10px;
    border: 1px solid #ddd;
    background: #fff;
    border-radius: 4px;
    font-size: 12px;
    cursor: pointer;
    color: #555;
    white-space: nowrap;
}

.category-btn:hover {
    border-color: #4a90e2;
    color: #4a90e2;
}

.category-btn.active {
    background: #4a90e2;
    color: white;
    border-color: #4a90e2;
}

.stats-info {
    font-size: 13px;
    color: #666;
}

/* 道具统计区：按服务器状态分组的胶囊列表（与"共X种物品"同行，超出自动换行） */
.stats-info-wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    max-width: 100%;
}

.stats-info-wrapper .stats-info-text {
    white-space: nowrap;
}

.stats-info-server-type {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
}

.stats-info-server-type .stats-server-capsule {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 12px;
    line-height: 1.4;
    white-space: nowrap;
}

.stats-info-server-type .stats-server-capsule .status-num {
    font-weight: 600;
}

@media (max-width: 768px) {
    .item-stats-grid {
        grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
        justify-content: stretch;
        gap: 6px;
    }
    
    .item-stat-card {
        padding: 8px;
        max-width: none;
    }
    
    .item-stat-name {
        font-size: 14px;
    }
    
    .item-stats-controls {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .stats-filters {
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
    }
    
    .stats-info {
        width: 100%;
        text-align: left;
    }
}

/* 交易列表样式，移除内部滚动条 */
.trades-list {
    max-height: none; /* 移除高度限制 */
    overflow-y: visible; /* 移除滚动�?*/
    border: 1px solid #eaeaea;
    border-radius: 6px;
    background: #f9f9f9;
}

/* 账号卡片容器样式 */
.account-cards-container {
    margin: 20px 0;
    padding: 15px;
    background: transparent;
    border-radius: 8px;
    box-shadow: none;
}

.accounts-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.accounts-header h3 {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin: 0;
}

.account-filters {
    display: flex;
    gap: 5px;
}

/* 账号数据表格容器：视觉对齐详情弹窗 .edit-dialog.item-detail-dialog 里 .server-table-container 的暖色玻璃质感
   （米白半透明底 + 暖调描边），区别是不设 max-height/滚动——账号列表不在弹窗里，交给页面自然滚动 */
.account-table-container {
    margin-top: 8px;
    border: 1px solid var(--boot-line, rgba(26, 43, 52, 0.12));
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.55);
    box-shadow: none;
    overflow-x: auto;
}

/* 账号数据表格：视觉对齐详情弹窗 .server-table 的字体/字号/描边色/表头渐变底/斑马纹/行悬停 */
.account-table {
    width: 100%;
    table-layout: fixed; /* 固定列宽比例，把空间尽量让给道具明细，而不是被浏览器自动分配挤扁 */
    border-collapse: separate;
    border-spacing: 0;
    font-size: 12px;
    font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
    color: #5a6d76;
    -webkit-font-smoothing: antialiased;
}

/* 道具明细只按 6 个胶囊宽度留位，多出的空间按比例分给其余列，避免其他列被挤扁 */
.account-table th:nth-child(1), .account-table td:nth-child(1) { width: 12%; } /* 账号/角色 */
.account-table th:nth-child(2), .account-table td:nth-child(2) { width: 11%; } /* 原服务器 */
.account-table th:nth-child(3), .account-table td:nth-child(3) { width: 11%; } /* 目标服务器 */
.account-table th:nth-child(4), .account-table td:nth-child(4) { width: 7%; }  /* 满/不满 */
.account-table th:nth-child(5), .account-table td:nth-child(5) { width: 7%; }  /* 在售 */
.account-table th:nth-child(6), .account-table td:nth-child(6) { width: 9%; }  /* 锁状态 */
.account-table th:nth-child(7), .account-table td:nth-child(7) { width: 10%; } /* 转入时间 */
.account-table th:nth-child(8), .account-table td:nth-child(8) { width: 13%; } /* 总价值/总成本 */
.account-table th:nth-child(9), .account-table td:nth-child(9) { width: 12%; } /* 总盈亏 */
.account-table th:nth-child(10), .account-table td:nth-child(10) { width: 920px; max-width: 920px; } /* 道具明细：约 6 个加宽胶囊 */
.account-table th:nth-child(11), .account-table td:nth-child(11) { width: 8%; } /* 操作 */

.lock-status,
.time-info {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.account-table th,
.account-table td {
    padding: 4px 6px;
    line-height: 1.3;
    text-align: left;
    border: 1px solid rgba(26, 43, 52, 0.1);
    letter-spacing: 0.01em;
    vertical-align: middle;
}

.account-table th {
    background: linear-gradient(180deg, #f8f2e9 0%, #ebe2d4 100%);
    color: #5a6d76;
    font-weight: 600;
    white-space: nowrap;
}

/* 可排序表头：加个手型 + 悬停提示 + 排序方向小箭头 */
.account-table th[data-sort] {
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    position: relative;
    padding-right: 16px;
}

.account-table th[data-sort]:hover {
    background: linear-gradient(180deg, #f4ecdd 0%, #e6d8c4 100%);
}

.account-table th[data-sort]::after {
    content: '';
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
    border: 4px solid transparent;
    opacity: 0.35;
}

.account-table th[data-sort]:not(.sort-asc):not(.sort-desc)::after {
    border-top-color: #5a6d76;
    margin-top: 2px;
}

.account-table th[data-sort].sort-asc::after {
    border-bottom-color: #c62828;
    margin-top: -2px;
    opacity: 0.85;
}

.account-table th[data-sort].sort-desc::after {
    border-top-color: #c62828;
    margin-top: 2px;
    opacity: 0.85;
}

.account-table tbody tr:nth-child(odd) {
    background-color: rgba(255, 255, 255, 0.7);
}

.account-table tbody tr:nth-child(even) {
    background-color: rgba(255, 248, 240, 0.85);
}

.account-table tbody tr:hover {
    background-color: rgba(198, 40, 40, 0.06);
}

.account-table td[data-type="number"] {
    text-align: right;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
}

/* 无道具账号：浅灰底 + 文字降调，呼应详情表格里「回退昨日数据」行的处理方式 */
.account-card.no-items td {
    background-color: #f3f4f6;
    color: #94a3b8;
}

.account-card.no-items:hover td {
    background-color: #e7ecf1;
}

/* 账号类型样式调整 - 首列色条区分盈亏，替代原来卡片的 border-left（<tr> 上的 border-left 各浏览器表现不一致，改到首个单元格上） */
.account-card.profit td:first-child {
    border-left: 4px solid #f56c6c; /* 盈利显示红色 */
}

.account-card.loss td:first-child {
    border-left: 4px solid #67c23a; /* 亏损显示绿色 */
}

.account-name {
    font-weight: bold;
    font-size: 13px;
    color: var(--boot-ink, #1a2b34);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
}

/* 满/不满、在售 两列单独成列后居中显示胶囊 */
.account-cell-full,
.account-cell-onsell {
    text-align: center;
    white-space: nowrap;
}

/* 状态单元格样式 */
.status-cell {
    padding: 2px 6px;
    border-radius: 12px;
    font-size: 11px;
    color: #fff;
    font-weight: 500;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* 不同的状态胶囊颜�?*/
.status-cell.status-50 {
    background-color: #ff4d4f;
}

.status-cell.status-40 {
    background-color: #ff7a45;
}

.status-cell.status-30 {
    background-color: #ffa940;
}

.status-cell.status-20 {
    background-color: #ffc53d;
    color: #5c3c01;
}

.status-cell.status-10 {
    background-color: #bae637;
    color: #3f6600;
}

.status-cell.status-sell {
    background-color: #73d13d;
    color: #135200;
}

.status-cell.status-normal {
    background-color: #d9d9d9;
    color: #595959;
}

.status-cell.status-danger {
    background-color: #ff4d4f;
}

.status-cell.status-warning {
    background-color: #faad14;
}

.status-cell.status-safe {
    background-color: #52c41a;
}

.origin-server .status-cell, .target-server .status-cell {
    width: 100%;
    display: inline-block;
    text-align: center;
    padding: 4px 6px;
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    border-radius: 4px;
}

/* 用专属类名 .account-items-list，避免与悬浮详情摘要里同名的 .items-list（addStyles 注入的全局样式）冲突 */
.account-items-list {
    /* 故意不用 display:flex——直接设在 <td> 上会破坏 table-layout:fixed 的列宽分配。
       改用默认的 inline 流式布局：.card-item 本身是 inline-flex，靠单元格宽度自然换行，
       宽度够时多个道具标签会排在同一行，不够才整体换到下一行 */
    max-height: none; /* 移除最大高度限�?*/
    overflow-y: visible; /* 移除滚动�?*/
    font-size: 12px;
    line-height: 2; /* 换行后标签之间留出竖向间距 */
}

/* 物品列表表头 */
.items-header {
    display: flex;
    justify-content: space-between;
    padding: 2px 0 6px 0;
    font-size: 12px;
    color: #666;
    border-bottom: 1px solid #ddd;
    margin-bottom: 4px;
    font-weight: 500;
}

.header-name {
    flex: 2;
}

.header-count, .header-price, .header-change {
    flex: 1;
    text-align: right;
}

/* 物品单行紧凑小标签：图标（道具类型）+ 调价角标 + 数量 + 涨跌幅 + 现价，都在一行内，
   靠 .account-items-list 单元格的默认 inline 流自然换行，宽度够就横向平铺多个标签 */
.card-item {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin: 2px 4px 2px 0;
    padding: 3px 7px;
    border-radius: 10px;
    font-size: 12px;
    line-height: 1.4;
    border: 1px solid #ddd;
    background: white;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
    white-space: nowrap;
    vertical-align: middle;
    transition: box-shadow 0.15s ease;
}

.card-item:hover {
    box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

.card-item .item-icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
    flex-shrink: 0;
}

.card-item.no-item-placeholder {
    color: #94a3b8;
    font-style: normal;
}

.item-name {
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 120px; /* 限制名称最大宽度 */
}

/* 月度购买统计「道具汇总」：完整显示道具名，不被卡片 .item-name 的 120px 省略 */
.daily-stats-tip .item-name,
.items-summary-section .item-name {
    overflow: visible;
    text-overflow: clip;
    white-space: nowrap;
    max-width: none;
}

.item-quantity {
    font-weight: 700;
    color: #555;
    white-space: nowrap;
}

.item-cur-price {
    color: #64748b;
    font-weight: 700;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    white-space: nowrap;
}

/* 亏损状�?- 绿色背景 */
.card-item.loss {
    background-color: rgba(200, 255, 200, 0.7);  /* 更深的绿色背�?*/
    border: 1px solid rgba(0, 128, 0, 0.3);
}

/* 盈利状�?- 红色背景 */
.card-item.profit {
    background-color: rgba(255, 200, 200, 0.7);  /* 更深的红色背�?*/
    border: 1px solid rgba(178, 34, 34, 0.3);
}

/* 达到卖出阈�?- 紫色背景 */
.card-item.sell-threshold {
    background-color: rgba(230, 200, 255, 0.7);  /* 更深的紫色背�?*/
    border: 1px solid rgba(128, 0, 128, 0.3);
}

/* 总价值/总成本列：数字列样式对齐 .server-table td[data-type="number"] */
.account-name,
.account-money-cell,
.account-profit-cell {
    overflow: hidden;
    text-overflow: ellipsis;
}

.account-money-cell {
    font-weight: 700;
    white-space: nowrap;
}

.account-money-cell .cost-value {
    color: #64748b;
    font-weight: 700;
}

/* 总盈亏列：金额跟涨跌色，整格不换行 */
.account-profit-cell {
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.account-profit-cell .profit-rate {
    font-weight: 700;
    font-size: 11px;
    opacity: 0.85;
}

.account-table .price-up,
.account-table .price-down {
    font-weight: 700;
}

/* 物品调价类型角标：改为行内小圆标签，紧跟在图标后面，不再用旋转丝带（丝带在紧凑单行标签里放不下） */
.item-price-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: bold;
    padding: 0 4px;
    border-radius: 4px;
    line-height: 16px;
    flex-shrink: 0;
}

/* 继承状态胶囊的色值，确保角标使用相同的颜色系统，但不使用透明�?*/
.item-price-badge.status-50 {
    background-color: #ff4d4f;
    border: 1px solid #ff4d4f;
    color: #000000;
}

.item-price-badge.status-40 {
    background-color: #ff7a45;
    border: 1px solid #ff7a45;
    color: #000000;
}

.item-price-badge.status-30 {
    background-color: #ffa940;
    border: 1px solid #ffa940;
    color: #000000;
}

.item-price-badge.status-20 {
    background-color: #ffc53d;
    border: 1px solid #ffc53d;
    color: #000000;
}

.item-price-badge.status-10 {
    background-color: #bae637;
    border: 1px solid #bae637;
    color: #000000;
}

.item-price-badge.status-sell {
    background-color: #73d13d;
    border: 1px solid #73d13d;
    color: #000000;
}

.item-price-badge.status-danger {
    background-color: #ff4d4f;
    border: 1px solid #ff4d4f;
    color: #000000;
}

.item-price-badge.status-normal {
    background-color: #d9d9d9;
    border: 1px solid #d9d9d9;
    color: #000000;
}

/* 操作列的"修改"按钮：常驻显示，不再靠悬停淡入 */
.card-edit-btn {
    padding: 2px 8px;
    background-color: #1890ff;
    color: white;
    border: none;
    border-radius: 3px;
    font-size: 12px;
    cursor: pointer;
    white-space: nowrap;
}

.card-edit-btn:hover {
    background-color: #40a9ff;
}

/* 搜索框样�?*/
.account-search {
    display: flex;
    gap: 10px;
}

.account-search-input {
    padding: 5px 10px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    flex-grow: 1;
}

.account-search-input:focus {
    border-color: #1890ff;
    outline: none;
    box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
}

.account-search-btn {
    padding: 5px 12px;
    background-color: #1890ff;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.account-search-btn:hover {
    background-color: #40a9ff;
}

.account-search-clear-btn {
    padding: 5px 12px;
    background-color: #f5f5f5;
    color: #666;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    cursor: pointer;
}

.account-search-clear-btn:hover {
    background-color: #fafafa;
}

/* 账号操作按钮样式 */
.account-actions {
    display: flex;
    gap: 10px;
    align-items: center;
}

.add-account-btn {
    padding: 5px 12px;
    background-color: #1890ff;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: all 0.2s ease;
}

.add-account-btn:hover {
    background-color: #40a9ff;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(24, 144, 255, 0.3);
}

.add-account-btn .icon {
    font-size: 14px;
}

.account-table tbody tr.account-empty-row:hover,
.account-table tbody tr.account-empty-row:nth-child(even) {
    background: transparent;
}

.account-table tbody tr.account-empty-row td {
    border: none;
}

.account-empty-state {
    text-align: center;
    padding: 48px 16px;
    color: #666;
}

.account-empty-state p {
    margin: 0 0 8px;
    font-size: 15px;
}

.account-empty-hint {
    font-size: 13px !important;
    color: #8c8c8c;
    margin-bottom: 16px !important;
}

.batch-merge-btn {
    padding: 5px 12px;
    background-color: #52c41a;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 5px;
    transition: all 0.2s ease;
}

.batch-merge-btn:hover {
    background-color: #73d13d;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(82, 196, 26, 0.3);
}

.batch-merge-btn .icon {
    font-size: 14px;
}

.batch-merge-btn:active {
    transform: translateY(0);
    box-shadow: 0 1px 2px rgba(82, 196, 26, 0.3);
}

/* 批量合并结果弹窗样式 */
.batch-merge-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10000;
}

.batch-merge-content {
    background: white;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    max-width: 80%;
    max-height: 80%;
    width: 600px;
    display: flex;
    flex-direction: column;
}

.batch-merge-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 20px 0 20px;
    border-bottom: 1px solid #eee;
}

.batch-merge-header h3 {
    margin: 0;
    color: #333;
    font-size: 18px;
}

.close-btn {
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: #999;
    padding: 0;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.close-btn:hover {
    color: #333;
}

.batch-merge-body {
    padding: 20px;
    flex: 1;
    overflow-y: auto;
    max-height: 400px;
}

.batch-merge-body pre {
    margin: 0;
    white-space: pre-wrap;
    font-family: 'Courier New', monospace;
    font-size: 13px;
    line-height: 1.4;
    color: #333;
}

.batch-merge-footer {
    padding: 0 20px 20px 20px;
    display: flex;
    justify-content: flex-end;
}

.ok-btn {
    background: #52c41a;
    color: white;
    border: none;
    padding: 8px 16px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
}

.ok-btn:hover {
    background: #73d13d;
}

/* 合并进度弹窗样式 */
.merge-progress-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10001;
}

.merge-progress-content {
    background: white;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    width: 400px;
    padding: 0;
    display: flex;
    flex-direction: column;
}

.merge-progress-header {
    padding: 20px 20px 0 20px;
    border-bottom: 1px solid #eee;
}

.merge-progress-header h3 {
    margin: 0;
    color: #333;
    font-size: 18px;
    text-align: center;
}

.merge-progress-body {
    padding: 30px 20px;
    text-align: center;
}

.progress-spinner {
    width: 40px;
    height: 40px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #52c41a;
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin: 0 auto 20px auto;
}

.progress-text {
    font-size: 16px;
    color: #333;
    margin-bottom: 20px;
}

.progress-details {
    text-align: left;
    background: #f8f9fa;
    padding: 15px;
    border-radius: 6px;
    margin-top: 15px;
}

.progress-current {
    margin-bottom: 8px;
    font-size: 14px;
    color: #666;
}

.progress-count {
    font-size: 14px;
    color: #666;
}

.progress-current span,
.progress-count span {
    color: #52c41a;
    font-weight: bold;
}

/* 搜索功能相关样式 */
.search-hidden {
    display: none !important;
}

.search-highlight {
    background-color: #fffb8f;
    padding: 0 2px;
    border-radius: 2px;
    font-weight: bold;
}

/* 视图切换按钮 */
.view-toggle-buttons {
    display: flex;
    gap: 10px;
    margin: 10px 0;
}

.view-toggle-btn {
    padding: 8px 15px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    background: #f5f5f5;
    cursor: pointer;
    font-size: 14px;
    color: #333;
    transition: all 0.2s ease;
}

.view-toggle-btn:hover {
    background: #e6f7ff;
    border-color: #1890ff;
    color: #1890ff;
}

.view-toggle-btn.active {
    background: #1890ff;
    border-color: #1890ff;
    color: white;
}

/* 图表区域样式 */
.chart-view {
    background: white;
    border-radius: 8px;
    padding: 0;
    box-shadow: 0 1px 2px rgba(0,0,0,0.1);
    min-height: 450px;
    width: 100%;
    margin: 0 auto;
}

.chart-container {
    width: 100%;
    height: 450px;
    margin: 0 auto;
    border: 1px solid #f0f0f0;
    border-radius: 4px;
    overflow: hidden; /* 确保内容不会溢出 */
    max-width: none; /* 移除最大宽度限�?*/
}

/* 对话框内容调整，使其更宽以适应图表 */
.dialog-content {
    width: 98%;
    max-width: 1800px;
    max-height: 90vh;
    padding: 4px 4px; /* 最小化内边距 */
    overflow: hidden; /* 防止产生不必要的滚动�?*/
}

.item-details-container {
    padding: 0;
}

/* 账号新增/编辑弹窗：加宽，操作列可横排，列表更紧凑 */
.edit-dialog.account-data-dialog .dialog-content {
    max-width: 1280px;
    width: 96%;
}

/* 账号编辑弹窗物品列：名称后小字跟随行情与盈利 */
.edit-dialog.account-data-dialog .edit-item-name-cell {
    vertical-align: middle;
}
.edit-dialog.account-data-dialog .edit-item-name-line {
    display: inline-flex;
    align-items: baseline;
    flex-wrap: nowrap;
    gap: 0 6px;
    line-height: 1.2;
    max-width: 100%;
    overflow: hidden;
}
.edit-dialog.account-data-dialog .edit-item-title {
    font-weight: 600;
    flex-shrink: 0;
}
.edit-dialog.account-data-dialog .edit-item-meta-tag {
    font-size: 11px;
    color: #8c8c8c;
    white-space: nowrap;
    vertical-align: baseline;
    overflow: hidden;
    text-overflow: ellipsis;
}
.edit-dialog.account-data-dialog .edit-item-meta-tag.edit-item-profit-pct {
    font-weight: 600;
}
.edit-dialog.account-data-dialog tr.item-row-profit-target-met {
    background-color: #f3e8ff !important;
}
.edit-dialog.account-data-dialog tr.item-row-profit-loss {
    background-color: #e8f5e9 !important;
}
.edit-dialog.account-data-dialog tr.item-row-profit-below-target {
    background-color: #ffebee !important;
}
.edit-dialog.account-data-dialog tr.item-row-profit-target-met.item-sold-out,
.edit-dialog.account-data-dialog tr.item-row-profit-loss.item-sold-out,
.edit-dialog.account-data-dialog tr.item-row-profit-below-target.item-sold-out {
    opacity: 0.88;
}

/* 图表加载和错误状态样�?*/
.chart-loading, .chart-error, .chart-message {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 400px;
    width: 100%;
    text-align: center;
}

.chart-loading {
    color: #1890ff;
}

.chart-error {
    color: #f5222d;
}

.chart-message {
    color: #666;
}

/* 调整图表视图区域以充满整个区�?*/
#all-servers-chart-view {
    width: 100%;
    padding: 0;
    margin: 0;
    border: none;
}

/* 修复Chrome和Firefox上的滚动条样�?*/
.table-container::-webkit-scrollbar,
.server-table-container::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.table-container::-webkit-scrollbar-track,
.server-table-container::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

.table-container::-webkit-scrollbar-thumb,
.server-table-container::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 4px;
}

.table-container::-webkit-scrollbar-thumb:hover,
.server-table-container::-webkit-scrollbar-thumb:hover {
    background: #999;
}

/* 对比表格样式 */
.compare-table-container {
    width: 100%;
    overflow-x: auto; /* 允许横向滚动，避免第一列文本被省略 */
    margin-top: 15px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.compare-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px; /* 减小字体大小 */
    table-layout: fixed; /* 使用固定表格布局 */
}

.compare-table th,
.compare-table td {
    padding: 8px 10px; /* 减小内边�?*/
    text-align: left;
    border-bottom: 1px solid #eee;
}

.compare-table th {
    background-color: #f7f7f7;
    font-weight: 600;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}

.compare-table th .status-cell {
    display: inline-block;
    margin-left: 5px;
    vertical-align: middle;
}

/* 服务器对比弹窗的服务器名标题列（第2、3列）不截断，以便显示三年外倒计时 */
.compare-table th:nth-child(2),
.compare-table th:nth-child(3) {
    overflow: visible;
    text-overflow: clip;
}

/* 设置物品列宽度更�?*/
.compare-table th:first-child,
.compare-table td:first-child {
    min-width: 150px; /* 减小最小宽�?*/
    max-width: none;
    width: 25%; /* 实际宽度仍以 colgroup 为准 */
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
}
/* 对比弹窗第一列物品图标尺寸与对齐 */
.compare-table td.item-cell .item-icon,
.compare-table td:first-child .item-icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
    vertical-align: -4px;
    margin-right: 6px;
}

/* 其他列宽度均匀分布 */
.compare-table th:not(:first-child),
.compare-table td:not(:first-child) {
    width: 18.75%; /* 略微调整宽度比例 */
    text-align: right;
    white-space: nowrap;
}

.compare-table tr:hover {
    background-color: #f5f9ff;
}

/* 价格差异样式 */
.compare-table .price-up {
    color: #f56c6c;
    font-weight: 500;
}

.compare-table .price-down {
    color: #67c23a;
    font-weight: 500;
}

/* 差异比例样式 */
.compare-table .high-ratio {
    color: #f56c6c;
    font-weight: bold;
    background-color: rgba(245, 108, 108, 0.1);
}

.compare-table .medium-ratio {
    color: #e6a23c;
    font-weight: bold;
}

.compare-table .low-ratio {
    color: #67c23a;
    font-weight: 500;
}

/* 差异比例超过50%的行样式 */
.compare-table tr.highlight-row {
    background-color: #fff7e6; /* 浅橙色背�?*/
    border-left: 3px solid #fa8c16; /* 左侧橙色边框 */
}

.compare-table tr.highlight-row:hover {
    background-color: #fff1cc; /* 悬停时稍深的橙色 */
}

/* 两服价格列：该道具在对应服务器有库存时，单元格底色为浅绿（提示持有） */
.compare-table td.compare-cell-inventory {
    background-color: #e6f7ec;
}
.compare-table td.compare-cell-inventory:hover {
    background-color: #d6f0de;
}

/* 月销量胶囊标签样�?- 根据图片中的交易频率胶囊样式 */
.sales-count {
    display: inline-block;
    font-size: 11px;
    padding: 1px 3px;
    border-radius: 2px;
    margin-left: 5px;
    vertical-align: middle;
    font-weight: normal;
    line-height: 1.2;
    white-space: nowrap;
    color: white !important;
    box-sizing: border-box;
}

/* 超爆标签 - 红色 */
.sales-count.sales-super,
.sales-super {
    background-color: #f5222d !important;
    color: white !important;
}

/* 火爆标签 - 橙色 */
.sales-count.sales-high,
.sales-high {
    background-color: #fa8c16 !important;
    color: white !important;
}

/* 普通标签 - 绿色 */
.sales-count.sales-medium,
.sales-medium {
    background-color: #52c41a !important;
    color: white !important;
}

/* 勿入标签 - 灰色 */
.sales-count.sales-low,
.sales-low {
    background-color: #909399 !important;
    color: white !important;
}

/* 使用标签 - 蓝色 */
.sales-count.sales-use,
.sales-use {
    background-color: #1890ff !important;
    color: white !important;
}

/* 确保在 server-entry 中的销量标签样式正确应用 */
.server-entry .sales-count {
    flex-shrink: 0;
    min-width: 60px;
    text-align: center;
}

/* 确保在高价服务器列表中的销量标签样式正确应用 */
.high-price-servers .sales-count {
    flex-shrink: 0;
    min-width: 60px;
    text-align: center;
}

/* 结果容器样式 */
#compareResultContainer {
    margin-top: 15px; /* 减小上边�?*/
}

#compareResultContainer h3 {
    font-size: 15px; /* 减小标题字体 */
    margin-bottom: 8px; /* 减小下边�?*/
    color: #333;
    text-align: center;
}

/* 确保表格内容不换行，保持单行显示 */
.compare-table tbody td {
    height: 36px; /* 减小行高 */
    line-height: 18px; /* 减小行间�?*/
    vertical-align: middle;
}

/* 对比对话框样�?*/
.compare-dialog {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 99999; /* 进一步提高z-index确保绝对在最上层 */
    pointer-events: none; /* 让遮罩层不阻挡tooltip */
}

.compare-dialog-content {
    background: white;
    width: 90%;
    max-width: 1200px;
    max-height: 90vh;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    pointer-events: auto;
}

.compare-dialog-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 15px;
    border-bottom: 1px solid #eee;
}

.compare-dialog-header h2 {
    margin: 0;
    font-size: 16px;
    color: #333;
}

.close-btn {
    background: none;
    border: none;
    font-size: 20px;
    cursor: pointer;
    color: #999;
}

.compare-dialog-body {
    padding: 15px;
    flex: 1;
    overflow: visible;
}

.server-select-container {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 15px;
}

.server-select-group {
    flex: 1;
}

.server-select-group label {
    display: block;
    margin-bottom: 5px;
    font-size: 13px;
    color: #333;
}

.server-input {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 13px;
}

/* 服务器交换按钮容�?*/
.server-swap-btn-container {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 5px;
    margin-top: 25px; /* 与输入框标签对齐 */
}

/* 服务器交换按钮样�?*/
.server-swap-btn {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: #f0f0f0;
    border: 1px solid #d9d9d9;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.3s;
    color: #1890ff;
    padding: 0;
}

.server-swap-btn:hover {
    background-color: #e6f7ff;
    border-color: #1890ff;
    transform: scale(1.05);
}

.server-swap-btn:active {
    transform: scale(0.95);
}

.server-swap-btn svg {
    width: 20px;
    height: 20px;
}

.compare-buttons {
    display: flex;
    justify-content: center;
    margin-top: 15px;
}

.compare-run-btn {
    padding: 8px 20px;
    background-color: #1890ff;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
}

.compare-run-btn:hover {
    background-color: #40a9ff;
}

.compare-result-container {
    padding: 0 15px 15px;
    max-height: none;
    overflow: visible;
}

/* 图表部分样式 */
.tooltip-chart-section {
    width: 100%;
    margin-top: 15px;
    padding-bottom: 20px; /* 增加底部内边�?*/
}

/* 三列数据的容�?*/
.tooltip-columns {
    display: flex;
    gap: 6px; /* 进一步减小间�?*/
    width: 100%;
    justify-content: space-between; /* 平均分配空间 */
}

/* 调整三列的宽度比�?*/
.tooltip-left {
    flex: 1;
    min-width: 130px; /* 减小最小宽�?*/
    max-width: 32%; /* 限制最大宽�?*/
    border-bottom: 2px solid #ff4d4f; /* 添加红色底部边框 */
}

.tooltip-middle {
    flex: 1.2;
    min-width: 130px; /* 减小最小宽�?*/
    max-width: 35%; /* 限制最大宽�?*/
    border-bottom: 2px solid #ff4d4f; /* 添加与第一列相同的红色底部边框 */
}

.tooltip-right {
    flex: 1;
    min-width: 130px; /* 减小最小宽�?*/
    max-width: 32%; /* 限制最大宽�?*/
}

/* 调整图表容器的标题样�?*/
.tooltip-chart-section .section-title {
    margin-bottom: 5px;
}

/* 操作按钮在 .stats-row-break 之后换至第二行 */

/* 每日盈亏分析模态窗口样�?*/
.modal-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.profit-loss-modal {
    width: 90%;
    max-width: 1000px;
    max-height: 90%;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
}

.modal-header {
    padding: 15px 20px;
    border-bottom: 1px solid #e0e0e0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modal-header h2 {
    margin: 0;
    font-size: 1.5rem;
    color: #333;
}

.modal-controls {
    display: flex;
    align-items: center;
    gap: 10px;
}

.time-range-selector {
    display: flex;
    gap: 5px;
}

.range-btn {
    background-color: #f0f0f0;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 5px 10px;
    cursor: pointer;
    font-size: 12px;
    transition: all 0.2s;
}

.range-btn:hover {
    background-color: #e0e0e0;
}

.range-btn.active {
    background-color: #4a90e2;
    color: white;
    border-color: #4a90e2;
}

.close-btn {
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: #666;
}

.close-btn:hover {
    color: #333;
}

.modal-body {
    padding: 20px;
    overflow-y: auto;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.chart-container {
    flex-grow: 1;
    height: 400px;
    margin-bottom: 20px;
}

.chart-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: auto;
    gap: 8px;
    margin-top: 10px;
    padding: 10px 0;
    min-height: 0;
    flex-shrink: 0;
    overflow: visible;
}

.sales-modal .chart-summary {
    grid-template-columns: repeat(9, minmax(0, 1fr));
    grid-template-rows: auto;
    gap: 6px;
}

.summary-item {
    background-color: #f5f5f5;
    padding: 8px 12px;
    border-radius: 6px;
    text-align: center;
    min-width: 100px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.chart-summary .summary-item .summary-label {
    font-size: 12px !important;
    color: #666 !important;
    margin-bottom: 4px !important;
    display: block !important;
    line-height: 1.3 !important;
    word-wrap: break-word !important;
    word-break: break-all !important;
    width: 100% !important;
    text-align: center !important;
}

.chart-summary .summary-item .summary-value {
    font-size: 14px !important;
    font-weight: bold !important;
    color: #333 !important;
    display: block !important;
    line-height: 1.3 !important;
    word-wrap: break-word !important;
    word-break: break-all !important;
    width: 100% !important;
    text-align: center !important;
}

/* 每日卖出分析-总利润主值与整月预估横向排列样式 */
.profit-main-value {
    flex-shrink: 0;
}
.profit-forecast {
    display: inline;
    font-size: 11px;
    color: #888;
    font-weight: normal;
}

/* 每日卖出分析的统计摘要样式 - 覆盖通用样式 */
.chart-summary .summary-item {
    background-color: #f5f5f5 !important;
    padding: 12px 8px !important;
    border-radius: 6px !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    margin-bottom: 0 !important;
    min-height: 55px !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    border: 1px solid #e0e0e0 !important;
}

.sales-modal .chart-summary .summary-item {
    padding: 8px 4px !important;
    min-height: 52px !important;
}

.sales-modal .chart-summary .summary-item .summary-label {
    font-size: 11px !important;
    margin-bottom: 2px !important;
    word-break: keep-all !important;
}

.sales-modal .chart-summary .summary-item .summary-value {
    font-size: 13px !important;
    word-break: break-word !important;
}

.sales-modal .chart-summary .profit-forecast {
    display: block;
    font-size: 10px;
    line-height: 1.2;
}

.sales-modal #totalProfit {
    flex-direction: column !important;
    gap: 2px !important;
}

.sales-modal .chart-summary .summary-item-with-tip .summary-label {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    word-break: keep-all !important;
}

.summary-dist-btn {
    width: 14px;
    height: 14px;
    padding: 0;
    border: 1px solid #8aa0b3;
    border-radius: 50%;
    background: #fff;
    color: #4a6a80;
    font-size: 10px;
    font-weight: 700;
    font-style: italic;
    line-height: 12px;
    cursor: pointer;
    flex-shrink: 0;
}

.summary-dist-btn:hover,
.summary-dist-btn.is-open {
    background: #1d6fa5;
    border-color: #1d6fa5;
    color: #fff;
}

.sell-duration-dist-tip,
.summary-dist-tip {
    position: fixed;
    z-index: 12000;
    min-width: 220px;
    max-height: min(420px, 70vh);
    overflow: auto;
    padding: 10px 12px;
    background: #fffef9;
    border: 1px solid #d7c7a8;
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(40, 32, 18, 0.18);
    color: #2b2b2b;
    font-size: 12px;
}

/* 物品详情弹窗本身 z-index 1000000，tip 必须叠在它上面 */
.edit-dialog .summary-dist-tip,
.summary-dist-tip--on-dialog {
    z-index: 1000010;
}

.sell-duration-dist-title,
.summary-dist-title {
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 8px;
    color: #3a4a58;
}

.sell-duration-dist-table,
.summary-dist-table {
    width: 100%;
    border-collapse: collapse;
}

.sell-duration-dist-table th,
.sell-duration-dist-table td,
.summary-dist-table th,
.summary-dist-table td {
    padding: 4px 6px;
    text-align: right;
    line-height: 1.4;
    white-space: nowrap;
}

.sell-duration-dist-table th:first-child,
.sell-duration-dist-table td:first-child,
.summary-dist-table th:first-child,
.summary-dist-table td:first-child {
    text-align: left;
}

.sell-duration-dist-table thead th,
.summary-dist-table thead th {
    color: #888;
    font-weight: 500;
    border-bottom: 1px solid #eee;
}

.sell-duration-dist-table tbody tr:nth-child(even),
.summary-dist-table tbody tr:nth-child(even) {
    background: #f6f3ea;
}

.sell-duration-dist-table .dist-range,
.summary-dist-table .dist-range {
    font-weight: 600;
}

.sell-duration-dist-table .dist-count span,
.sell-duration-dist-table tfoot .dist-count span,
.summary-dist-table .dist-count span,
.summary-dist-table tfoot .dist-count span {
    color: #999;
    font-size: 11px;
    margin-left: 1px;
    font-weight: normal;
}

.sell-duration-dist-table tfoot td,
.summary-dist-table tfoot td {
    border-top: 1px solid #eee;
    font-weight: 600;
    color: #333;
}

/* 最大跌幅分析样式 */
.max-dropdown-controls {
    background-color: #f8f9fa;
    padding: 8px 12px;
    border-radius: 4px;
    margin-bottom: 8px;
    border: 1px solid #e9ecef;
    flex-shrink: 0;
}

.max-dropdown-container {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-wrap: nowrap;
    justify-content: flex-start;
}

.max-dropdown-container label {
    font-size: 12px;
    font-weight: 500;
    color: #333;
    margin-right: 3px;
    white-space: nowrap;
}

.date-input {
    padding: 4px 6px;
    border: 1px solid #d9d9d9;
    border-radius: 3px;
    font-size: 12px;
    background-color: white;
    color: #333;
    transition: border-color 0.3s ease;
    width: 110px;
}

.percent-input {
    padding: 4px 6px;
    border: 1px solid #d9d9d9;
    border-radius: 3px;
    font-size: 12px;
    background-color: white;
    color: #333;
    transition: border-color 0.3s ease;
    width: 70px;
    text-align: center;
}

.date-input:focus {
    outline: none;
    border-color: #1890ff;
    box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
}

.calculate-btn {
    background: linear-gradient(135deg, #ff6b6b 0%, #ee5a24 100%);
    color: white;
    border: none;
    border-radius: 3px;
    padding: 4px 8px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 500;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(255, 107, 107, 0.3);
    white-space: nowrap;
}

.calculate-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(255, 107, 107, 0.4);
}

.max-dropdown-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
    background-color: white;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    table-layout: fixed;
}

/* 表格列宽度控制 */
.max-dropdown-table th:nth-child(1),
.max-dropdown-table td:nth-child(1) {
    width: 4%; /* 序号 */
}

.max-dropdown-table th:nth-child(2),
.max-dropdown-table td:nth-child(2) {
    width: 10%; /* 服务器 */
}

.max-dropdown-table th:nth-child(3),
.max-dropdown-table td:nth-child(3) {
    width: 8%; /* 服务器类型 */
}

.max-dropdown-table th:nth-child(4),
.max-dropdown-table td:nth-child(4) {
    width: 8%; /* 开始价格 */
    text-align: right;
}

.max-dropdown-table th:nth-child(5),
.max-dropdown-table td:nth-child(5) {
    width: 8%; /* 期间最低价 */
    text-align: right;
}

.max-dropdown-table th:nth-child(6),
.max-dropdown-table td:nth-child(6) {
    width: 8%; /* 最大跌幅 */
    text-align: right;
}

.max-dropdown-table th:nth-child(7),
.max-dropdown-table td:nth-child(7) {
    width: 8%; /* 最大跌幅率 */
    text-align: right;
}

.max-dropdown-table th:nth-child(8),
.max-dropdown-table td:nth-child(8) {
    width: 8%; /* 跌幅日期 */
}

.max-dropdown-table th:nth-child(9),
.max-dropdown-table td:nth-child(9) {
    width: 8%; /* 反弹日期 */
}

.max-dropdown-table th:nth-child(10),
.max-dropdown-table td:nth-child(10) {
    width: 8%; /* 恢复价格 */
    text-align: right;
}

.max-dropdown-table th:nth-child(11),
.max-dropdown-table td:nth-child(11) {
    width: 8%; /* 恢复日期 */
}

.max-dropdown-table th:nth-child(12),
.max-dropdown-table td:nth-child(12) {
    width: 8%; /* 持续时间 */
}

.max-dropdown-table th {
    background-color: #f8f9fa;
    padding: 8px 6px;
    text-align: left;
    font-weight: 600;
    color: #333;
    border-bottom: 2px solid #e9ecef;
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.max-dropdown-table td {
    padding: 6px 6px;
    border-bottom: 1px solid #e9ecef;
    font-size: 12px;
    color: #333;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.max-dropdown-table tr:hover {
    background-color: #f8f9fa;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.max-dropdown-table tr:active {
    background-color: #e6f7ff;
}

.max-dropdown-table .price-down {
    color: #ff4d4f;
    font-weight: 600;
}

.max-dropdown-table-container {
    border-radius: 6px;
    background-color: white;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    position: relative;
    /* 确保滚动容器有足够的最小高度 */
    min-height: 200px;
    /* 修复滚动条超出边界的问题 - 设置合适的高度确保在弹窗内 */
    max-height: 400px;
    overflow-y: auto;
    overflow-x: hidden;
    /* 确保滚动条在容器内部 */
    box-sizing: border-box;
    /* 确保容器不会超出父容器边界 */
    width: 100%;
    margin: 0;
    padding: 0;
    /* 确保滚动正常工作 */
    flex: 1;
}

/* 最大跌幅分析视图样式 */
.max-dropdown-analysis {
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    gap: 0;
}

.max-dropdown-controls {
    flex-shrink: 0;
    margin-bottom: 15px;
}

/* 确保滚动条能够正常工作 */
.max-dropdown-table-container::-webkit-scrollbar {
    width: 8px;
}

.max-dropdown-table-container::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

.max-dropdown-table-container::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 4px;
}

.max-dropdown-table-container::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* 确保表格容器可以正常滚动 */
.max-dropdown-table-container {
    scrollbar-width: thin;
    scrollbar-color: #c1c1c1 #f1f1f1;
}

/* 确保表格内容可以正常滚动 */
.max-dropdown-table-container table {
    margin-bottom: 0;
}

.summary-label {
    font-size: 14px;
    color: #666;
    margin-bottom: 5px;
}

.summary-value {
    font-size: 16px;
    font-weight: bold;
    color: #333;
}

.no-data-message {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    color: #666;
    font-size: 16px;
    background-color: #f5f5f5;
    border-radius: 6px;
    padding: 20px;
}

/* 响应式调�?*/
@media (max-width: 768px) {
    .chart-summary {
        flex-direction: column;
        gap: 10px;
    }
    
    .modal-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .modal-controls {
        width: 100%;
        justify-content: space-between;
    }
    
    .time-range-selector {
        flex-wrap: wrap;
    }
    
    .chart-container {
        height: 300px;
    }
}

/* 每日盈亏分析 / 每日卖出：默认同「用户管理」浅蓝描边 */
.profit-analysis-btn,
.sales-analysis-btn,
.compare-btn {
    appearance: none;
    background: #f0f7fb;
    color: #1f5575;
    border: 1px solid rgba(42, 111, 151, 0.35);
    border-radius: 999px;
    padding: 6px 12px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
    box-shadow: none;
    white-space: nowrap;
}

.profit-analysis-btn:hover,
.sales-analysis-btn:hover,
.compare-btn:hover {
    background: #e4f0f8;
    border-color: rgba(42, 111, 151, 0.55);
    color: #1a2b34;
    transform: none;
    box-shadow: none;
}

/* 错误消息样式 */
.error-message {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    color: #f5222d;
    font-size: 16px;
    background-color: #fff1f0;
    border: 1px solid #ffa39e;
    border-radius: 6px;
    padding: 20px;
    text-align: center;
}

/* 刷新按钮 + 账号 meta 时间（单行） */
.refresh-data-wrap {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 4px;
    margin-left: 0;
    flex-shrink: 0;
}

.account-json-meta-display {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 2px;
    line-height: 1.1;
    max-width: none;
}

.account-json-meta-time {
    font-size: 10px;
    color: #8c8c8c;
    white-space: nowrap;
}

.account-json-meta-status {
    font-size: 10px;
    font-weight: 600;
    white-space: nowrap;
}

.account-json-meta-status.is-latest {
    color: #52c41a;
}

.account-json-meta-status.is-stale {
    color: #ff4d4f;
}

.account-json-meta-status.is-unknown {
    color: #8c8c8c;
}

/* 刷新数据按钮样式 */
.refresh-data-btn {
    background: none;
    border: none;
    cursor: pointer;
    color: #1890ff;
    margin-left: 0;
    padding: 1px 3px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    transition: all 0.3s;
}

.refresh-data-btn:hover {
    background-color: #e6f7ff;
    transform: rotate(180deg);
}

.refresh-data-btn .icon {
    font-size: 12px;
}



.refresh-data-btn.loading .icon {
    animation: spin 1s linear infinite;
}

/* 刷新成功提示样式 */
.refresh-success-tip {
    position: fixed;
    top: 20px;
    right: 20px;
    background-color: #f6ffed;
    border: 1px solid #b7eb8f;
    color: #52c41a;
    padding: 10px 15px;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    z-index: 1000;
    display: flex;
    align-items: center;
    gap: 8px;
    animation: fadeInOut 3s ease-in-out forwards;
}

@keyframes fadeInOut {
    0% { opacity: 0; transform: translateY(-20px); }
    10% { opacity: 1; transform: translateY(0); }
    90% { opacity: 1; transform: translateY(0); }
    100% { opacity: 0; transform: translateY(-20px); }
}

/* 销售详情样�?*/
.sales-details {
    margin-top: 20px;
    padding: 15px;
    background: #f9f9f9;
    border-radius: 6px;
}

.sales-details h3 {
    margin: 0 0 15px 0;
    color: #333;
    font-size: 16px;
    font-weight: 600;
}

/* 每日卖出分析：「每日热门道具销量」标题右侧，最近7天卖出开服状态胶囊一行（可横滑） */
.sales-hot-daily-header {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
    margin: 10px 0 8px 0;
    min-width: 0;
}

.sales-hot-daily-header h4 {
    margin: 0;
    flex-shrink: 0;
    font-size: 15px;
    color: #222;
    font-weight: 600;
    white-space: nowrap;
}

.sales-hot-daily-sep {
    color: #d9d9d9;
    flex-shrink: 0;
    user-select: none;
}

.sales-hot-status-scroll {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

.sales-hot-status-scroll::-webkit-scrollbar {
    height: 4px;
}

.sales-hot-status-scroll::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 2px;
}

.sales-hot-status-pill {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 11px;
    white-space: nowrap;
    line-height: 1.35;
    flex-shrink: 0;
}

.sales-hot-status-empty {
    color: #bbb;
    font-size: 12px;
    white-space: nowrap;
    flex-shrink: 0;
}

.sales-list {
    max-height: 400px;
    overflow-y: auto;
}

.sales-item {
    background: white;
    border-radius: 6px;
    padding: 12px;
    margin-bottom: 10px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    transition: all 0.2s ease;
}

.sales-item:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

.sales-item-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.sales-time {
    font-size: 12px;
    color: #666;
    font-weight: 500;
}

.sales-profit {
    font-size: 14px;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 4px;
}

.profit-positive {
    color: #52c41a;
    background: rgba(82, 196, 26, 0.1);
}

.profit-negative {
    color: #ff4d4f;
    background: rgba(255, 77, 79, 0.1);
}

.sales-item-details {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sales-item-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.item-name {
    font-weight: 600;
    color: #333;
    font-size: 14px;
}

.server-info {
    font-size: 12px;
    color: #666;
    background: #f0f0f0;
    padding: 2px 6px;
    border-radius: 3px;
}

.sales-prices {
    display: flex;
    gap: 15px;
    font-size: 12px;
}

.cost-price {
    color: #ff7875;
}

.sell-price {
    color: #52c41a;
}

.account-info {
    display: flex;
    gap: 10px;
    font-size: 11px;
    color: #999;
}

.account, .role {
    padding: 1px 4px;
    background: #f5f5f5;
    border-radius: 2px;
}

/* 销售模态窗口特有样�?*/
.sales-modal {
    width: 90%;
    max-width: 1200px;
    max-height: 90%;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.sales-modal .monthly-stats-container {
    flex: 0 0 auto;
}

.sales-modal .modal-body {
    overflow-y: auto;
    max-height: calc(90vh - 120px);
}

.sales-modal .chart-container {
    height: 400px;
    min-height: 400px;
}

/* 每日卖出分析：图表区右上角放大镜 */
.daily-sales-chart-wrap {
    position: relative;
}

.daily-sales-chart-zoom-btn {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 5;
    margin-left: 0;
}

/* 每日卖出分析：图表放大窗（与价格走势图放大窗同壳，图表区略加高） */
.daily-sales-chart-zoom-body {
    min-height: min(760px, 84vh);
    width: 100%;
    box-sizing: border-box;
    align-items: stretch !important;
    justify-content: stretch !important;
}

.daily-sales-chart-canvas-wrap {
    position: relative;
    width: 100%;
    min-width: min(1180px, 94vw);
    min-height: 680px;
    height: min(720px, 80vh);
    flex: 1;
}

.daily-sales-chart-zoom-panel .chart-zoom-header h2 {
    margin: 0;
}

@media (max-width: 768px) {
    .sales-modal {
        width: 95%;
        max-height: 95%;
    }
    
    .sales-modal .modal-body {
        max-height: calc(95vh - 100px);
    }
    
    .sales-item-info {
        flex-direction: column;
        gap: 8px;
    }
    
    .sales-prices {
        flex-direction: column;
        gap: 4px;
    }
    
    .account-info {
        flex-direction: column;
        gap: 4px;
    }
}

/* 紧凑销售详情列表样�?*/
.sales-item-compact {
    display: flex;
    align-items: center;
    padding: 6px 12px;
    border-bottom: 1px solid #f0f0f0;
    background: white;
    transition: background-color 0.2s;
    font-size: 12px;
    gap: 8px;
    flex-wrap: nowrap;
    min-height: 32px;
    width: 100%;
    justify-content: space-between;
}

.sales-item-compact:hover {
    background-color: #f8f9fa;
}

.sales-time-compact {
    color: #666;
    font-size: 11px;
    width: 130px;
    flex-shrink: 0;
}

.item-name-compact {
    font-weight: 500;
    color: #333;
    width: 100px;
    flex-shrink: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.server-compact {
    color: #666;
    font-size: 11px;
    width: 120px;
    flex-shrink: 0;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.server-status-compact {
    font-size: 11px;
    width: 70px;
    flex-shrink: 0;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.server-status-compact span {
    display: inline-block;
    padding: 2px 6px;
    border-radius: 12px;
    font-size: 10px;
    white-space: nowrap;
}

.account-compact {
    color: #888;
    font-size: 11px;
    width: 80px;
    flex-shrink: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
}

.role-compact {
    color: #888;
    font-size: 11px;
    width: 60px;
    flex-shrink: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: center;
}

.cost-price-compact {
    color: #f56c6c;
    font-size: 11px;
    width: 80px;
    flex-shrink: 0;
    text-align: right;
}

.sell-price-compact {
    color: #409eff;
    font-size: 11px;
    width: 80px;
    flex-shrink: 0;
    text-align: right;
}

.actual-received-compact {
    color: #67c23a;
    font-size: 11px;
    width: 80px;
    flex-shrink: 0;
    text-align: right;
}

.profit-rate-compact {
    font-weight: 600;
    font-size: 11px;
    width: 70px;
    flex-shrink: 0;
    text-align: right;
}

.sales-profit-compact {
    font-weight: 600;
    font-size: 12px;
    width: 80px;
    flex-shrink: 0;
    text-align: right;
}

.sales-profit-compact.profit-positive {
    color: #67c23a;
}

.sales-profit-compact.profit-negative {
    color: #f56c6c;
}

.sales-profit-compact.profit-gray {
    color: #bfbfbf;
}

.sales-profit-compact.profit-strong {
    color: #ff4d4f;
}

.sell-duration-compact {
    color: #531dab;
    font-size: 11px;
    font-weight: 600;
    width: 88px;
    flex-shrink: 0;
    text-align: right;
    font-variant-numeric: tabular-nums;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sell-duration-compact.is-empty {
    color: #999;
    font-weight: 400;
}

.sell-duration-compact.is-fast {
    color: #67c23a;
}

.sell-duration-compact.is-slow {
    color: #ff4d4f;
}

/* 响应式调�?*/
@media (max-width: 1200px) {
    .sales-item-compact {
        font-size: 11px;
        gap: 6px;
        padding: 4px 8px;
    }
    
    .sales-time-compact {
        width: 110px;
    }
    
    .item-name-compact {
        width: 80px;
    }
    
    .server-compact {
        width: 90px;
    }
    
    .server-status-compact {
        width: 60px;
    }
    
    .account-compact {
        width: 60px;
    }
    
    .role-compact {
        width: 50px;
    }
    
    .cost-price-compact, .sell-price-compact, .actual-received-compact {
        width: 70px;
    }
    
    .profit-rate-compact {
        width: 60px;
    }
    
    .sales-profit-compact {
        width: 70px;
    }

    .sell-duration-compact {
        width: 76px;
    }
}

/* 从HTML内联样式迁移的样式 - 关键样式以避免FOUC (Flash of Unstyled Content) */

.log-btn {
    display: inline-flex;
    align-items: center;
    background: #f0f7fb;
    color: #1f5575;
    border: 1px solid rgba(42, 111, 151, 0.35);
    border-radius: 999px;
    padding: 6px 12px;
    cursor: pointer;
    position: relative;
    font-size: 12px;
    font-weight: 600;
    font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
    box-shadow: none;
    margin: 0;
    justify-content: center;
    flex-shrink: 0;
    white-space: nowrap;
}

.notification-dot {
    display: none !important;
}

/* 日志未读：按钮变色（替代红点） */
.log-btn.has-log-new {
    background: #fff1f0 !important;
    border-color: rgba(198, 40, 40, 0.55) !important;
    color: #a01818 !important;
}

/* .stats-container 主样式见文件前部，此处不重复定义以免冲突 */

#mainContent .stats-toolbar.log-buttons-container > .stats-item {
    flex-shrink: 0;
    margin-right: 0;
}

#mainContent > .stats-container {
    justify-content: flex-start;
    overflow: visible;
}

#mainContent > .stats-container #currentDate.stats-value {
    max-width: none;
}

/* 从HTML内联样式迁移的样式 - 其他内联样式 */
#mainContent {
    display: none;
}

#refreshLatestDataBtn {
    padding: 3px 6px;
    font-size: 16px;
    line-height: 1;
}

#refreshLatestDataBtn .icon {
    font-size: 20px;
    vertical-align: middle;
}

/* 隐藏的表格样式 */
.hidden-table {
    display: none;
}

/* 普通标签样式 */
.tag-普通 {
    background-color: #f6ffed;
    border-color: #b7eb8f;
    color: #52c41a;
}

/* 加载动画 */
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* 图表弹窗样式 */
.chart-dialog {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10000;
}

.chart-dialog > div {
    background-color: white;
    border-radius: 8px;
    padding: 20px;
    max-width: 90%;
    max-height: 90%;
    overflow: auto;
    position: relative;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

/* 加载弹窗样式 */
.loading-dialog {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10000;
}

.loading-dialog > div {
    background-color: white;
    border-radius: 8px;
    padding: 30px;
    text-align: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* 月度统计容器样式 */
.monthly-stats-container {
    padding: 15px 20px;
    border-bottom: 1px solid #e0e0e0;
    background-color: #fafafa;
}

.monthly-stats-container h3 {
    margin: 0 0 10px 0;
    font-size: 14px;
    color: #666;
    font-weight: 500;
}

.monthly-stats-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 4px;
    max-height: 160px;
    overflow-y: auto;
    overflow-x: hidden;
}

.monthly-stat-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background-color: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    font-size: 13px;
    transition: all 0.3s ease;
    cursor: pointer;
}

.monthly-stat-item:hover {
    background-color: #f0f9ff;
    border-color: #91d5ff;
    transform: translateY(-2px);
    box-shadow: 0 2px 8px rgba(24, 144, 255, 0.2);
}

.monthly-stat-item.has-data {
    border-left: 3px solid #1890ff;
}

.monthly-stat-item.monthly-stat-all {
    background-color: #e6f7ff;
    border: 2px solid #1890ff;
    font-weight: 600;
    border-left: none;
}

.monthly-stat-item.monthly-stat-all:hover {
    background-color: #bae7ff;
    border-color: #0050b3;
}

/* 选中状态样式 - 提高优先级 */
.monthly-stat-item.active {
    background-color: #1890ff !important;
    border: 2px solid #1890ff !important;
    border-left: 2px solid #1890ff !important;
    color: white !important;
}

.monthly-stat-item.active .month-name,
.monthly-stat-item.active .month-sales,
.monthly-stat-item.active .month-count {
    color: white !important;
}

.monthly-stat-item.active:hover {
    background-color: #096dd9 !important;
    border-color: #096dd9 !important;
}

.monthly-stat-item .month-name {
    font-weight: 600;
    color: #333;
}

.monthly-stat-item .month-sales {
    color: #1890ff;
    font-weight: 800;
    font-size: 15px;
    text-shadow: 0 0 4px rgba(0, 0, 0, 0.18);
    letter-spacing: 0.5px;
}

.monthly-stat-item .month-count {
    color: #666;
    font-size: 12px;
}

/* 每日卖出面板的月度统计项样式 - 三行显示、可换行 */
.sales-monthly-stat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    min-width: 72px;
    padding: 8px 10px;
    background-color: #e8e8e8;
    border: none;
    border-radius: 6px;
    font-size: 12px;
    transition: all 0.2s ease;
    cursor: pointer;
    flex-shrink: 0;
    line-height: 1.3;
}

.sales-monthly-stat-item .month-name,
.sales-monthly-stat-item .month-sales,
.sales-monthly-stat-item .month-count {
    display: block;
    text-align: center;
    white-space: nowrap;
}

.sales-monthly-stat-item:hover {
    background-color: #d0d0d0;
}

/* 选中状态样式 - 提高优先级 */
.sales-monthly-stat-item.active {
    background-color: #1890ff !important;
    color: white !important;
}

.sales-monthly-stat-item.active .month-name,
.sales-monthly-stat-item.active .month-sales,
.sales-monthly-stat-item.active .month-count {
    color: white !important;
}

.sales-monthly-stat-item.active:hover {
    background-color: #096dd9 !important;
}

.sales-monthly-stat-item .month-name {
    font-weight: 600;
    color: #333;
    font-size: 12px;
}

.sales-monthly-stat-item .month-sales {
    color: #1890ff;
    font-weight: 800;
    font-size: 15px;
    text-shadow: 0 0 4px rgba(0, 0, 0, 0.18);
    letter-spacing: 0.5px;
}

.sales-monthly-stat-item .month-count {
    color: #666;
    font-size: 11px;
}

/* 月度统计列表滚动条样式 */
.monthly-stats-list::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.monthly-stats-list::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.monthly-stats-list::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 3px;
}

.monthly-stats-list::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* 购买记录弹窗：月度统计（与「每日变更 / 调整种类」相同：log-price-daily-stats + 横向滚动列表） */
.purchase-log-monthly-stats-block {
    flex: 1;
    min-width: 0;
    width: 100%;
    margin-right: 0;
}

.purchase-log-monthly-stats-block--compact .log-price-daily-stats__monthly-wrap.monthly-stats-container {
    padding: 2px 0 4px !important;
    margin: 0;
    border-bottom: none;
    background: transparent;
}

.purchase-log-monthly-stats-block--compact .log-price-daily-stats__list.monthly-stats-list {
    padding-top: 0;
    padding-bottom: 2px;
}

.purchase-log-monthly-stats-block--compact .sales-monthly-stat-item {
    padding: 5px 8px;
    min-height: auto;
}

.purchase-log-monthly-stats-block .month-sales.purchase-log-month-stat-cost {
    font-weight: 800;
    letter-spacing: 0.02em;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.35), 0 1px 3px rgba(0, 0, 0, 0.22);
}

.purchase-log-monthly-stats-block .month-sales.plm-cost--grey {
    color: #6c757d;
}

.purchase-log-monthly-stats-block .month-sales.plm-cost--blue {
    color: #1677ff;
}

.purchase-log-monthly-stats-block .month-sales.plm-cost--green {
    color: #2e7d32;
}

.purchase-log-monthly-stats-block .month-sales.plm-cost--orange {
    color: #e65100;
}

.purchase-log-monthly-stats-block .month-sales.plm-cost--red {
    color: #c62828;
}

.purchase-log-monthly-stats-block .sales-monthly-stat-item.monthly-stat-item.no-data {
    opacity: 0.55;
}

/* 价格变更日志弹窗：每日统计（复用 sales-monthly-stat-item 卡片，与每日卖出分析月度条视觉一致） */
.log-price-daily-stats {
    flex: 1;
    min-width: 0;
    margin-right: 12px;
}

.log-price-daily-stats__toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 8px;
}

.log-price-daily-stats__toolbar-left {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    min-width: 0;
}

.log-price-daily-curve-btn {
    padding: 4px 12px;
    font-size: 12px;
    border: 1px solid #722ed1;
    border-radius: 4px;
    background: #fff;
    color: #722ed1;
    cursor: pointer;
    white-space: nowrap;
    transition: border-color 0.2s ease, color 0.2s ease, background 0.2s ease;
}

.log-price-daily-curve-btn:hover {
    background: #f9f0ff;
    border-color: #531dab;
    color: #531dab;
}

.log-price-daily-stats__title {
    font-size: 13px;
    color: #666;
    font-weight: 500;
}

.log-price-daily-stats__modes {
    display: flex;
    gap: 6px;
    flex-shrink: 0;
}

.log-price-daily-mode-btn {
    padding: 4px 12px;
    font-size: 12px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    background: #fff;
    color: #666;
    cursor: pointer;
    transition: border-color 0.2s ease, color 0.2s ease, background 0.2s ease;
}

.log-price-daily-mode-btn:hover {
    border-color: #1890ff;
    color: #1890ff;
}

.log-price-daily-mode-btn.active {
    background: #1890ff;
    border-color: #1890ff;
    color: #fff;
}

.log-price-daily-stats__monthly-wrap {
    padding: 10px 12px !important;
}

.log-price-daily-stats .monthly-stats-list {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    max-height: none;
}

.log-price-daily-stat-item {
    cursor: pointer;
}

.log-price-daily-stat-item.log-price-daily-stat-all .month-sales {
    color: #1890ff;
}

/* 服务器统计弹窗（紧凑左排行 + 点选右明细） */
.ss-modal-overlay {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    background: rgba(15, 23, 42, 0.45);
    z-index: 2000;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 24px 14px;
    overflow: hidden;
    box-sizing: border-box;
}

.ss-modal {
    background: #fff;
    border-radius: 12px;
    width: min(960px, 100%);
    height: min(85vh, 900px);
    max-height: 85vh;
    overflow: hidden;
    box-shadow: 0 16px 48px rgba(15, 23, 42, 0.22);
    display: flex;
    flex-direction: column;
    padding: 0 !important;
    max-width: none !important;
}

.ss-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid #e5e7eb;
    flex-shrink: 0;
}

.ss-title {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    color: #111827;
}

.ss-close {
    width: 30px;
    height: 30px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    background: #fff;
    color: #64748b;
    font-size: 18px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.ss-body {
    padding: 12px 16px 16px;
    overflow: hidden;
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.ss-kpi {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 12px;
    flex-shrink: 0;
}

.ss-kpi-item {
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 8px 10px;
    min-width: 0;
}

.ss-kpi-k {
    font-size: 11px;
    color: #6b7280;
    margin-bottom: 2px;
}

.ss-kpi-v {
    font-size: 15px;
    font-weight: 700;
    color: #111827;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ss-kpi-v.is-up,
.ss-item-meta .is-up,
.ss-server-sub .is-up,
.ss-summary-cell .v.is-up {
    color: #16a34a;
}

.ss-kpi-v.is-down,
.ss-item-meta .is-down,
.ss-server-sub .is-down,
.ss-summary-cell .v.is-down {
    color: #dc2626;
}

.ss-grid {
    display: grid;
    grid-template-columns: 42% 1fr;
    gap: 12px;
    flex: 1;
    min-height: 0;
    align-items: stretch;
}

.ss-panel {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #fff;
    display: flex;
    flex-direction: column;
    min-height: 0;
    height: 100%;
    overflow: hidden;
}

.ss-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 12px;
    border-bottom: 1px solid #f1f5f9;
    background: #fafbfc;
    flex-shrink: 0;
}

.ss-panel-title {
    margin: 0;
    font-size: 13px;
    font-weight: 700;
    color: #334155;
}

.ss-sort {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 8px 10px;
    border-bottom: 1px solid #f1f5f9;
    flex-shrink: 0;
}

.ss-sort-btn {
    border: 1px solid #e5e7eb;
    background: #fff;
    color: #475569;
    border-radius: 999px;
    padding: 3px 9px;
    font-size: 11px;
    cursor: pointer;
}

.ss-sort-btn.active {
    background: #2563eb;
    border-color: #2563eb;
    color: #fff;
    font-weight: 700;
}

.ss-mode {
    display: inline-flex;
    border: 1px solid #e5e7eb;
    border-radius: 999px;
    overflow: hidden;
    background: #fff;
}

.ss-mode-btn {
    border: 0;
    background: transparent;
    padding: 4px 10px;
    font-size: 11px;
    cursor: pointer;
    color: #64748b;
}

.ss-mode-btn.active {
    background: #eff6ff;
    color: #1d4ed8;
    font-weight: 700;
}

.ss-list {
    overflow: auto;
    flex: 1;
    min-height: 0;
    padding: 6px;
}

.ss-server-row {
    display: grid;
    grid-template-columns: 28px 1fr auto;
    gap: 8px;
    align-items: start;
    padding: 8px 10px;
    border-radius: 8px;
    border: 1px solid transparent;
    cursor: pointer;
    margin-bottom: 4px;
}

.ss-server-row:hover {
    background: #f8fafc;
}

.ss-server-row.active {
    background: #eff6ff;
    border-color: #bfdbfe;
}

.ss-rank {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #e2e8f0;
    color: #334155;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    margin-top: 2px;
}

.ss-server-row.active .ss-rank,
.ss-server-row:nth-child(-n+3) .ss-rank {
    background: #2563eb;
    color: #fff;
}

.ss-server-name {
    font-size: 13px;
    font-weight: 700;
    color: #111827;
    line-height: 1.3;
}

.ss-type-cap {
    display: inline-block;
    padding: 1px 6px;
    font-size: 10px;
    border-radius: 999px;
    margin-left: 6px;
    white-space: nowrap;
    vertical-align: middle;
}

.ss-server-sub {
    margin-top: 3px;
    font-size: 11px;
    color: #64748b;
    line-height: 1.35;
}

.ss-main-metric {
    text-align: right;
    font-size: 14px;
    font-weight: 800;
    color: #2563eb;
    white-space: nowrap;
    padding-top: 2px;
}

.ss-main-pct {
    display: block;
    font-size: 11px;
    font-weight: 600;
    color: #64748b;
    margin-top: 2px;
}

.ss-server-summary {
    padding: 12px;
    border-bottom: 1px solid #f1f5f9;
    background: linear-gradient(180deg, #f8fafc, #fff);
    flex-shrink: 0;
}

.ss-summary-title {
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 8px;
    color: #111827;
}

.ss-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
}

.ss-summary-cell {
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 6px;
    padding: 6px 8px;
}

.ss-summary-cell .k {
    font-size: 10px;
    color: #6b7280;
}

.ss-summary-cell .v {
    font-size: 13px;
    font-weight: 700;
    margin-top: 1px;
    color: #111827;
}

.ss-item-row {
    display: grid;
    grid-template-columns: 22px 1fr auto;
    gap: 8px;
    align-items: center;
    padding: 8px 10px;
    border-bottom: 1px solid #f1f5f9;
    font-size: 12px;
}

.ss-item-row:last-child {
    border-bottom: 0;
}

.ss-item-row:hover {
    background: #f8fafc;
}

.ss-item-row .item-icon {
    width: 18px;
    height: 18px;
    vertical-align: middle;
}

.ss-item-name {
    font-weight: 600;
    color: #111827;
}

.ss-item-meta {
    margin-top: 2px;
    font-size: 11px;
    color: #64748b;
}

.ss-item-qty {
    text-align: right;
    color: #2563eb;
    font-weight: 800;
    white-space: nowrap;
}

.ss-item-pct {
    display: block;
    font-size: 11px;
    font-weight: 600;
    color: #94a3b8;
}

.ss-empty {
    padding: 36px 12px;
    text-align: center;
    color: #94a3b8;
    font-size: 13px;
}

@media (max-width: 800px) {
    .ss-kpi {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .ss-grid {
        grid-template-columns: 1fr;
        min-height: 0;
    }
}

/* 可卖出 / 库存 / 转服：同「用户管理」浅蓝描边胶囊 */
.profitable-list-btn {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 6px 12px;
    min-height: 28px;
    background: #f0f7fb;
    color: #1f5575;
    border: 1px solid rgba(42, 111, 151, 0.35);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    box-shadow: none;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.profitable-list-btn:hover {
    background: #e4f0f8;
    border-color: rgba(42, 111, 151, 0.55);
    color: #1a2b34;
}

/* 普通会员未开放功能：灰色显示（仍可点击，由权限门提示） */
.item-stat-card.is-viewer-locked {
    opacity: 0.55;
    filter: grayscale(0.35);
    cursor: not-allowed;
}

/* VIP 功能：角标提示解锁档位（按后台权限矩阵） */
[data-vip-feature].has-vip-unlock-hint,
.item-stat-card.has-vip-unlock-hint {
    position: relative;
}
[data-vip-feature][data-vip-unlock]::after,
.item-stat-card[data-vip-unlock]::after {
    content: attr(data-vip-unlock);
    position: absolute;
    top: -7px;
    right: -6px;
    z-index: 2;
    padding: 1px 6px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.02em;
    white-space: nowrap;
    color: #7a4a00;
    background: #fff3e0;
    border: 1px solid rgba(245, 124, 0, 0.35);
    box-shadow: 0 1px 3px rgba(26, 43, 52, 0.08);
    pointer-events: none;
}
[data-vip-feature].is-viewer-locked[data-vip-unlock]::after,
.item-stat-card.is-viewer-locked[data-vip-unlock]::after {
    color: #fff;
    background: #f57c00;
    border-color: rgba(183, 88, 0, 0.45);
}
.item-stat-card[data-vip-unlock]::after {
    top: 6px;
    right: 6px;
}

[data-admin-feature].is-viewer-locked,
.admin-only.is-viewer-locked {
    cursor: not-allowed;
    filter: grayscale(0.9);
    opacity: 0.72;
    box-shadow: none !important;
}
.profitable-list-btn.is-viewer-locked,
.profitable-list-btn.is-viewer-locked:hover,
.log-btn.admin-only.is-viewer-locked,
.log-btn.admin-only.is-viewer-locked:hover,
.profit-analysis-btn.admin-only.is-viewer-locked,
.profit-analysis-btn.admin-only.is-viewer-locked:hover,
.sales-analysis-btn.admin-only.is-viewer-locked,
.sales-analysis-btn.admin-only.is-viewer-locked:hover,
.soft-action-btn.is-viewer-locked,
.soft-action-btn.is-viewer-locked:hover,
.compare-btn.is-viewer-locked,
.compare-btn.is-viewer-locked:hover,
.session-user-admin-btn.admin-only.is-viewer-locked,
.session-user-admin-btn.admin-only.is-viewer-locked:hover,
.refresh-data-btn.is-viewer-locked,
.refresh-data-wrap.is-viewer-locked .refresh-data-btn,
.refresh-data-wrap.is-viewer-locked .refresh-data-btn:hover,
#mainContent .soft-action-btn.is-viewer-locked,
#mainContent .soft-action-btn.is-viewer-locked:hover,
#mainContent .main-actions-wrap > .compare-btn.is-viewer-locked,
#mainContent .main-actions-wrap > .compare-btn.is-viewer-locked:hover,
#mainContent .main-actions-wrap > .profit-analysis-btn.is-viewer-locked,
#mainContent .main-actions-wrap > .profit-analysis-btn.is-viewer-locked:hover,
#mainContent .main-actions-wrap > .sales-analysis-btn.is-viewer-locked,
#mainContent .main-actions-wrap > .sales-analysis-btn.is-viewer-locked:hover,
#mainContent .main-actions-wrap > .log-btn.is-viewer-locked,
#mainContent .main-actions-wrap > .log-btn.is-viewer-locked:hover {
    background: #e8e8e8 !important;
    color: #8c8c8c !important;
    border-color: #d0d0d0 !important;
    filter: none;
    opacity: 1;
    box-shadow: none !important;
}
.filter-btn.is-viewer-locked,
.filter-btn.is-viewer-locked:hover,
.filter-btn.is-viewer-locked.active {
    background: #f0f0f0 !important;
    color: #8c8c8c !important;
    border-color: #d9d9d9 !important;
    filter: none;
    opacity: 1;
}
.refresh-data-wrap.is-viewer-locked {
    filter: grayscale(0.85);
    opacity: 0.75;
    cursor: not-allowed;
}

/* 可卖出列表弹窗遮罩 */
/* ===== 可卖出列表弹窗 ===== */
.profitable-dialog-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(2px);
}

.profitable-dialog {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.25);
    width: 92vw;
    max-width: 1080px;
    max-height: 88vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* 头部 */
.profitable-dialog-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 20px;
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
    flex-shrink: 0;
}
.pd-header-left { display: flex; align-items: baseline; gap: 10px; }
.pd-header-title { font-size: 15px; font-weight: 700; color: #f0c040; letter-spacing: 0.5px; }
.pd-header-sub { font-size: 12px; color: #aaa; }

.profitable-dialog-close {
    background: none;
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: 4px;
    font-size: 18px;
    cursor: pointer;
    color: #aaa;
    line-height: 1;
    padding: 2px 8px;
    transition: all 0.15s;
}
.profitable-dialog-close:hover { color: #fff; border-color: rgba(255,255,255,0.5); background: rgba(255,255,255,0.1); }

/* 内容区 */
.profitable-dialog-body {
    overflow: auto;
    flex: 1;
    background: #f7f8fa;
}

/* 表格 */
.profitable-dialog-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
    table-layout: fixed;
}
.profitable-dialog-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #eef0f5;
    border-bottom: 2px solid #d0d5e0;
    padding: 9px 14px;
    white-space: nowrap;
    color: #444;
    font-weight: 600;
    text-align: left;
    overflow: hidden;
}

/* 分组头行 */
.pd-group-header {
    background: #e8edf5;
    cursor: default;
}
.pd-group-header td { padding: 0; border-top: 8px solid #f7f8fa; }
.pd-group-title {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 14px;
    border-left: 4px solid #1890ff;
}
.pd-group-header.pd-group-gold .pd-group-title  { border-left-color: #fa8c16; background: linear-gradient(90deg, #fff7e6 0%, #e8edf5 55%); }
.pd-group-header.pd-group-great .pd-group-title { border-left-color: #52c41a; background: linear-gradient(90deg, #f6ffed 0%, #e8edf5 55%); }
.pd-group-header.pd-group-good .pd-group-title  { border-left-color: #36cfc9; background: linear-gradient(90deg, #e6fffb 0%, #e8edf5 55%); }
.pd-group-header.pd-group-normal .pd-group-title{ border-left-color: #1890ff; }

.pd-group-icon { width: 22px; height: 22px; object-fit: contain; flex-shrink: 0; }
.pd-group-name { font-size: 14px; font-weight: 700; color: #1a1a2e; }
.pd-group-meta { font-size: 12px; color: #666; background: rgba(0,0,0,0.06); border-radius: 4px; padding: 2px 8px; }
.pd-highlight  { color: #d4380d; }

/* 数据行 */
.pd-data-row td {
    padding: 8px 14px;
    border-bottom: 1px solid #eee;
    background: #fff;
    vertical-align: middle;
    overflow: hidden;
    font-size: 13px;
}
.pd-data-row:hover td { background: #f0f7ff; }

/* 单元格 */
.pd-cell-server { color: #333; white-space: nowrap; overflow: hidden; }
.pd-server-name { display: inline; font-size: 13px; font-weight: 500; margin-right: 6px; }
.pd-server-pill {
    display: inline-block;
    vertical-align: middle;
    padding: 1px 7px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 500;
    white-space: nowrap;
}
.pd-cell-account { color: #333; white-space: nowrap; overflow: hidden; }
.pd-player       { display: inline; font-size: 12px; color: #999; margin-left: 6px; }
.pd-cell-price   { text-align: right; color: #555; white-space: nowrap; font-size: 13px; }
.pd-cur-price    { color: #1a1a2e; font-weight: 700; }
.pd-cell-profit  { text-align: left; white-space: nowrap; overflow: hidden; }
.pd-cell-target  { text-align: center; color: #1890ff; font-weight: 600; white-space: nowrap; }
.pd-cell-qty     { text-align: center; white-space: nowrap; }

/* 盈利徽章 */
.pd-badge {
    display: inline-block;
    border-radius: 4px;
    padding: 2px 8px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.3px;
    white-space: nowrap;
}
.pd-badge-good  { background: #f6ffed; color: #389e0d; border: 1px solid #b7eb8f; }
.pd-badge-great { background: #52c41a; color: #fff; border: 1px solid #389e0d; }
.pd-badge-gold  { background: linear-gradient(90deg, #fa8c16, #fa541c); color: #fff; border: none; box-shadow: 0 1px 5px rgba(250,140,22,0.45); }
.pd-badge-sell  { background: #722ed1; color: #fff; border: none; }

/* 超出目标 */
.pd-surplus { display: inline; font-size: 12px; color: #999; margin-left: 8px; white-space: nowrap; }

/* 数量徽章 */
.pd-qty-badge {
    display: inline-block;
    min-width: 26px;
    text-align: center;
    background: #e6f7ff;
    color: #0958d9;
    border: 1px solid #91caff;
    border-radius: 12px;
    padding: 2px 8px;
    font-size: 13px;
    font-weight: 700;
}

/* 空状态 */
.pd-empty {
    text-align: center;
    padding: 56px;
    color: #bbb;
    font-size: 15px;
    background: #fff;
}

/* 头部总盈利金额 */
.pd-total-profit {
    font-size: 13px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 12px;
    white-space: nowrap;
    letter-spacing: 0.3px;
}
.pd-total-profit-pos { background: rgba(82,196,26,0.18); color: #52c41a; border: 1px solid rgba(82,196,26,0.4); }
.pd-total-profit-neg { background: rgba(255,77,79,0.12); color: #ff4d4f; border: 1px solid rgba(255,77,79,0.3); }

/* 月销量徽章在可卖出弹窗中的微调 */
.pd-sales-badge { margin-left: 4px; font-size: 11px; }

/* 每行预计盈利金额（内联显示） */
.pd-profit-amt {
    font-size: 12px;
    font-weight: 700;
    margin-left: 6px;
    display: inline;
    white-space: nowrap;
}
.pd-profit-amt-pos { color: #52c41a; }
.pd-profit-amt-neg { color: #ff4d4f; }

/* 分组头部盈利金额 */
.pd-profit-sum { color: #52c41a; }

/* 库存盈利表 - 库存数量颜色分级 */
.inv-account-cell {
    font-size: 12px;
    line-height: 1.3;
}
.inv-account-line {
    white-space: nowrap;
}
.inv-count-cell.inv-count-low {
    background-color: rgba(103, 194, 58, 0.12); /* 1-20 绿色背景 */
}
.inv-count-cell.inv-count-mid {
    background-color: rgba(230, 162, 60, 0.16); /* 21-40 橙色背景 */
}
.inv-count-cell.inv-count-high {
    background-color: rgba(245, 108, 108, 0.18); /* 40+ 红色背景 */
}

/* 库存盈利表 - 成本总额颜色分级（按金额大小） */
.inv-cost-cell.inv-cost-low {
    background-color: rgba(144, 147, 153, 0.18); /* 0-2k 灰色偏淡（灰） */
}
.inv-cost-cell.inv-cost-mid-1 {
    background-color: rgba(103, 194, 58, 0.18);  /* 2k-5k 绿色 */
}
.inv-cost-cell.inv-cost-mid-2 {
    background-color: rgba(64, 158, 255, 0.22);  /* 5k-10k 蓝色 */
}
.inv-cost-cell.inv-cost-high {
    background-color: rgba(245, 108, 108, 0.22);  /* 1w+ 红色/橙红 */
}

/* 库存盈利表 - 标题右侧盈利区间汇总 */
.inv-profit-bins {
    display: inline-block;
    margin-left: 12px;
    font-size: 12px;
    color: #e0e5ff;
}
.inv-bin-item {
    margin-left: 8px;
    white-space: nowrap;
}
.inv-bin-label {
    opacity: 0.9;
    margin-right: 2px;
}
.inv-bin-label-neg {
    color: #67c23a; /* 负区间：绿色 */
}
.inv-bin-label-pos {
    color: #f56c6c; /* 正区间：红色 */
}
.inv-bin-count {
    font-weight: 600;
    margin-right: 2px;
}
.inv-bin-change {
    font-size: 11px;
    margin-left: 2px;
}

/* 库存盈利表 - 当前价/当前总 变化箭头 */
.inv-change {
    font-size: 11px;
    margin-left: 4px;
}

/* ===== 转服列表同步结果大弹窗 (tsrd) —— 对齐登录页 boot 暖色体系 ===== */
.tsrd-overlay {
    --tsrd-ink: #4a5f69;
    --tsrd-ink-soft: #5a6d76;
    --tsrd-muted: #8a969c;
    --tsrd-line: rgba(26, 43, 52, 0.12);
    --tsrd-surface: #fffaf3;
    --tsrd-surface-soft: #f7f1ea;
    --tsrd-panel: rgba(255, 252, 247, 0.96);
    --tsrd-accent: #c62828;
    --tsrd-accent-deep: #8e1a1a;
    --tsrd-accent-soft: rgba(198, 40, 40, 0.12);
    --tsrd-ok: #2f6b3a;
    --tsrd-ok-bg: rgba(56, 142, 60, 0.12);
    --tsrd-warn: #b45309;
    --tsrd-warn-bg: rgba(180, 83, 9, 0.12);
    --tsrd-shadow: 0 22px 56px rgba(26, 43, 52, 0.18);
    --tsrd-radius: 14px;
    position: fixed;
    inset: 0;
    z-index: 10100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px;
    box-sizing: border-box;
    background:
        radial-gradient(ellipse 70% 55% at 18% 18%, rgba(198, 40, 40, 0.16), transparent 58%),
        radial-gradient(ellipse 55% 45% at 88% 82%, rgba(180, 120, 60, 0.14), transparent 55%),
        rgba(26, 43, 52, 0.42);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    animation: tsrdOverlayIn 0.28s ease both;
}
@keyframes tsrdOverlayIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.tsrd-dialog {
    position: relative;
    background: var(--tsrd-surface);
    border: 1px solid rgba(255, 255, 255, 0.55);
    border-radius: var(--tsrd-radius);
    box-shadow: var(--tsrd-shadow);
    /* 去掉序号列后略收窄，仍够四列可转入 */
    width: 94vw;
    max-width: 1680px;
    max-height: 90vh;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    /* 与详细信息 / 对比弹窗一致：Noto + 中等粗、灰青字色 */
    font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif;
    color: #5a6d76;
    font-weight: 600;
    font-size: 12px;
    -webkit-font-smoothing: antialiased;
    animation: tsrdDialogIn 0.36s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes tsrdDialogIn {
    from { opacity: 0; transform: translateY(14px) scale(0.985); }
    to { opacity: 1; transform: none; }
}
.tsrd-dialog::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(26, 43, 52, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(26, 43, 52, 0.035) 1px, transparent 1px);
    background-size: 40px 40px;
    opacity: 0.55;
    mask-image: linear-gradient(180deg, rgba(0,0,0,0.55), transparent 42%);
}

/* 头部 */
.tsrd-header {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    padding: 10px 14px 8px;
    background: transparent;
    flex-shrink: 0;
    border-bottom: 1px solid var(--tsrd-line);
}
.tsrd-header-main {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    min-width: 0;
    flex-wrap: nowrap;
}
.tsrd-header-mark {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    flex-shrink: 0;
    background: linear-gradient(145deg, var(--tsrd-accent) 0%, var(--tsrd-accent-deep) 100%);
    box-shadow: 0 8px 18px rgba(198, 40, 40, 0.28);
    position: relative;
}
.tsrd-header-mark::after {
    content: "";
    position: absolute;
    inset: 8px;
    border: 2px solid rgba(255, 255, 255, 0.88);
    border-radius: 3px;
    transform: rotate(12deg);
}
.tsrd-header-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.tsrd-header-title {
    font-family: "Noto Serif SC", "Songti SC", "STSong", "SimSun", serif;
    font-size: 16px;
    font-weight: 700;
    color: #4a5f69;
    letter-spacing: 0.04em;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    line-height: 1.25;
}
.tsrd-header-sub {
    font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
    font-size: 11px;
    font-weight: 500;
    color: var(--tsrd-muted);
    letter-spacing: 0.01em;
}
.tsrd-plan-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    min-width: 0;
}
.tsrd-plan-filter-btn {
    padding: 4px 11px;
    border: 1px solid var(--tsrd-line);
    background: rgba(255, 255, 255, 0.55);
    border-radius: 999px;
    font-size: 12px;
    cursor: pointer;
    color: var(--tsrd-ink-soft);
    line-height: 1.4;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
    white-space: nowrap;
}
.tsrd-plan-filter-btn:hover {
    background: #fff;
    border-color: rgba(198, 40, 40, 0.28);
    color: var(--tsrd-ink);
}
.tsrd-plan-filter-btn.active {
    background: var(--tsrd-accent);
    border-color: var(--tsrd-accent);
    color: #fff;
}
.tsrd-plan-filter-count {
    display: inline-block;
    margin-left: 4px;
    padding: 0 5px;
    font-size: 11px;
    font-weight: 600;
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.08);
    line-height: 1.35;
    vertical-align: middle;
}
.tsrd-plan-filter-btn.active .tsrd-plan-filter-count {
    background: rgba(255, 255, 255, 0.25);
}
.tsrd-plan-time-cd-lock {
    color: var(--tsrd-warn);
    font-weight: 600;
}
.tsrd-plan-time-cell-lock {
    background: #fff7e6;
}
.tsrd-close-btn {
    background: rgba(255, 255, 255, 0.65);
    border: 1px solid var(--tsrd-line);
    border-radius: 10px;
    font-size: 20px;
    cursor: pointer;
    color: var(--tsrd-muted);
    line-height: 1;
    padding: 4px 11px 6px;
    transition: all 0.15s;
    flex-shrink: 0;
}
.tsrd-close-btn:hover {
    color: var(--tsrd-accent);
    border-color: rgba(198, 40, 40, 0.35);
    background: var(--tsrd-accent-soft);
}

/* 状态徽章 */
.tsrd-badge {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    padding: 3px 9px;
    border-radius: 999px;
    vertical-align: middle;
    letter-spacing: 0.02em;
}
.tsrd-badge-ok  { background: var(--tsrd-ok-bg); color: var(--tsrd-ok); }
.tsrd-badge-warn{ background: var(--tsrd-warn-bg); color: var(--tsrd-warn); }

/* 正文区 */
.tsrd-body {
    position: relative;
    z-index: 1;
    overflow-y: auto;
    flex: 1;
    padding: 8px 12px 10px;
    background: transparent;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 0;
}

/* 统计信息行 */
.tsrd-stat-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    background: #fff;
    border: 1px solid #e8eaf0;
    border-radius: 8px;
    padding: 12px 16px;
}
.tsrd-stat-item {
    display: flex;
    flex-direction: column;
    min-width: 120px;
    flex: 1;
}
.tsrd-stat-label {
    font-size: 11px;
    color: #888;
    margin-bottom: 2px;
}
.tsrd-stat-value {
    font-size: 14px;
    font-weight: 600;
    color: #333;
}

/* 改动汇总行 */
.tsrd-diff-summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    background: #fff;
    border: 1px solid #e8eaf0;
    border-radius: 8px;
    padding: 10px 16px;
    font-size: 13px;
    color: #555;
}
.tsrd-divider { color: #ccc; }
.tsrd-num-add b { color: #389e0d; }
.tsrd-num-rem b { color: #cf1322; }
.tsrd-num-chg b { color: #d46b08; }

/* 无变更提示 */
.tsrd-no-change {
    background: #f6ffed;
    border: 1px solid #b7eb8f;
    border-radius: 8px;
    padding: 12px 16px;
    color: #237804;
    font-size: 14px;
    text-align: center;
}

/* 分区块 */
.tsrd-section {
    background: var(--tsrd-panel, rgba(255, 252, 247, 0.96));
    border: 1px solid var(--tsrd-line, rgba(26, 43, 52, 0.12));
    border-radius: 10px;
    overflow: visible;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.7) inset;
}
.tsrd-section-title {
    padding: 7px 12px;
    font-size: 12px;
    font-weight: 600;
    border-bottom: 1px solid var(--tsrd-line, rgba(26, 43, 52, 0.1));
    border-radius: 10px 10px 0 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
    background: rgba(255, 255, 255, 0.45);
    color: var(--tsrd-ink, #1a2b34);
}
.tsrd-section-title-main {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 8px 12px;
}
.tsrd-section-heading {
    font-family: "Noto Serif SC", "Songti SC", "STSong", "SimSun", serif;
    font-size: 13px;
    font-weight: 700;
    color: #4a5f69;
    letter-spacing: 0.04em;
}
.tsrd-section-meta {
    font-family: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
    font-size: 11px;
    font-weight: 500;
    color: var(--tsrd-muted, #8a969c);
}
.tsrd-title-add { background: rgba(56, 142, 60, 0.08); color: #2f6b3a; }
.tsrd-title-rem { background: rgba(198, 40, 40, 0.08); color: #8e1a1a; }
.tsrd-title-chg { background: rgba(255, 255, 255, 0.45); color: var(--tsrd-ink, #1a2b34); }

/* 表格容器：让表格区域独立滚动，表头可吸顶 */
.tsrd-table-wrap {
    overflow-x: auto;
    overflow-y: auto;
    max-height: 420px;
    border-radius: 0 0 14px 14px;
    background: rgba(255, 255, 255, 0.35);
}
.tsrd-body .tsrd-section:last-of-type .tsrd-pending-unlock-table-wrap {
    overflow-x: hidden;
}

/* 让弹窗里的“最后一个大列表”（通常是全量可转入明细）占据更多高度 */
.tsrd-body .tsrd-section:last-of-type {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}
.tsrd-body .tsrd-section:last-of-type .tsrd-table-wrap {
    flex: 1;
    min-height: 0;
    max-height: none;
}

/* 表格 */
.tsrd-table {
    --tsrd-table-fs: 12px;
    width: 100%;
    border-collapse: collapse;
    font-family: inherit;
    font-size: var(--tsrd-table-fs);
    font-weight: 600;
    color: #5a6d76;
    /* auto 布局：浏览器按内容自动计算列宽，
       # 列和转出服务器列自动收窄，可转入列自动撑满剩余空间 */
    table-layout: auto;
}
.tsrd-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #f3ebe3;
    border-bottom: 1px solid rgba(26, 43, 52, 0.1);
    padding: 6px 8px;
    text-align: left;
    font-size: var(--tsrd-table-fs);
    font-weight: 600;
    color: #5a6d76;
    white-space: nowrap;
}
.tsrd-table tbody tr:nth-child(even) { background: rgba(255, 255, 255, 0.38); }
.tsrd-table tbody tr:hover { background: rgba(198, 40, 40, 0.05); }
.tsrd-table td {
    padding: 5px 8px;
    border-bottom: 1px solid rgba(26, 43, 52, 0.06);
    vertical-align: top;
    line-height: 1.3;
    font-size: var(--tsrd-table-fs);
    font-weight: 600;
    color: #5a6d76;
}
/* 表内文字统一字号/字重，避免胶囊与服名大小不一 */
.tsrd-table td *,
.tsrd-table th * {
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
}

.tsrd-planned-transfer-table .tsrd-plan-item,
.tsrd-pending-unlock-table .tsrd-plan-item,
.tsrd-no-target-plan-table .tsrd-plan-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin: 2px 6px 2px 0;
    padding: 2px 6px;
    border-radius: 10px;
    background: #ffffff;
    border: 1px solid #e8eaf0;
    font-size: 12px;
    white-space: nowrap;
}

.tsrd-planned-transfer-table {
    table-layout: fixed;
    width: 100%;
}

.tsrd-planned-transfer-table .tsrd-planned-col-idx {
    width: 22px;
    min-width: 22px;
    max-width: 26px;
}
/* 转服计划表：压缩 # / 转出/转入服务器列 / 计划时间列，把宽度让给可买入价明细（避免胶囊行被截断/利润列换行） */
.tsrd-planned-transfer-table .tsrd-planned-col-out {
    min-width: 88px;
    width: 12%;
}
.tsrd-planned-transfer-table .tsrd-planned-col-in {
    min-width: 88px;
    width: 12%;
}
.tsrd-planned-transfer-table .tsrd-planned-col-time {
    min-width: 100px;
    width: 10%;
}
.tsrd-planned-transfer-table .tsrd-planned-col-detail {
    width: 38%;
    min-width: 280px;
}
.tsrd-planned-transfer-table .tsrd-planned-col-held {
    width: 30%;
    min-width: 260px;
}

.tsrd-planned-transfer-table .tsrd-planned-col-action {
    width: 52px;
    min-width: 52px;
    max-width: 64px;
}

.tsrd-planned-transfer-table thead th:nth-child(1),
.tsrd-planned-transfer-table tbody td:nth-child(1) {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-left: 6px;
    padding-right: 4px;
    text-align: center;
}

.tsrd-planned-transfer-table thead th:nth-child(2),
.tsrd-planned-transfer-table tbody td:nth-child(2) {
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
}

.tsrd-planned-transfer-table thead th:nth-child(3),
.tsrd-planned-transfer-table tbody td:nth-child(3) {
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
}

.tsrd-planned-transfer-table thead th:nth-child(4) {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tsrd-planned-transfer-table tbody td:nth-child(4) {
    white-space: normal;
    overflow: visible;
    vertical-align: top;
    line-height: 1.45;
    font-size: 12px;
}

.tsrd-plan-time-transfer {
    min-width: 0;
}

.tsrd-plan-time-planned {
    color: #cf1322;
    font-weight: 700;
    margin-bottom: 6px;
}

.tsrd-plan-time-cell-ready {
    background: #fff1f0;
    box-shadow: inset 0 0 0 1px #ffccc7;
}

.tsrd-plan-time-cell-left {
    background: #f6ffed;
    box-shadow: inset 0 0 0 1px #b7eb8f;
}

.tsrd-plan-time-cell-ready .tsrd-plan-time-planned {
    color: #cf1322;
}

.tsrd-plan-time-line {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 8px;
    margin-bottom: 4px;
}

.tsrd-plan-time-line:last-child {
    margin-bottom: 0;
}

.tsrd-plan-time-acc {
    color: #1f2937;
    font-weight: 500;
}

.tsrd-plan-time-cd {
    color: #475569;
    font-size: 11px;
    white-space: nowrap;
}

.tsrd-plan-time-cd-warn {
    color: #cf1322;
    font-weight: 600;
}

.tsrd-planned-transfer-table .tsrd-plan-item-profit,
.tsrd-no-target-plan-table .tsrd-plan-item-profit {
    font-size: 12px;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 999px;
    background: rgba(0,0,0,0.04);
    color: #334155;
}

.tsrd-planned-transfer-table .tsrd-plan-item-profit-pos,
.tsrd-no-target-plan-table .tsrd-plan-item-profit-pos {
    background: rgba(22, 163, 74, 0.12);
    color: #166534;
}

.tsrd-planned-transfer-table .tsrd-plan-item-profit-neg,
.tsrd-no-target-plan-table .tsrd-plan-item-profit-neg {
    background: rgba(220, 38, 38, 0.12);
    color: #991b1b;
}

.tsrd-planned-transfer-table .tsrd-plan-item-profit-na,
.tsrd-pending-unlock-table .tsrd-plan-item-profit-na,
.tsrd-no-target-plan-table .tsrd-plan-item-profit-na {
    background: rgba(148, 163, 184, 0.14);
    color: #64748b;
}

.tsrd-planned-transfer-table thead th:nth-child(5),
.tsrd-planned-transfer-table thead th:nth-child(6) {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 10px;
}

.tsrd-planned-transfer-table tbody td:nth-child(5),
.tsrd-planned-transfer-table tbody td:nth-child(6) {
    white-space: normal;
    overflow: visible;
    word-break: break-word;
}

.tsrd-planned-transfer-table thead th:nth-child(7),
.tsrd-planned-transfer-table tbody td:nth-child(7) {
    white-space: nowrap;
    text-align: center;
    vertical-align: middle;
    padding-left: 6px;
    padding-right: 6px;
}

.tsrd-plan-compare-btn {
    padding: 4px 10px;
    font-size: 12px;
    line-height: 1.3;
    border-radius: 999px;
    border: 1px solid rgba(198, 40, 40, 0.35);
    background: rgba(198, 40, 40, 0.08);
    color: #8e1a1a;
    cursor: pointer;
    font-weight: 600;
}

.tsrd-plan-compare-btn:hover {
    background: rgba(198, 40, 40, 0.14);
    border-color: #c62828;
}

.tsrd-plan-compare-btn:active {
    background: rgba(198, 40, 40, 0.2);
}

.tsrd-unlock-profit-pos,
.tsrd-unlock-profit-neg {
    margin-top: 5px;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
}
.tsrd-unlock-profit-pos { color: #cf1322; }
.tsrd-unlock-profit-neg { color: #389e0d; }

/* 转服当日利润行 */
.tsrd-unlock-transfer-day-profit {
    margin-top: 3px;
    font-size: 11px;
    font-weight: 500;
    opacity: 0.85;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    flex-wrap: wrap;
}
.tsrd-unlock-td-label {
    font-size: 10px;
    color: #888;
    font-weight: 400;
    border: 1px solid #ccc;
    border-radius: 2px;
    padding: 0 3px;
    margin-left: 2px;
    white-space: nowrap;
}

.tsrd-planned-transfer-table .tsrd-plan-item-icon,
.tsrd-pending-unlock-table .tsrd-plan-item-icon,
.tsrd-no-target-plan-table .tsrd-plan-item-icon {
    width: 14px;
    height: 14px;
    object-fit: contain;
}

.tsrd-planned-transfer-table .tsrd-plan-item-price,
.tsrd-pending-unlock-table .tsrd-plan-item-price,
.tsrd-no-target-plan-table .tsrd-plan-item-price {
    color: #0f766e;
    font-weight: 600;
}
.tsrd-planned-transfer-table .tsrd-plan-item-buyline-good,
.tsrd-no-target-plan-table .tsrd-plan-item-buyline-good {
    color: #0f766e;
}
.tsrd-planned-transfer-table .tsrd-plan-item-buyline-stale,
.tsrd-no-target-plan-table .tsrd-plan-item-buyline-stale {
    color: #9ca3af;
}

.tsrd-planned-transfer-table .tsrd-plan-item-stock,
.tsrd-pending-unlock-table .tsrd-plan-item-stock,
.tsrd-no-target-plan-table .tsrd-plan-item-stock {
    color: #64748b;
    font-size: 11px;
    font-weight: 500;
}

.tsrd-planned-transfer-table .tsrd-plan-item-margin,
.tsrd-pending-unlock-table .tsrd-plan-item-margin,
.tsrd-no-target-plan-table .tsrd-plan-item-margin {
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}
.tsrd-planned-transfer-table .tsrd-plan-item-margin-pos,
.tsrd-pending-unlock-table .tsrd-plan-item-margin-pos,
.tsrd-no-target-plan-table .tsrd-plan-item-margin-pos {
    color: #0f766e;
}
.tsrd-planned-transfer-table .tsrd-plan-item-margin-neg,
.tsrd-pending-unlock-table .tsrd-plan-item-margin-neg,
.tsrd-no-target-plan-table .tsrd-plan-item-margin-neg {
    color: #cf1322;
}
.tsrd-planned-transfer-table .tsrd-plan-item-margin-hit,
.tsrd-no-target-plan-table .tsrd-plan-item-margin-hit {
    color: #cf1322;
}
.tsrd-planned-transfer-table .tsrd-plan-item-margin-miss,
.tsrd-no-target-plan-table .tsrd-plan-item-margin-miss {
    color: #0f766e;
}
.tsrd-planned-transfer-table .tsrd-plan-item-margin-na,
.tsrd-pending-unlock-table .tsrd-plan-item-margin-na,
.tsrd-no-target-plan-table .tsrd-plan-item-margin-na {
    color: #94a3b8;
    font-weight: 500;
}

.tsrd-planned-transfer-table .tsrd-plan-item-del,
.tsrd-no-target-plan-table .tsrd-plan-item-del {
    margin-left: 4px;
    border: none;
    background: transparent;
    color: #cf1322;
    cursor: pointer;
    font-size: 12px;
    line-height: 1;
    padding: 0 2px;
}

.tsrd-plan-items {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 8px;
    align-items: center;
}

.tsrd-planned-transfer-table .tsrd-plan-item-del:hover {
    color: #ff4d4f;
}

.tsrd-planned-transfer-table .tsrd-plan-item-del:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.tsrd-plan-items-empty {
    color: #94a3b8;
    font-size: 12px;
}

/* 无目标专用表（4 列，避免主表隐藏列导致布局塌陷） */
.tsrd-no-target-plan-table {
    table-layout: fixed;
    width: 100%;
}

.tsrd-no-target-plan-table .tsrd-notarget-col-idx {
    width: 40px;
    min-width: 40px;
    max-width: 48px;
}

.tsrd-no-target-plan-table .tsrd-notarget-col-out-w {
    width: 18%;
    min-width: 130px;
}

.tsrd-no-target-plan-table .tsrd-notarget-col-buy-w {
    width: 36%;
    min-width: 260px;
}

.tsrd-no-target-plan-table .tsrd-notarget-col-held-w {
    width: 46%;
    min-width: 280px;
}

.tsrd-no-target-plan-table thead th,
.tsrd-no-target-plan-table tbody td {
    vertical-align: top;
    line-height: 1.5;
    font-size: 12px;
}

.tsrd-no-target-plan-table thead th:nth-child(1),
.tsrd-no-target-plan-table tbody td:nth-child(1) {
    text-align: center;
    white-space: nowrap;
}

.tsrd-no-target-plan-table tbody td:nth-child(3),
.tsrd-no-target-plan-table tbody td:nth-child(4) {
    white-space: normal;
    overflow: visible;
    word-break: break-word;
}

.tsrd-no-target-plan-table .tsrd-plan-items {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 8px;
    align-items: flex-start;
}

.tsrd-no-target-plan-table .tsrd-plan-item {
    white-space: normal;
    flex-wrap: wrap;
    max-width: 100%;
}

.tsrd-no-target-plan-table .tsrd-plan-item-icon {
    flex-shrink: 0;
}

/* 待解锁列表：div 网格（不要用 table+display:contents，浏览器会把列拆乱）。
   服名/操作按文字宽度，库存列 minmax(0,1fr) 吃掉全部剩余空间。 */
.tsrd-pending-unlock-table {
    display: grid;
    grid-template-columns: 32px 240px 220px minmax(0, 1fr) 152px;
    width: 100%;
    align-items: stretch;
    font-size: 12px;
    font-weight: 600;
    color: #5a6d76;
}
.tsrd-pending-unlock-table .tsrd-unlock-head,
.tsrd-pending-unlock-table .tsrd-unlock-body,
.tsrd-pending-unlock-table .tsrd-unlock-row {
    display: contents;
}
.tsrd-pending-unlock-table .tsrd-unlock-head > * {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #f3ebe3;
    border-bottom: 1px solid rgba(26, 43, 52, 0.1);
    padding: 6px 8px;
    text-align: left;
    font-size: 12px;
    font-weight: 600;
    color: #5a6d76;
    white-space: nowrap;
}
.tsrd-pending-unlock-table .tsrd-unlock-head > *,
.tsrd-pending-unlock-table .tsrd-unlock-row > * {
    min-width: 0;
}
.tsrd-pending-unlock-table .tsrd-unlock-row > * {
    padding: 6px 8px;
    border-bottom: 1px solid rgba(26, 43, 52, 0.06);
    line-height: 1.45;
}
.tsrd-pending-unlock-table .tsrd-unlock-row:nth-child(even) > * {
    background: rgba(255, 255, 255, 0.38);
}
.tsrd-pending-unlock-table .tsrd-unlock-row:hover > * {
    background: rgba(198, 40, 40, 0.05);
}
.tsrd-pending-unlock-table .tsrd-unlock-col-current,
.tsrd-pending-unlock-table .tsrd-unlock-col-prev {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 10px;
}
.tsrd-pending-unlock-table .tsrd-unlock-col-inv {
    min-width: 0;
    overflow: hidden;
}
.tsrd-pending-unlock-table .tsrd-plan-action-cell {
    white-space: normal;
    text-align: center;
    padding-left: 8px;
    padding-right: 8px;
}
.tsrd-pending-unlock-table .tsrd-plan-action-cell .tsrd-plan-compare-btn {
    display: inline-block;
}
.tsrd-pending-unlock-table .tsrd-unlock-empty-row,
.tsrd-pending-unlock-table .tsrd-unlock-filter-empty-row {
    grid-column: 1 / -1;
    text-align: center;
    color: #777;
    padding: 18px;
}

/* 库存迷你表铺满库存列，7 列按比例均分，避免数字挤在右侧 */
.tsrd-pending-unlock-table .tsrd-inv-table {
    width: 100%;
    table-layout: fixed;
}
.tsrd-pending-unlock-table .tsrd-inv-table thead th,
.tsrd-pending-unlock-table .tsrd-inv-table td {
    min-width: 0 !important;
    width: auto;
    box-sizing: border-box;
    overflow: hidden;
    text-overflow: ellipsis;
}
.tsrd-pending-unlock-table .tsrd-inv-table thead th:nth-child(1),
.tsrd-pending-unlock-table .tsrd-inv-table td:nth-child(1) { width: 22%; }
.tsrd-pending-unlock-table .tsrd-inv-table thead th:nth-child(2),
.tsrd-pending-unlock-table .tsrd-inv-table td:nth-child(2) { width: 13%; }
.tsrd-pending-unlock-table .tsrd-inv-table thead th:nth-child(3),
.tsrd-pending-unlock-table .tsrd-inv-table td:nth-child(3) { width: 13%; }
.tsrd-pending-unlock-table .tsrd-inv-table thead th:nth-child(4),
.tsrd-pending-unlock-table .tsrd-inv-table td:nth-child(4) { width: 12%; }
.tsrd-pending-unlock-table .tsrd-inv-table thead th:nth-child(5),
.tsrd-pending-unlock-table .tsrd-inv-table td:nth-child(5) { width: 13%; }
.tsrd-pending-unlock-table .tsrd-inv-table thead th:nth-child(6),
.tsrd-pending-unlock-table .tsrd-inv-table td:nth-child(6) { width: 10%; }
.tsrd-pending-unlock-table .tsrd-inv-table thead th:nth-child(7),
.tsrd-pending-unlock-table .tsrd-inv-table td:nth-child(7) { width: 17%; }
.tsrd-pending-unlock-table .tsrd-inv-table thead th.tsrd-inv-th-num,
.tsrd-pending-unlock-table .tsrd-inv-table td.tsrd-inv-td-cost,
.tsrd-pending-unlock-table .tsrd-inv-table td.tsrd-inv-td-buy,
.tsrd-pending-unlock-table .tsrd-inv-table td.tsrd-inv-td-cur,
.tsrd-pending-unlock-table .tsrd-inv-table td.tsrd-inv-td-profit,
.tsrd-pending-unlock-table .tsrd-inv-table td.tsrd-inv-td-margin,
.tsrd-pending-unlock-table .tsrd-inv-table td.tsrd-inv-td-total-profit,
.tsrd-pending-unlock-table .tsrd-inv-table td.tsrd-inv-td-qty,
.tsrd-pending-unlock-table .tsrd-inv-table td.tsrd-inv-td-remain {
    padding-left: 8px;
    padding-right: 8px;
    white-space: nowrap;
}

.tsrd-unlock-acc-label {
    margin-top: 4px;
    color: #64748b;
    font-size: 11px;
    line-height: 1.35;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── 转服计划明细：内嵌迷你表格 ─────────────────────────── */
.tsrd-inv-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    /* 自动布局：让「道具名」列按内容自适应（white-space: nowrap 配合），不省略长道具名。
       整张表按最宽内容伸展；超出外层明细列时由外层 td 的 overflow:visible 水平溢出显示。 */
    table-layout: auto;
}
.tsrd-inv-table thead th {
    background: #f5f6fa;
    color: #8c94a4;
    font-weight: 500;
    font-size: 11px;
    padding: 3px 8px;
    border-bottom: 1px solid #e8eaf0;
    border-top: 1px solid #e8eaf0;
    white-space: nowrap;
    text-align: right;
    width: auto;
    /* 与单元格一致：超出列宽直接溢出，不省略（用户要求） */
    overflow: visible;
}
.tsrd-inv-table thead th.tsrd-inv-th-name {
    text-align: left;
    /* 道具列：不省略——table-layout: auto 下让列按内容自适应，min-width 给个保底值（配合 white-space: nowrap 不会换行） */
    width: auto;
    min-width: 0;
}
.tsrd-inv-table thead th.tsrd-inv-th-num {
    width: 66px;
    min-width: 66px;
}
.tsrd-inv-table .tsrd-inv-row td {
    padding: 3px 8px;
    border-bottom: 1px solid #f4f4f4;
    /* 不换行：超出列宽时直接溢出显示，不省略 */
    white-space: nowrap;
    text-align: right;
    vertical-align: middle;
    line-height: 1.5;
    overflow: visible;
}
.tsrd-inv-table .tsrd-inv-row:last-child td {
    border-bottom: none;
}
.tsrd-inv-td-name {
    text-align: left !important;
    /* 不省略：让长道具名完整显示，超出列宽直接溢出 */
    overflow: visible;
    text-overflow: clip;
}
.tsrd-inv-td-name .tsrd-plan-item-icon {
    vertical-align: middle;
    margin-right: 4px;
}
.tsrd-inv-td-cost,
.tsrd-inv-td-buy,
.tsrd-inv-td-cur { width: 66px; min-width: 66px; font-weight: 600; color: #0f766e; white-space: nowrap; }
.tsrd-inv-td-profit { width: 66px; min-width: 66px; font-weight: 600; white-space: nowrap; }
.tsrd-inv-td-margin { width: 66px; min-width: 66px; font-weight: 600; white-space: nowrap; }
.tsrd-inv-td-total-profit { width: 66px; min-width: 66px; font-weight: 600; white-space: nowrap; }
.tsrd-inv-td-qty { width: 44px; min-width: 44px; color: #64748b; font-size: 11px; white-space: nowrap; text-align: center !important; }
.tsrd-inv-td-remain { width: 58px; min-width: 58px; color: #b45309; font-size: 11px; white-space: nowrap; text-align: center !important; }
.tsrd-inv-td-del { width: 22px; min-width: 22px; text-align: center !important; }
.tsrd-inv-table .tsrd-inv-player-row td {
    padding: 5px 8px 2px;
    color: #94a3b8;
    font-style: italic;
    font-size: 11px;
    background: #fafbfc;
    border-bottom: 1px solid #eff1f5;
    text-align: left;
}
/* section 标签：出现在多分组上方 */
.tsrd-plan-held-wrap { display: flex; flex-direction: column; gap: 8px; }
.tsrd-plan-buy-wrap  { display: flex; flex-direction: column; gap: 6px; }
.tsrd-inv-section { display: flex; flex-direction: column; }
.tsrd-inv-section-label {
    font-size: 11px;
    color: #8c94a4;
    font-weight: 500;
    padding: 2px 8px 3px;
    background: #f0f2f7;
    border-top: 1px solid #e8eaf0;
    border-left: 1px solid #e8eaf0;
    border-right: 1px solid #e8eaf0;
    border-radius: 3px 3px 0 0;
}
/* 兼容旧颜色类（价格比较色）*/
.tsrd-inv-table .tsrd-unlock-price-high { color: #cf1322; font-weight: 600; }
.tsrd-inv-table .tsrd-unlock-price-low  { color: #94a3b8; font-weight: 500; }
.tsrd-inv-table .tsrd-plan-item-buyline-stale { color: #9ca3af; }
.tsrd-inv-table .tsrd-plan-item-buyline-good  { color: #0f766e; }
/* 利润率色 */
.tsrd-inv-table .tsrd-plan-item-margin-pos,
.tsrd-inv-table .tsrd-unlock-margin-hit  { color: #722ed1; }
.tsrd-inv-table .tsrd-plan-item-margin-neg,
.tsrd-inv-table .tsrd-unlock-margin-miss { color: #cf1322; }
.tsrd-inv-table .tsrd-unlock-margin-loss { color: #95de64; }
.tsrd-inv-table .tsrd-plan-item-margin-na,
.tsrd-inv-table .tsrd-plan-item-profit-na { color: #94a3b8; font-weight: 400; }
/* 待解锁迷你表：市价/利润率 与昨日对比的涨跌箭头（上涨红、下跌绿；只染箭头，不影响数字原色） */
.tsrd-inv-table .tsrd-inv-trend-arrow { font-size: 10px; font-weight: 700; margin-left: 3px; vertical-align: 1px; }
.tsrd-inv-table .tsrd-inv-trend-up   { color: #cf1322; }     /* 上涨：红色 */
.tsrd-inv-table .tsrd-inv-trend-up::before   { content: "▲"; }
.tsrd-inv-table .tsrd-inv-trend-down { color: #16a34a; }     /* 下跌：绿色 */
.tsrd-inv-table .tsrd-inv-trend-down::before { content: "▼"; }
/* 利润额色 */
.tsrd-inv-table .tsrd-plan-item-profit-pos { color: #166534; }
.tsrd-inv-table .tsrd-plan-item-profit-neg { color: #991b1b; }
/* 总利润列：正利润红色（盈利），负利润绿色（亏损），符合游戏惯例 */
.tsrd-inv-table .tsrd-inv-tprofit-pos { color: #cf1322; font-weight: 700; }
.tsrd-inv-table .tsrd-inv-tprofit-neg { color: #16a34a; font-weight: 700; }
/* ── 以下旧 flex 容器样式保留兼容，实际已不产生输出 ── */
.tsrd-unlock-inv-items { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }

.tsrd-pending-unlock-table .tsrd-plan-item-unlock-remain {
    color: #b45309;
    font-size: 11px;
}

/* 待解锁库存颜色已统一迁移至 .tsrd-inv-table 规则 */

.tsrd-plan-server-lists {
    background: #fff;
    border: 1px solid #e8eaf0;
    border-radius: 8px;
    padding: 8px 12px;
}

.tsrd-plan-server-list-line {
    font-size: 12px;
    color: #475569;
    line-height: 1.5;
    margin-bottom: 4px;
}

.tsrd-plan-server-list-line:last-child {
    margin-bottom: 0;
}

/* 转服计划：多角色时分层展开（已迁移至 tsrd-inv-table/tsrd-inv-section 体系） */
.tsrd-planned-transfer-table .tsrd-held-players-wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 6px;
}
.tsrd-planned-transfer-table .tsrd-held-player-nested {
    margin-left: 0;
}

/* 大表格（全量可转入明细）：更紧凑的列宽与行高 */
.tsrd-servers-table {
    table-layout: fixed; /* 固定布局让“转出服务器列”更可控 */
}
/* 转出服务器列：去掉序号后略加宽，便于读服名 */
.tsrd-servers-table .tsrd-col-out {
    width: 12%;
    min-width: 120px;
}
/* 可转入服务器列：占满剩余宽度 */
.tsrd-servers-table .tsrd-col-targets {
    width: auto;
}
.tsrd-servers-table thead th {
    padding: 4px 8px;
    font-size: var(--tsrd-table-fs, 12px);
}
.tsrd-servers-table .tsrd-th-targets {
    vertical-align: bottom;
    padding: 4px 6px 5px;
    font-weight: 600;
    line-height: 1.2;
}
.tsrd-th-targets-line1 {
    margin-bottom: 3px;
    font-size: 12px;
    font-weight: 600;
}
.tsrd-sort-btns {
    display: flex;
    flex-wrap: wrap;
    gap: 3px 5px;
    justify-content: flex-start;
    align-items: center;
}
.tsrd-sort-btn {
    font-size: 11px;
    line-height: 1.15;
    padding: 2px 7px;
    border: 1px solid var(--tsrd-line, rgba(26, 43, 52, 0.14));
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.7);
    color: var(--tsrd-ink-soft, #3d5560);
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.tsrd-sort-btn:hover {
    border-color: rgba(198, 40, 40, 0.35);
    color: var(--tsrd-accent, #c62828);
    background: rgba(198, 40, 40, 0.06);
}
.tsrd-sort-btn--active {
    border-color: var(--tsrd-accent, #c62828);
    background: var(--tsrd-accent, #c62828);
    color: #fff;
    font-weight: 700;
}
.tsrd-servers-table td {
    padding: 3px 6px;
    line-height: 1.25;
}
.tsrd-servers-table .tsrd-server-pill {
    line-height: 1.15;
    font-size: 9px;
    padding: 0 4px;
    margin-right: 3px;
}
.tsrd-servers-table .tsrd-server-entry {
    margin: 0;
    padding: 1px 4px 1px 3px;
    font-size: 11px;
}
/* #列：窄而居中（大表内由 col 再压窄） */
.tsrd-idx {
    width: 20px;
    max-width: 24px;
    text-align: center;
    color: #aaa;
    font-size: 11px;
}
.tsrd-servers-table .tsrd-idx {
    width: 18px;
    max-width: 24px;
    padding-left: 2px;
    padding-right: 2px;
    box-sizing: border-box;
}
/* 转出服务器列：不折行，宽度由内容自动撑开 */
.tsrd-server-name {
    white-space: nowrap;
    font-weight: 600;
    color: #5a6d76;
    padding-right: 14px; /* 与可转入列保持间距 */
}
/* 可转入列：内部四列网格，每格一条「服务器+利润胶囊」 */
.tsrd-targets {
    word-break: break-word;
    overflow-wrap: break-word;
    vertical-align: top;
}
.tsrd-targets-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 4px 8px;
    align-items: start;
}
.tsrd-targets-grid .tsrd-server-entry {
    display: block;
    margin: 0;
    min-width: 0;
    box-sizing: border-box;
}
.tsrd-servers-table .tsrd-targets-grid .tsrd-server-entry {
    padding: 2px 5px 2px 4px;
    font-size: var(--tsrd-table-fs, 12px);
    font-weight: 600;
    line-height: 1.25;
    border-radius: 6px;
}

/* 标签 */
.tsrd-tag {
    display: inline-block;
    font-size: 11px;
    padding: 1px 6px;
    border-radius: 4px;
    margin: 2px 3px 2px 0;
    white-space: nowrap;
}
.tsrd-tag-add { background: #d9f7be; color: #237804; border: 1px solid #b7eb8f; }
.tsrd-tag-rem { background: #fff1f0; color: #a8071a; border: 1px solid #ffa39e; }
.tsrd-none { color: #ccc; font-size: 12px; }

/* 数据源 */
.tsrd-source {
    font-size: 11px;
    color: var(--tsrd-muted, #6b808a);
    text-align: right;
    padding: 2px 4px;
}
.tsrd-source a { color: var(--tsrd-accent, #c62828); text-decoration: none; }
.tsrd-source a:hover { text-decoration: underline; }

/* 底部按钮区 */
.tsrd-footer {
    position: relative;
    z-index: 1;
    padding: 8px 14px;
    background: rgba(255, 255, 255, 0.4);
    border-top: 1px solid var(--tsrd-line, rgba(26, 43, 52, 0.1));
    display: flex;
    justify-content: flex-end;
    flex-shrink: 0;
}
.tsrd-btn-ok {
    background: linear-gradient(135deg, var(--tsrd-accent, #c62828), var(--tsrd-accent-deep, #8e1a1a));
    color: #fff;
    border: none;
    border-radius: 999px;
    padding: 6px 22px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    cursor: pointer;
    box-shadow: 0 6px 14px rgba(198, 40, 40, 0.24);
    transition: transform 0.15s, box-shadow 0.15s, filter 0.15s;
}
.tsrd-btn-ok:hover {
    filter: brightness(1.05);
    box-shadow: 0 10px 22px rgba(198, 40, 40, 0.34);
}
.tsrd-btn-ok:active {
    transform: translateY(1px);
}

/* 转出服务器列：auto 布局下无需设宽，由内容自动撑开 */
.tsrd-col-out {
    width: auto;
}

/* 转出服务器名（带胶囊） */
.tsrd-out-name {
    font-weight: 600;
    color: #5a6d76;
    vertical-align: middle;
}

/* 开服状态胶囊（复用 server-* 类，尺寸微调） */
.tsrd-server-pill {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    padding: 1px 5px;
    border-radius: 3px;
    margin-right: 4px;
    vertical-align: middle;
    white-space: nowrap;
    line-height: 1.35;
}

/* 每个可转入服务器条目（可选利润气泡 + 胶囊 + 名称；利润在文档流最前，避免与表格 padding 规则冲突） */
.tsrd-server-entry {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin: 2px 4px 2px 0;
    padding: 4px 8px 4px 6px;
    border-radius: 10px;
    font-family: inherit;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
    vertical-align: middle;
    position: relative;
    cursor: pointer;
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.65) inset;
}
.tsrd-server-entry:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(26, 43, 52, 0.08);
}
/* 新增：绿底 */
.tsrd-entry-add {
    background: rgba(56, 142, 60, 0.1);
    border: 1px solid rgba(56, 142, 60, 0.28);
    color: #2f6b3a;
}
/* 移除：红底 */
.tsrd-entry-rem {
    background: rgba(198, 40, 40, 0.08);
    border: 1px solid rgba(198, 40, 40, 0.28);
    color: #8e1a1a;
}
/* 不变：中性底 */
.tsrd-entry-unchanged {
    background: rgba(26, 43, 52, 0.04);
    border: 1px solid rgba(26, 43, 52, 0.12);
    color: #1a2b34;
}

/* 计划转入 / 账号曾互转：在服务器名后以行内文案展示（与 data-has-plan 联动，不再使用 ::after 角标以免重复） */
.tsrd-plan-inline-suffix {
    font-size: 11px;
    font-weight: 600;
    color: #237804;
    margin-left: 2px;
    white-space: nowrap;
}
.tsrd-history-inline-suffix {
    font-size: 11px;
    font-weight: 600;
    color: #722ed1;
    margin-left: 2px;
    white-space: nowrap;
}

/* 月销售量区间：用于区分“可转入服务器”胶囊底色 */
.tsrd-servers-table .tsrd-entry-sales-gray,
.tsrd-server-entry.tsrd-entry-sales-gray {
    background: rgba(255, 255, 255, 0.72) !important;
    border: 1px solid rgba(26, 43, 52, 0.12) !important;
    color: #4a5f68 !important;
}

.tsrd-servers-table .tsrd-entry-sales-green,
.tsrd-server-entry.tsrd-entry-sales-green {
    background: rgba(56, 142, 60, 0.1) !important;
    border: 1px solid rgba(56, 142, 60, 0.3) !important;
    color: #2f6b3a !important;
}

.tsrd-servers-table .tsrd-entry-sales-orange,
.tsrd-server-entry.tsrd-entry-sales-orange {
    background: rgba(180, 83, 9, 0.1) !important;
    border: 1px solid rgba(180, 83, 9, 0.32) !important;
    color: #9a3412 !important;
}

.tsrd-servers-table .tsrd-entry-sales-red,
.tsrd-server-entry.tsrd-entry-sales-red {
    background: rgba(198, 40, 40, 0.1) !important;
    border: 1px solid rgba(198, 40, 40, 0.32) !important;
    color: #8e1a1a !important;
}

/* 服务器名文字部分 */
.tsrd-entry-name {
    font-size: inherit;
    font-weight: 600;
    vertical-align: middle;
}
/* 转服同步弹窗：服务器名后的全道具月销量数字（与弹窗内月销分级同源：最近30数据日 trade_count） */
.tsrd-monthly-sum {
    font-size: 11px;
    font-weight: 500;
    color: #8c8c8c;
    margin-left: 2px;
    vertical-align: middle;
    white-space: nowrap;
}
.tsrd-server-entry.tsrd-entry-sales-gray .tsrd-monthly-sum { color: #8c8c8c; }
.tsrd-server-entry.tsrd-entry-sales-green .tsrd-monthly-sum { color: #389e0d; }
.tsrd-server-entry.tsrd-entry-sales-orange .tsrd-monthly-sum { color: #d46b08; }
.tsrd-server-entry.tsrd-entry-sales-red .tsrd-monthly-sum { color: #cf1322; }
/* 新增可转出服务器列表中的服务器名 */
.tsrd-entry-add-name  { color: #237804; font-weight: 600; }
/* 移除可转出服务器列表中的服务器名 */
.tsrd-entry-rem-name  { color: #a8071a; font-weight: 600; }

/* 利润气泡并排（转出→转入 绿 / 转入→转出 红）；参与 flex 文档流，保证表格内也能完整显示 */
/* 选中入利/回利/入潜/回潜排序后：条目横向排布，并展示当前维度携带道具图标 */
.tsrd-targets-grid.tsrd-metric-view-active .tsrd-server-entry {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 3px;
    white-space: normal;
}
.tsrd-entry-item-icons {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1px;
    max-width: 100%;
    vertical-align: middle;
}
.tsrd-entry-item-icon {
    width: 14px;
    height: 14px;
    object-fit: contain;
    flex-shrink: 0;
    border-radius: 2px;
}
.tsrd-entry-item-more {
    font-size: 9px;
    color: #8c8c8c;
    line-height: 14px;
    margin-left: 1px;
    white-space: nowrap;
}
.tsrd-profit-badges-wrap {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 2px;
    flex-wrap: wrap;
    flex-shrink: 0;
    margin-right: 1px;
}
.tsrd-profit-badges-wrap .tsrd-profit-badge {
    display: inline-block;
    min-width: 3.2em;
    text-align: center;
    box-sizing: border-box;
}
.tsrd-profit-badge {
    position: static;
    font-family: inherit;
    font-size: 11px;
    line-height: 1.2;
    padding: 1px 5px;
    border-radius: 4px;
    border: 1px solid transparent;
    background: rgba(26, 43, 52, 0.06);
    color: #5a6d76;
    font-weight: 600;
}
.tsrd-profit-up {
    background: rgba(56, 142, 60, 0.12);
    border-color: rgba(56, 142, 60, 0.28);
    color: #2f6b3a;
}
.tsrd-profit-none {
    background: rgba(198, 40, 40, 0.1);
    border-color: rgba(198, 40, 40, 0.28);
    color: #8e1a1a;
}
/* 转入→转出方向（红系，与绿色区分） */
.tsrd-profit-rev-up {
    background: rgba(198, 40, 40, 0.1);
    border-color: rgba(198, 40, 40, 0.28);
    color: #8e1a1a;
}
.tsrd-profit-rev-none {
    background: rgba(26, 43, 52, 0.04);
    border-color: rgba(26, 43, 52, 0.12);
    color: #6b808a;
}
.tsrd-legend-unreal {
    color: var(--tsrd-ink-soft, #3d5560);
    font-weight: 600;
}
.tsrd-profit-unreal {
    box-shadow: 0 0 0 1px rgba(26, 43, 52, 0.35);
}
/* 父级月销胶囊对 color 使用 !important，利润胶囊需单独夺回前景色（与内联 !important 双保险） */
.tsrd-server-entry[class*="tsrd-entry-sales-"] .tsrd-profit-badges-wrap .tsrd-profit-badge {
    -webkit-text-fill-color: currentColor;
}
/* 转服弹窗：生成明细时的 loading */
.tsrd-body-loading .tsrd-loading-panel {
    text-align: center;
    padding: 36px 16px 40px;
    color: var(--tsrd-ink, #1a2b34);
}
.tsrd-loading-spinner {
    width: 34px;
    height: 34px;
    margin: 0 auto 14px;
    border: 3px solid rgba(198, 40, 40, 0.15);
    border-top-color: var(--tsrd-accent, #c62828);
    border-radius: 50%;
    animation: tsrd-spin 0.75s linear infinite;
}
@keyframes tsrd-spin {
    to { transform: rotate(360deg); }
}
.tsrd-loading-text {
    font-size: 14px;
    font-weight: 600;
    margin: 0 0 6px;
    color: var(--tsrd-ink, #1a2b34);
}
.tsrd-loading-sub {
    font-size: 12px;
    color: var(--tsrd-muted, #6b808a);
    margin: 0;
}

/* 市场潜在（不计库存，同携带上限贪心） */
.tsrd-profit-potential {
    background: rgba(109, 40, 217, 0.1);
    border-color: rgba(109, 40, 217, 0.28);
    color: #5b21b6;
}
/* 潜在·转入→转出 */
.tsrd-profit-potential-rev {
    background: rgba(180, 83, 9, 0.1);
    border-color: rgba(180, 83, 9, 0.3);
    color: #9a3412;
}

/* 图例行 */
.tsrd-legend {
    float: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 8px;
    font-size: 11px;
    font-weight: 500;
    color: var(--tsrd-muted, #6b808a);
}
.tsrd-legend-item {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 1px 6px 1px 5px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.55);
    border: 1px solid rgba(26, 43, 52, 0.08);
}
.tsrd-legend-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #9aa8b0;
    flex-shrink: 0;
    display: inline-block;
}
.tsrd-legend-item.tsrd-entry-sales-gray .tsrd-legend-dot { background: #9aa8b0; }
.tsrd-legend-item.tsrd-entry-sales-green .tsrd-legend-dot { background: #389e0d; }
.tsrd-legend-item.tsrd-entry-sales-orange .tsrd-legend-dot { background: #d46b08; }
.tsrd-legend-item.tsrd-entry-sales-red .tsrd-legend-dot { background: #c62828; }
.tsrd-legend-dot-unreal {
    border-radius: 2px;
    background: #2d2d2d;
}

/* 有变化的行 - 左侧高亮边条 */
.tsrd-row-changed > td:first-child {
    border-left: 3px solid var(--tsrd-warn, #b45309);
    padding-left: 9px;
}
.tsrd-row-changed {
    background: rgba(180, 83, 9, 0.06) !important;
}
.tsrd-row-changed:hover {
    background: rgba(180, 83, 9, 0.1) !important;
}

/* 搜索框 */
.tsrd-search-bar {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 6px 12px 8px;
    background: transparent;
    border-bottom: 1px solid var(--tsrd-line, rgba(26, 43, 52, 0.1));
    flex-shrink: 0;
}
.tsrd-search-icon {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    border: 2px solid var(--tsrd-muted, #6b808a);
    border-radius: 50%;
    position: relative;
    opacity: 0.7;
    box-sizing: border-box;
}
.tsrd-search-icon::after {
    content: "";
    position: absolute;
    width: 7px;
    height: 2px;
    background: var(--tsrd-muted, #6b808a);
    right: -5px;
    bottom: -1px;
    transform: rotate(45deg);
    border-radius: 1px;
}
.tsrd-search-input {
    flex: 1;
    padding: 6px 10px;
    border: 1px solid var(--tsrd-line, rgba(26, 43, 52, 0.14));
    border-radius: 8px;
    font-family: inherit;
    font-size: 12px;
    font-weight: 500;
    outline: none;
    transition: border-color 0.15s, box-shadow 0.15s;
    min-width: 0;
    background: rgba(255, 255, 255, 0.72);
    color: #5a6d76;
}
.tsrd-search-input::placeholder {
    color: #8a9aa3;
}
.tsrd-search-input:focus {
    border-color: var(--tsrd-accent, #c62828);
    box-shadow: 0 0 0 3px var(--tsrd-accent-soft, rgba(198, 40, 40, 0.12));
}
.tsrd-search-count {
    font-size: 12px;
    color: var(--tsrd-muted, #6b808a);
    white-space: nowrap;
}
.tsrd-search-clear {
    border: 1px solid var(--tsrd-line, rgba(26, 43, 52, 0.14));
    background: rgba(255, 255, 255, 0.65);
    color: var(--tsrd-ink-soft, #3d5560);
    border-radius: 999px;
    padding: 5px 12px;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.15s;
}
.tsrd-search-clear:hover {
    color: var(--tsrd-accent, #c62828);
    border-color: rgba(198, 40, 40, 0.35);
    background: var(--tsrd-accent-soft, rgba(198, 40, 40, 0.12));
}

.tsrd-cat-buttons {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    flex: 1 0 100%;
    padding-top: 2px;
}
.tsrd-cat-btn {
    padding: 4px 10px;
    border: 1px solid var(--tsrd-line, rgba(26, 43, 52, 0.16));
    background: #fff;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    color: #5a6d76;
    white-space: nowrap;
    line-height: 1.3;
}
.tsrd-cat-btn:hover {
    border-color: var(--tsrd-accent, #c62828);
    color: var(--tsrd-accent, #c62828);
}
.tsrd-cat-btn.is-active {
    background: var(--tsrd-accent, #c62828);
    border-color: var(--tsrd-accent, #c62828);
    color: #fff;
    font-weight: 600;
}

/* 搜索高亮行 */
.tsrd-row-highlight {
    background: #fffbe6 !important;
    outline: 1px solid #ffc53d;
}

/* 变更角标 */
.tsrd-change-badge {
    display: inline-block;
    font-size: 10px;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 999px;
    background: rgba(180, 83, 9, 0.12);
    color: #b45309;
    border: 1px solid rgba(180, 83, 9, 0.28);
    margin-left: 5px;
    vertical-align: middle;
    white-space: nowrap;
}

/* ===== 道具买卖记录弹窗（tooltip「查看」） ===== */
.item-trade-log-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 1000000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.item-trade-log-dialog {
    /* 双表各约 7 列（含卖出用时），原 980px 会导致右侧表横向滚动；加宽使「卖出用时」整列可见 */
    width: min(1480px, 99vw);
    max-height: 92vh;
    overflow: auto;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 12px 36px rgba(0, 0, 0, 0.3);
}
.item-trade-log-header {
    position: sticky;
    top: 0;
    z-index: 2;
    background: linear-gradient(180deg, #f4f8ff, #eef5ff);
    border-bottom: 1px solid #dce8ff;
    padding: 10px 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.item-trade-log-title {
    font-weight: 700;
    color: #1f3a5f;
    font-size: 20px;
}
.item-trade-log-header .item-log-close-btn {
    border: 1px solid #b7d6ff;
    background: #fff;
    color: #1d4f91;
    border-radius: 4px;
    padding: 2px 10px;
    cursor: pointer;
}
.item-trade-log-body {
    padding: 12px 14px;
}
.item-trade-log-source {
    margin-bottom: 10px;
    color: #666;
    font-size: 12px;
}
.item-trade-log-loading {
    padding: 18px 0;
    color: #888;
}
.item-trade-log-stats {
    display: grid;
    grid-template-columns: repeat(6, minmax(130px, 1fr));
    gap: 8px;
    margin-bottom: 12px;
    padding: 10px 12px;
    background: #eef5ff;
    border-radius: 8px;
}
.item-trade-log-stat {
    display: flex;
    align-items: baseline;
    gap: 8px;
    color: #4f5f73;
    font-size: 13px;
}
.item-trade-log-stat b {
    color: #0f62d1;
    font-size: 18px;
}
.item-trade-log-stat b.is-buy { color: #0050b3; }
.item-trade-log-stat b.is-sell { color: #389e0d; }
.item-trade-log-grid {
    display: grid;
    /* 右侧多一列「卖出用时」，略多给右卡宽度 */
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr);
    gap: 10px;
}
.item-trade-log-card {
    border: 1px solid #e7eefc;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
}
.item-trade-log-card-title {
    font-weight: 700;
    color: #1f2d3d;
    padding: 9px 10px;
    border-bottom: 1px solid #edf2ff;
    background: #f8fbff;
}
.item-trade-log-table-wrap {
    max-height: 58vh;
    overflow: auto;
}
.item-trade-log-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}
.item-trade-log-table thead {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #f6faff;
}
.item-trade-log-table th,
.item-trade-log-table td {
    text-align: left;
    padding: 5px;
    border-bottom: 1px solid #f0f3fa;
    vertical-align: middle;
}
.item-trade-log-table td.is-num,
.item-trade-log-table th.is-num {
    text-align: right;
    white-space: nowrap;
    padding-left: 2px;
    padding-right: 4px;
}
.item-trade-log-table td.item-trade-role-cell {
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
    color: #3d4f63;
}
/* 卖出表：数量列收窄 */
.item-trade-log-table-sell th.col-qty-tight,
.item-trade-log-table-sell td.col-qty-tight {
    width: 26px;
    max-width: 34px;
    padding-left: 0;
    padding-right: 2px;
    font-variant-numeric: tabular-nums;
}
.item-trade-log-table-sell td.profit-margin-td {
    padding-right: 4px;
    vertical-align: middle;
}
.item-trade-log-table-sell .profit-margin-cell {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
/* 卖出记录利润率分段：0≤x<10 灰，10≤x<15 绿，15≤x<20 蓝，20≤x<25 橙红，x≥25 红 */
.item-trade-log-table-sell .profit-margin-cell.profit-margin-b0_10 { color: #8c8c8c; }
.item-trade-log-table-sell .profit-margin-cell.profit-margin-b10_15 { color: #389e0d; }
.item-trade-log-table-sell .profit-margin-cell.profit-margin-b15_20 { color: #1677ff; }
.item-trade-log-table-sell .profit-margin-cell.profit-margin-b20_25 { color: #fa541c; }
.item-trade-log-table-sell .profit-margin-cell.profit-margin-b25p { color: #f5222d; }
.item-trade-log-table-sell .profit-margin-cell.profit-margin-negative { color: #434343; }
.item-trade-log-table-sell .profit-margin-cell.profit-margin-empty {
    color: #bfbfbf;
    font-weight: 500;
}
.item-trade-log-table col.col-idx { width: 36px; }
.item-trade-log-table col.col-date { width: 118px; }
.item-trade-log-table col.col-server { width: 136px; }
.item-trade-log-table col.col-item { width: 132px; }
.item-trade-log-table col.col-qty { width: 26px; }
.item-trade-log-table col.col-price { width: 78px; }
.item-trade-log-table td:nth-child(2),
.item-trade-log-table th:nth-child(2) {
    white-space: nowrap;
}
.item-trade-server-cell {
    display: flex;
    align-items: center;
    gap: 4px;
}
.item-trade-server-name {
    color: #425466;
    white-space: nowrap;
}
.item-trade-item-cell {
    display: flex;
    align-items: center;
    gap: 5px;
}
.item-trade-item-icon {
    width: 16px;
    height: 16px;
    object-fit: contain;
    flex-shrink: 0;
}
.item-trade-item-name {
    white-space: nowrap;
    color: #243447;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 108px; /* 配合购买记录“道具”列更紧凑 */
}
.item-trade-log-table td.is-price-buy { color: #0050b3; font-weight: 600; }
.item-trade-log-table td.is-price-sell { color: #389e0d; font-weight: 600; }
.item-trade-log-table td.item-trade-duration-cell {
    text-align: right;
    vertical-align: middle;
    white-space: normal;
    min-width: 72px;
    color: #531dab;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}
.item-trade-log-table td.item-trade-duration-cell .item-trade-duration {
    display: block;
    line-height: 1.35;
}
.item-trade-log-table td.item-trade-duration-cell .item-trade-duration.is-fast {
    color: #67c23a;
}
.item-trade-log-table td.item-trade-duration-cell .item-trade-duration.is-slow {
    color: #ff4d4f;
}
.item-trade-log-table td.item-trade-duration-cell .item-trade-duration-empty {
    color: #999;
    font-weight: normal;
}
.item-trade-log-table tbody tr:nth-child(even) {
    background: #fcfdff;
}
.item-trade-log-empty {
    padding: 16px 10px !important;
    color: #999;
    text-align: center !important;
}

/* 屏幕中上部飘字提示（权限不足、操作结果等） */
.app-floating-toast {
    position: fixed;
    top: 18%;
    left: 50%;
    z-index: 1030000;
    max-width: min(92vw, 420px);
    padding: 12px 18px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.45;
    text-align: center;
    pointer-events: none;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.16);
    transform: translate(-50%, 12px) scale(0.96);
    opacity: 0;
    transition: opacity 0.22s ease, transform 0.22s ease;
}

.app-floating-toast.is-visible {
    opacity: 1;
    transform: translate(-50%, 0) scale(1);
}

.app-floating-toast.is-leaving {
    opacity: 0;
    transform: translate(-50%, -10px) scale(0.98);
}

.app-floating-toast--error {
    color: #a32018;
    background: rgba(255, 248, 247, 0.96);
    border: 1px solid rgba(180, 35, 24, 0.28);
}

.app-floating-toast--success {
    color: #237804;
    background: rgba(246, 255, 237, 0.96);
    border: 1px solid rgba(82, 196, 26, 0.32);
}

/* ===== 用户与会员管理弹窗 ===== */
.ua-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 10000;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background:
        radial-gradient(ellipse 70% 55% at 18% 18%, rgba(198, 40, 40, 0.12), transparent 58%),
        rgba(26, 43, 52, 0.45);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}
.ua-overlay.is-open {
    display: flex;
}
.ua-dialog {
    width: min(1080px, 100%);
    max-height: min(86vh, 820px);
    display: flex;
    flex-direction: column;
    background: #fffaf3;
    border: 1px solid rgba(255, 255, 255, 0.55);
    border-radius: 16px;
    box-shadow: 0 22px 56px rgba(26, 43, 52, 0.2);
    overflow: hidden;
    color: #1a2b34;
    font-family: "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}
.ua-dialog-wide {
    width: min(1200px, calc(100vw - 24px));
}
.ua-tabs {
    display: flex;
    gap: 4px;
    padding: 0 18px;
    border-bottom: 1px solid rgba(26, 43, 52, 0.08);
    background: rgba(255, 255, 255, 0.55);
}
.ua-tab {
    appearance: none;
    border: none;
    background: transparent;
    padding: 10px 14px;
    font-size: 13px;
    font-weight: 650;
    color: #6b808a;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
}
.ua-tab:hover {
    color: #1a2b34;
}
.ua-tab.is-active {
    color: #c62828;
    border-bottom-color: #c62828;
}
.ua-panel {
    display: none;
}
.ua-panel.is-active {
    display: block;
}
.ua-perm-wrap {
    padding: 2px 0 6px;
}
.ua-perm-intro {
    margin: 0 0 12px;
    font-size: 12px;
    color: #6b808a;
    line-height: 1.45;
}
.ua-perm-table-scroll {
    overflow: auto;
}
.ua-perm-table th.ua-perm-tier,
.ua-perm-table td.ua-perm-check {
    text-align: center;
    width: 110px;
}
.ua-perm-feat-name {
    font-weight: 650;
    color: #1a2b34;
}
.ua-perm-feat-desc {
    margin-top: 2px;
    font-size: 12px;
    color: #8a9aa3;
}
.ua-perm-check-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 8px;
}
.ua-perm-check-label input {
    width: 16px;
    height: 16px;
    cursor: pointer;
}
.ua-perm-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 14px;
}
.ua-perm-status {
    margin: 8px 0 0;
    font-size: 12px;
    color: #2f6b3a;
    min-height: 1.2em;
    text-align: right;
}
.ua-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px 14px;
    border-bottom: 1px solid rgba(26, 43, 52, 0.1);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.65), transparent);
}
.ua-header-text h2 {
    margin: 0 0 4px;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.02em;
}
.ua-header-sub {
    margin: 0;
    font-size: 12px;
    color: #6b808a;
    line-height: 1.45;
}
.ua-header-actions {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}
.ua-body {
    padding: 12px 16px 16px;
    overflow: auto;
    flex: 1;
}
.ua-table-wrap {
    min-height: 120px;
    overflow-x: auto;
}
.ua-state {
    padding: 36px 16px;
    text-align: center;
    color: #6b808a;
    font-size: 14px;
}
.ua-state-error {
    color: #a32018;
}
.ua-table {
    width: 100%;
    min-width: 980px;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 13px;
    table-layout: fixed;
}
.ua-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    padding: 10px 10px;
    text-align: left;
    font-size: 12px;
    font-weight: 600;
    color: #5a6f78;
    background: #f4ebe0;
    border-bottom: 1px solid rgba(26, 43, 52, 0.1);
    white-space: nowrap;
}
/* 列宽：6 列，单元格内最多两行 */
.ua-table thead th:nth-child(1),
.ua-table tbody td.ua-td-id {
    width: 48px;
}
.ua-table thead th:nth-child(2),
.ua-table tbody td.ua-td-user {
    width: 16%;
}
.ua-table thead th:nth-child(3),
.ua-table tbody td.ua-td-identity {
    width: 15%;
}
.ua-table tbody td.ua-td-identity {
    white-space: nowrap;
    overflow: hidden;
}
.ua-table thead th:nth-child(4),
.ua-table tbody td.ua-td-until {
    width: 27%;
}
.ua-table thead th:nth-child(5),
.ua-table tbody td.ua-td-login {
    width: 26%;
}
.ua-table thead th:nth-child(6),
.ua-table tbody td.ua-td-actions {
    width: 118px;
}
.ua-td-login,
.ua-td-until {
    min-width: 0;
    overflow: hidden;
}
.ua-table tbody td {
    padding: 7px 8px;
    vertical-align: middle;
    border-bottom: 1px solid rgba(26, 43, 52, 0.07);
    background: rgba(255, 252, 247, 0.92);
}
.ua-td-actions {
    padding-left: 8px;
    padding-right: 8px;
}
.ua-table tbody tr:hover td {
    background: #fff;
}
.ua-table tbody tr.is-self td {
    background: rgba(47, 107, 58, 0.06);
}
.ua-table tbody tr.is-disabled-user td {
    opacity: 0.78;
}
.ua-table tbody tr.is-expired-user td {
    background: rgba(198, 40, 40, 0.035);
}
.ua-id-chip {
    display: inline-block;
    min-width: 36px;
    padding: 2px 8px;
    border-radius: 999px;
    background: rgba(26, 43, 52, 0.06);
    color: #5a6f78;
    font-variant-numeric: tabular-nums;
    font-size: 12px;
}
.ua-user-main {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
    min-width: 0;
}
.ua-user-main .ua-username {
    overflow: hidden;
    text-overflow: ellipsis;
}
.ua-invite-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 4px;
}
.ua-invite-code {
    appearance: none;
    border: 1px dashed rgba(42, 111, 151, 0.45);
    background: #f4f8fb;
    color: #1f5575;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 11px;
    font-weight: 650;
    letter-spacing: 0.04em;
    padding: 1px 7px;
    border-radius: 999px;
    cursor: pointer;
    line-height: 1.5;
}
.ua-invite-code:hover {
    background: #e4f0f8;
    border-color: rgba(42, 111, 151, 0.7);
}
.ua-invited-by {
    color: #6a7c85;
    font-size: 11px;
    font-weight: 500;
}
.ua-username {
    font-weight: 650;
    color: #1a2b34;
}
.ua-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.4;
    white-space: nowrap;
}
.ua-badge-icon {
    display: inline-flex;
    align-items: center;
    line-height: 1;
}
.ua-tier-svg {
    display: block;
    flex-shrink: 0;
}
.ua-identity-stack {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    min-width: 0;
}
.ua-identity-main {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
}
.ua-badge-self {
    color: #2f6b3a;
    background: rgba(82, 196, 26, 0.14);
    border: 1px solid rgba(82, 196, 26, 0.28);
}
.ua-badge-role-admin {
    color: #a32018;
    background: rgba(198, 40, 40, 0.1);
    border: 1px solid rgba(198, 40, 40, 0.22);
}
.ua-badge-role-viewer {
    color: #1f5575;
    background: rgba(42, 111, 151, 0.1);
    border: 1px solid rgba(42, 111, 151, 0.22);
}
.ua-badge-tier-admin {
    position: relative;
    overflow: hidden;
    color: #2a2108;
    font-weight: 750;
    letter-spacing: 0.04em;
    border: 1px solid rgba(212, 175, 55, 0.85);
    background: linear-gradient(135deg, #f8e7a0 0%, #e4c35a 38%, #c9a227 62%, #a67c00 100%);
    box-shadow:
        0 0 0 1px rgba(255, 248, 220, 0.35) inset,
        0 1px 2px rgba(80, 55, 0, 0.2),
        0 0 10px rgba(212, 175, 55, 0.45);
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.35);
}
.ua-badge-tier-normal {
    color: #1f5575;
    background: rgba(42, 111, 151, 0.1);
    border: 1px solid rgba(42, 111, 151, 0.22);
}
.ua-badge-trial {
    margin-left: 6px;
    color: #8a5a20;
    background: rgba(212, 168, 75, 0.16);
    border: 1px solid rgba(212, 168, 75, 0.4);
}
.ua-badge-tier-diamond {
    color: #4a3db8;
    background: rgba(91, 79, 207, 0.1);
    border: 1px solid rgba(91, 79, 207, 0.28);
}
.ua-badge-tier-super {
    position: relative;
    overflow: hidden;
    color: #fff8e8;
    font-weight: 750;
    letter-spacing: 0.04em;
    border: 1px solid rgba(255, 213, 79, 0.55);
    background: linear-gradient(135deg, #6d0f18 0%, #b71c1c 35%, #e53935 55%, #8e1b1b 100%);
    box-shadow:
        0 0 0 1px rgba(255, 230, 150, 0.22) inset,
        0 1px 3px rgba(80, 0, 0, 0.28),
        0 0 12px rgba(229, 57, 53, 0.4),
        0 0 18px rgba(255, 193, 7, 0.22);
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
}

/* 高端身份牌外圈：扫光 + 星点闪烁 */
.ua-badge-glow {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
    vertical-align: middle;
}
.ua-badge-glow .ua-badge {
    position: relative;
    z-index: 1;
}
.ua-badge-glow::before {
    content: '';
    position: absolute;
    inset: 1px;
    border-radius: 999px;
    pointer-events: none;
    z-index: 0;
}
.ua-badge-glow-admin::before {
    background: radial-gradient(circle at 30% 30%, rgba(255, 236, 160, 0.55), transparent 62%);
    box-shadow: 0 0 14px rgba(212, 175, 55, 0.5);
    animation: uaGlowPulseGold 2.4s ease-in-out infinite;
}
.ua-badge-glow-super::before {
    background: radial-gradient(circle at 30% 30%, rgba(255, 180, 120, 0.4), transparent 62%);
    box-shadow: 0 0 16px rgba(229, 57, 53, 0.45), 0 0 22px rgba(255, 193, 7, 0.25);
    animation: uaGlowPulseRuby 2.4s ease-in-out infinite;
}
.ua-badge-glow .ua-badge-tier-admin::after,
.ua-badge-glow .ua-badge-tier-super::after {
    content: '';
    position: absolute;
    top: 0;
    left: -40%;
    width: 40%;
    height: 100%;
    background: linear-gradient(
        100deg,
        transparent 0%,
        rgba(255, 255, 255, 0.15) 35%,
        rgba(255, 255, 255, 0.65) 50%,
        rgba(255, 255, 255, 0.15) 65%,
        transparent 100%
    );
    transform: skewX(-18deg);
    animation: uaBadgeShimmer 2.6s ease-in-out infinite;
    pointer-events: none;
}
.ua-spark {
    position: absolute;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    pointer-events: none;
    z-index: 2;
    background: #fff;
    box-shadow: 0 0 4px 1px rgba(255, 255, 255, 0.95);
    animation: uaSparkle 1.8s ease-in-out infinite;
}
.ua-badge-glow-admin .ua-spark {
    background: #fff8d6;
    box-shadow: 0 0 5px 1px rgba(255, 230, 140, 0.95), 0 0 8px rgba(212, 175, 55, 0.7);
}
.ua-badge-glow-super .ua-spark {
    background: #ffe082;
    box-shadow: 0 0 5px 1px rgba(255, 224, 130, 0.95), 0 0 8px rgba(255, 82, 82, 0.55);
}
.ua-spark-1 { top: 0; left: 18%; animation-delay: 0s; }
.ua-spark-2 { top: 8%; right: 10%; animation-delay: 0.45s; }
.ua-spark-3 { bottom: 2%; left: 8%; animation-delay: 0.9s; }
.ua-spark-4 { bottom: 10%; right: 20%; animation-delay: 1.3s; }

@keyframes uaBadgeShimmer {
    0% { left: -45%; opacity: 0; }
    20% { opacity: 1; }
    55% { left: 110%; opacity: 0.85; }
    100% { left: 120%; opacity: 0; }
}
@keyframes uaGlowPulseGold {
    0%, 100% { opacity: 0.55; transform: scale(0.96); }
    50% { opacity: 1; transform: scale(1.04); }
}
@keyframes uaGlowPulseRuby {
    0%, 100% { opacity: 0.5; transform: scale(0.96); }
    50% { opacity: 1; transform: scale(1.05); }
}
@keyframes uaSparkle {
    0%, 100% { opacity: 0.15; transform: scale(0.5); }
    40% { opacity: 1; transform: scale(1.25); }
    70% { opacity: 0.55; transform: scale(0.85); }
}

.ua-badge-status-active {
    color: #2f6b3a;
    background: rgba(82, 196, 26, 0.12);
    border: 1px solid rgba(82, 196, 26, 0.25);
}
.ua-badge-status-expired {
    color: #a32018;
    background: rgba(198, 40, 40, 0.1);
    border: 1px solid rgba(198, 40, 40, 0.28);
}
.ua-badge-status-disabled {
    color: #8c8c8c;
    background: rgba(0, 0, 0, 0.05);
    border: 1px solid rgba(0, 0, 0, 0.08);
}
.ua-time {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    line-height: 1.35;
}
.ua-td-login .ua-time,
.ua-td-until .ua-time {
    width: 100%;
    min-width: 0;
    white-space: normal;
}
.ua-td-login .ua-time-abs,
.ua-td-login .ua-login-sub,
.ua-td-until .ua-time-abs,
.ua-td-until .ua-pool-l1,
.ua-td-until .ua-pool-l2 {
    display: block;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ua-time-rel {
    font-size: 11px;
    font-weight: 600;
    color: #7a8e97;
}
.ua-login-count,
.ua-login-sub {
    font-size: 11px;
    font-weight: 650;
    color: #1f5575;
    white-space: normal;
    word-break: break-word;
}
.ua-time-muted .ua-login-count,
.ua-time-muted .ua-login-sub {
    color: #7a8e97;
    font-weight: 600;
}
.ua-time-remain {
    font-size: 11px;
    font-weight: 650;
    color: #1f5575;
}
.ua-time-expired .ua-time-remain,
.ua-time-none .ua-time-remain {
    color: #a32018;
}
.ua-time-gift {
    font-size: 11px;
    font-weight: 650;
    color: #8a5a20;
}
.ua-pool-line {
    display: block;
    min-width: 0;
    padding: 1px 0;
}
.ua-pool-line + .ua-pool-line {
    border-top: 1px dashed rgba(26, 43, 52, 0.12);
    margin-top: 3px;
    padding-top: 3px;
}
.ua-pool-l1 {
    font-size: 12px;
    font-weight: 700;
    color: #1a2b34;
}
.ua-pool-l2 {
    font-size: 11px;
    font-weight: 600;
    color: #1f5575;
}
.ua-pool-head {
    font-size: 12px;
    font-weight: 700;
    color: #1a2b34;
}
.ua-pool-line.is-queued .ua-pool-head {
    color: #5a6f78;
    font-weight: 650;
}
.ua-pool-remain {
    font-size: 11px;
    font-weight: 600;
    color: #1f5575;
}
.ua-pool-gift {
    font-size: 11px;
    font-weight: 650;
    color: #8a5a20;
}
.ua-pool-super .ua-pool-head { color: #7a2ea0; }
.ua-pool-diamond .ua-pool-head { color: #1f5575; }
.ua-time-perm {
    color: #2f6b3a;
    font-weight: 650;
}
.ua-time-ok {
    color: #1a2b34;
}
.ua-time-expired,
.ua-time-none {
    color: #a32018;
    font-weight: 600;
}
.ua-ip {
    font-size: 12px;
    line-height: 1.35;
}
.ua-ip-main {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    max-width: none;
    width: 100%;
}
.ua-ip-addr {
    font-family: Consolas, "SF Mono", Menlo, monospace;
    font-size: 12px;
    font-weight: 650;
    color: #1a2b34;
    word-break: break-all;
}
.ua-ip-geo {
    font-size: 11px;
    color: #6b808a;
    line-height: 1.35;
}
.ua-td-ip {
    white-space: normal;
}
.ua-time-muted {
    color: #9aa8b0;
}
.ua-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
    width: 100%;
    min-width: 0;
}
.ua-actions .ua-btn {
    padding: 4px 4px;
    font-size: 11px;
    border-radius: 6px;
    min-width: 0;
}
.ua-btn {
    appearance: none;
    border: 1px solid transparent;
    border-radius: 8px;
    padding: 6px 8px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
    white-space: nowrap;
}
.ua-btn:hover:not(:disabled) {
    transform: translateY(-1px);
}
.ua-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    transform: none;
}
.ua-btn-ghost {
    background: rgba(255, 255, 255, 0.75);
    border-color: rgba(26, 43, 52, 0.12);
    color: #3d5560;
}
.ua-btn-ghost:hover:not(:disabled) {
    background: #fff;
    border-color: rgba(26, 43, 52, 0.22);
}
.ua-btn-primary {
    background: #c62828;
    color: #fff;
}
.ua-btn-primary:hover:not(:disabled) {
    background: #a32018;
}
.ua-btn-soft {
    background: #fff;
    border-color: rgba(26, 43, 52, 0.14);
    color: #3d5560;
}
.ua-btn-soft:hover:not(:disabled) {
    border-color: rgba(26, 43, 52, 0.28);
    background: #fffaf3;
}
.ua-btn-warn {
    background: rgba(250, 173, 20, 0.14);
    border-color: rgba(212, 136, 6, 0.35);
    color: #ad6800;
}
.ua-btn-warn:hover:not(:disabled) {
    background: rgba(250, 173, 20, 0.22);
    border-color: rgba(212, 136, 6, 0.5);
}
@media (max-width: 860px) {
    .ua-actions {
        grid-template-columns: 1fr;
    }
    .ua-table {
        min-width: 680px;
    }
    .ua-table thead th:nth-child(1),
    .ua-table tbody td:nth-child(1) {
        display: none;
    }
    .ua-table thead th:nth-child(6),
    .ua-table tbody td.ua-td-actions {
        width: 108px;
    }
}

/* 会员档位调整弹层 */
.ua-tier-picker-overlay {
    position: fixed;
    inset: 0;
    z-index: 13000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: rgba(26, 43, 52, 0.4);
}
.ua-tier-picker {
    width: min(400px, 100%);
    background: #fff;
    border-radius: 12px;
    padding: 18px 18px 14px;
    box-shadow: 0 16px 40px rgba(26, 43, 52, 0.2);
}
.ua-tier-picker h3 {
    margin: 0 0 6px;
    font-size: 17px;
    color: #1a2b34;
}
.ua-tier-picker-sub {
    margin: 0 0 14px;
    font-size: 12px;
    color: #6b808a;
}
.ua-tier-options {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 10px;
}
.ua-tier-option {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid rgba(26, 43, 52, 0.12);
    border-radius: 10px;
    font-size: 14px;
    color: #1a2b34;
    cursor: pointer;
    background: #fafbfc;
}
.ua-tier-option .ua-badge {
    font-size: 13px;
    padding: 4px 12px;
}
.ua-tier-option .ua-tier-svg {
    width: 15px;
    height: 15px;
}
.ua-tier-option-hint {
    font-size: 12px;
    color: #6b808a;
    line-height: 1.3;
    margin-left: auto;
}
.ua-tier-option:has(input:checked) {
    border-color: rgba(198, 40, 40, 0.45);
    background: rgba(198, 40, 40, 0.06);
}
.ua-tier-option-normal:has(input:checked) {
    border-color: rgba(42, 111, 151, 0.45);
    background: rgba(42, 111, 151, 0.07);
}
.ua-tier-option-diamond:has(input:checked) {
    border-color: rgba(91, 79, 207, 0.45);
    background: rgba(91, 79, 207, 0.08);
}
.ua-tier-option-super:has(input:checked) {
    border-color: rgba(198, 40, 40, 0.5);
    background: rgba(198, 40, 40, 0.07);
}
.ua-tier-picker-note {
    margin: 0 0 14px;
    font-size: 12px;
    color: #8a9aa3;
}
.ua-tier-picker-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.ua-days-presets {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 12px;
}
.ua-days-preset {
    appearance: none;
    border: 1px solid rgba(26, 43, 52, 0.14);
    background: #fafbfc;
    color: #1a2b34;
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}
.ua-days-preset:hover {
    border-color: rgba(26, 43, 52, 0.28);
    background: #fffaf3;
}
.ua-days-preset.is-active {
    border-color: rgba(198, 40, 40, 0.45);
    background: rgba(198, 40, 40, 0.08);
    color: #a32018;
}
.ua-days-custom {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 14px;
    font-size: 13px;
    color: #3d5560;
}
.ua-days-custom input {
    width: 88px;
    height: 32px;
    border: 1px solid rgba(26, 43, 52, 0.16);
    border-radius: 8px;
    padding: 0 8px;
    font-size: 14px;
    font-variant-numeric: tabular-nums;
}

.ua-invite-dialog {
    width: min(420px, 100%);
}
.ua-invite-code-box {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 14px;
    padding: 12px 12px;
    border: 1px dashed rgba(198, 40, 40, 0.35);
    border-radius: 10px;
    background: rgba(198, 40, 40, 0.05);
}
.ua-invite-code-box code {
    flex: 1;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 0.12em;
    color: #8e1a1a;
    font-family: "Cascadia Mono", "Consolas", "Menlo", monospace;
}
.ua-invite-unused-title {
    margin: 0 0 6px;
    font-size: 12px;
    color: #6b808a;
}
.ua-invite-unused-list {
    list-style: none;
    margin: 0 0 14px;
    padding: 0;
    max-height: 160px;
    overflow: auto;
}
.ua-invite-unused-item {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding: 6px 0;
    border-bottom: 1px solid rgba(26, 43, 52, 0.06);
    font-size: 12px;
    color: #3d5560;
}
.ua-invite-unused-item code {
    font-weight: 700;
    letter-spacing: 0.06em;
    color: #1a2b34;
}
.ua-invite-unused-empty {
    padding: 8px 0;
    font-size: 12px;
    color: #8a9aa3;
}