/* ========================================
   taskwork 插件样式 - 对齐主系统 VShop 主题
   配色/字体/圆角/层级与主前台（common.css / header.css）保持一致
   ======================================== */

/* ========================================
   1. 字体系统 - 使用系统字体栈（自包含，避免跨域 Google Fonts 在国内网络下渲染阻塞）
   ======================================== */

/* CSS 变量 - 对齐主系统 VShop 设计令牌 */
:root {
    /* 主色调 - 对齐主系统品牌紫 #533afd */
    --tw-ink: #061b31;          /* 主文字/深色，对齐 --v-text-primary */
    --tw-ink-light: #1e2a3a;    /* 次级深色（hover） */
    --tw-accent: #533afd;       /* 品牌主色，对齐 --v-primary */
    --tw-accent-dark: #3f2ed1;  /* 主色 hover，对齐 --v-primary-hover */
    --tw-accent-subtle: rgba(83, 58, 253, 0.06); /* 浅紫底，对齐 --v-primary-subtle */

    /* 中性色 - 对齐主系统 */
    --tw-paper: #ffffff;
    --tw-paper-dark: #f8fafb;
    --tw-muted: #64748b;
    --tw-muted-dark: #475569;
    --tw-muted-light: #94a3b8;
    --tw-border: #e5edf5;

    /* 功能色 */
    --tw-success: #16a34a;
    --tw-warning: #d97706;
    --tw-danger: #e11d48;
    --tw-info: #533afd;

    /* 排版 - 系统无衬线字体栈（与主系统 --v-font-sans 一致，标题不再用衬线） */
    --tw-font-display: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', 'Hiragino Sans GB', sans-serif;
    --tw-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', 'Hiragino Sans GB', sans-serif;

    /* 间距系统 - 基于 8px */
    --tw-space-1: 0.5rem;
    --tw-space-2: 1rem;
    --tw-space-3: 1.5rem;
    --tw-space-4: 2rem;
    --tw-space-5: 3rem;
    --tw-space-6: 4rem;
    --tw-space-7: 6rem;

    /* 圆角 - 对齐主系统（卡片 8px / 按钮 6px / 小 4px） */
    --tw-radius-sm: 4px;
    --tw-radius: 8px;
    --tw-radius-lg: 12px;

    /* 阴影 - 中性蓝黑调 */
    --tw-shadow: 0 1px 3px rgba(6, 27, 49, 0.06), 0 1px 2px rgba(6, 27, 49, 0.04);
    --tw-shadow-md: 0 4px 12px rgba(6, 27, 49, 0.08);
}

/* ========================================
   2. 基础重置与排版
   ======================================== */
.tw-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: var(--tw-space-5) var(--tw-space-2);
    font-family: var(--tw-font-body);
    color: var(--tw-ink);
    background: var(--tw-paper);
}

/* 标题系统 */
.tw-container h1, .tw-container h2, .tw-container h3 {
    font-family: var(--tw-font-display);
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -0.02em;
}

.tw-container h1 {
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    margin-bottom: var(--tw-space-3);
}

.tw-container h2 {
    font-size: clamp(1.25rem, 3vw, 1.75rem);
    margin-bottom: var(--tw-space-2);
}

/* 段落 */
.tw-container p {
    line-height: 1.7;
    color: var(--tw-muted);
}

.tw-container a {
    color: var(--tw-ink);
    text-decoration: underline;
    text-decoration-color: var(--tw-border);
    text-underline-offset: 3px;
    transition: text-decoration-color 0.2s;
}

.tw-container a:hover {
    text-decoration-color: var(--tw-ink);
}

/* ========================================
   3. 头部区域 - 简洁有力
   ======================================== */
.tw-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding-bottom: var(--tw-space-3);
    margin-bottom: var(--tw-space-4);
    border-bottom: 1px solid var(--tw-border);
}

.tw-header-title {
    display: flex;
    flex-direction: column;
    gap: var(--tw-space-1);
}

.tw-header h1 {
    font-family: var(--tw-font-display);
    font-size: clamp(1.75rem, 5vw, 2.75rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    margin: 0;
    line-height: 1;
}

.tw-header-subtitle {
    font-size: 0.9375rem;
    color: var(--tw-muted);
    font-weight: 400;
}

/* 按钮 - 杂志风格 */
.tw-btn {
    font-family: var(--tw-font-body);
    font-size: 0.875rem;
    font-weight: 600;
    padding: 0.75rem 1.5rem;
    border: 1px solid var(--tw-ink);
    border-radius: var(--tw-radius-sm);
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.2s ease;
    background: transparent;
    color: var(--tw-ink);
}

.tw-btn:hover {
    background: var(--tw-accent-subtle);
    color: var(--tw-accent);
    border-color: var(--tw-accent);
}

.tw-btn-primary,
.tw-btn-primary:visited,
.tw-btn-primary:hover,
.tw-btn-primary:focus,
.tw-btn-primary:active {
    color: #fff;
}

.tw-btn-primary {
    background: var(--tw-accent);
    border-color: var(--tw-accent);
}

.tw-btn-primary:hover {
    background: var(--tw-accent-dark);
    border-color: var(--tw-accent-dark);
}

.tw-quick-links .tw-btn-primary,
.tw-widget .tw-btn-primary {
    color: #fff;
}

.tw-btn-sm {
    padding: 0.5rem 1rem;
    font-size: 0.8125rem;
}

.tw-btn-block {
    width: 100%;
    justify-content: center;
}

/* ========================================
   4. 筛选栏 - 简洁标签
   ======================================== */
.tw-filters {
    display: flex;
    gap: 0.5rem;
    margin-bottom: var(--tw-space-4);
    flex-wrap: wrap;
}

.tw-tab {
    font-family: var(--tw-font-body);
    font-size: 0.875rem;
    font-weight: 500;
    padding: 0.625rem 1.125rem;
    border-radius: var(--tw-radius-sm);
    color: var(--tw-muted);
    text-decoration: none;
    background: transparent;
    border: 1px solid transparent;
    transition: all 0.2s ease;
}

.tw-tab:hover {
    color: var(--tw-ink);
    background: var(--tw-paper-dark);
}

.tw-tab.active {
    color: var(--tw-ink);
    background: var(--tw-paper);
    border-color: var(--tw-border);
    font-weight: 600;
}

/* ========================================
   5. 任务网格 - 非对称布局
   ======================================== */
.tw-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--tw-space-3);
}

@media (max-width: 768px) {
    .tw-grid {
        grid-template-columns: 1fr;
    }
}

/* 第一张卡片特别大 */
.tw-grid > .tw-card:first-child {
    grid-column: span 2;
}

@media (max-width: 768px) {
    .tw-grid > .tw-card:first-child {
        grid-column: span 1;
    }
}

/* ========================================
   6. 任务卡片 - 编辑杂志风
   ======================================== */
.tw-card {
    background: var(--tw-card, #ffffff);
    border: 1px solid var(--tw-border);
    border-radius: var(--tw-radius);
    padding: var(--tw-space-3);
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    transition: all 0.25s ease;
    position: relative;
}

.tw-card:hover {
    border-color: var(--tw-ink);
    box-shadow: var(--tw-shadow-md);
    transform: translateY(-2px);
}

/* 热门角标 - 简约 */
.tw-card-hot {
    position: absolute;
    top: var(--tw-space-2);
    right: var(--tw-space-2);
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.25rem 0.625rem;
    background: var(--tw-accent);
    color: #fff;
    border-radius: var(--tw-radius-sm);
}

/* 卡片头部 */
.tw-card-header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: var(--tw-space-2);
}

/* 状态标签 - 简洁单色 */
.tw-status {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.25rem 0.625rem;
    border-radius: var(--tw-radius-sm);
    display: inline-block;
}

.tw-status-open { background: #d8f3dc; color: var(--tw-success); }
.tw-status-bidding { background: #fef3c7; color: var(--tw-warning); }
.tw-status-in_progress { background: #dbeafe; color: var(--tw-info); }
.tw-status-review { background: #e9d5ff; color: #7c3aed; }
.tw-status-completed { background: var(--tw-paper-dark); color: var(--tw-muted); }
.tw-status-cancelled { background: var(--tw-paper-dark); color: var(--tw-muted-light); }
.tw-status-disputed { background: #fee2e2; color: var(--tw-danger); }
.tw-status-draft { background: var(--tw-paper-dark); color: var(--tw-muted-light); }

/* 投标状态标签 */
.tw-status-pending { background: #fef3c7; color: var(--tw-warning); }
.tw-status-accepted { background: #d8f3dc; color: var(--tw-success); }
.tw-status-rejected { background: #fee2e2; color: var(--tw-danger); }
.tw-status-withdrawn { background: var(--tw-paper-dark); color: var(--tw-muted-light); }
.tw-status-expired { background: var(--tw-paper-dark); color: var(--tw-muted-light); }

/* 分类标签 */
.tw-category-tag {
    font-size: 0.6875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--tw-muted);
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}

.tw-category-tag svg {
    width: 14px;
    height: 14px;
    opacity: 0.6;
}

/* 任务标题 */
.tw-card-title {
    font-family: var(--tw-font-display);
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.3;
    margin: 0 0 var(--tw-space-2);
    color: var(--tw-ink);
}

.tw-grid > .tw-card:first-child .tw-card-title {
    font-size: 1.375rem;
}

/* 预算区域 */
.tw-card-budget-wrap {
    margin: auto 0 0;
    padding-top: var(--tw-space-2);
    border-top: 1px solid var(--tw-border);
}

.tw-card-budget {
    font-family: var(--tw-font-display);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--tw-ink);
    letter-spacing: -0.02em;
}

.tw-grid > .tw-card:first-child .tw-card-budget {
    font-size: 2rem;
}

.tw-budget-unit {
    font-size: 0.75rem;
    color: var(--tw-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 0.25rem;
}

/* 卡片底部元信息 */
.tw-card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: var(--tw-space-2);
    padding-top: var(--tw-space-2);
    border-top: 1px solid var(--tw-border);
}

.tw-card-meta {
    display: flex;
    gap: 1.25rem;
    font-size: 0.8125rem;
    color: var(--tw-muted);
}

.tw-card-meta span {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

/* ========================================
   7. 空状态 - 优雅克制
   ======================================== */
.tw-empty {
    text-align: center;
    padding: var(--tw-space-6) var(--tw-space-3);
    background: var(--tw-paper-dark);
    border-radius: var(--tw-radius);
    border: 1px dashed var(--tw-border);
}

.tw-empty-icon {
    font-size: 3rem;
    margin-bottom: var(--tw-space-2);
    opacity: 0.5;
}

.tw-empty-text {
    font-size: 1.0625rem;
    color: var(--tw-muted);
    margin-bottom: var(--tw-space-3);
}

/* ========================================
   8. 分页 - 简洁
   ======================================== */
.tw-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
    margin-top: var(--tw-space-5);
}

.tw-page-btn {
    min-width: 2.5rem;
    height: 2.5rem;
    padding: 0 0.75rem;
    border: 1px solid var(--tw-border);
    border-radius: var(--tw-radius-sm);
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--tw-muted);
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    background: transparent;
}

.tw-page-btn:hover {
    border-color: var(--tw-ink);
    color: var(--tw-ink);
}

.tw-page-btn.active {
    background: var(--tw-ink);
    border-color: var(--tw-ink);
    color: var(--tw-paper);
}

.tw-page-info {
    font-size: 0.8125rem;
    color: var(--tw-muted);
    padding: 0 1rem;
}

/* ========================================
   9. 面包屑
   ======================================== */
.tw-breadcrumb {
    font-size: 0.875rem;
    color: var(--tw-muted);
    margin-bottom: var(--tw-space-3);
}

.tw-breadcrumb a {
    color: var(--tw-muted);
    text-decoration: none;
}

.tw-breadcrumb a:hover {
    color: var(--tw-ink);
}

.tw-breadcrumb span {
    margin: 0 0.5rem;
    opacity: 0.5;
}

/* ========================================
   10. 详情页 - 优化版
   ======================================== */
.tw-detail {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: var(--tw-space-5);
    align-items: start;
}

@media (max-width: 900px) {
    .tw-detail {
        grid-template-columns: 1fr;
        gap: var(--tw-space-4);
    }
}

.tw-detail-main h1 {
    font-family: var(--tw-font-display);
    font-size: clamp(1.5rem, 4vw, 2rem);
    font-weight: 700;
    margin: 0 0 var(--tw-space-2);
    line-height: 1.3;
    color: var(--tw-ink);
    letter-spacing: -0.02em;
}

.tw-detail-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    font-size: 0.8125rem;
    color: var(--tw-muted);
    margin-top: var(--tw-space-2);
    padding-bottom: var(--tw-space-3);
    border-bottom: 1px solid var(--tw-border);
}

.tw-detail-meta .tw-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}

.tw-detail-meta .tw-meta-item svg {
    opacity: 0.5;
    flex-shrink: 0;
}

/* 预算高亮 */
.tw-budget-highlight {
    background: linear-gradient(135deg, var(--tw-paper) 0%, var(--tw-paper-dark) 100%);
    border: 1px solid var(--tw-border);
    border-radius: var(--tw-radius-lg);
    padding: var(--tw-space-3);
    margin-bottom: var(--tw-space-4);
    position: relative;
    overflow: hidden;
}

.tw-budget-highlight::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--tw-accent);
}

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

.tw-budget-label {
    font-size: 0.875rem;
    color: var(--tw-muted);
    font-weight: 500;
}

.tw-budget-range {
    font-family: var(--tw-font-display);
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--tw-ink);
    letter-spacing: -0.02em;
}

.tw-budget-sub {
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px dashed var(--tw-border);
    font-size: 0.8125rem;
    color: var(--tw-muted);
    display: flex;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.tw-budget-sub span {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}

.tw-budget-sub span svg {
    opacity: 0.5;
    flex-shrink: 0;
}

/* 任务描述 */
.tw-detail-desc h3,
.tw-skills-section h3,
.tw-bids h3 {
    font-family: var(--tw-font-display);
    font-size: 1.125rem;
    font-weight: 600;
    margin: var(--tw-space-4) 0 var(--tw-space-2);
    padding-bottom: var(--tw-space-1);
    border-bottom: 1px solid var(--tw-border);
    color: var(--tw-ink);
}

.tw-desc-content {
    font-size: 1rem;
    line-height: 1.8;
    color: var(--tw-ink-light);
}

/* 技能标签 */
.tw-skills-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: var(--tw-space-2);
}

.tw-skill-tag {
    font-size: 0.8125rem;
    font-weight: 500;
    padding: 0.375rem 0.875rem;
    background: var(--tw-paper-dark);
    color: var(--tw-ink-light);
    border-radius: var(--tw-radius-sm);
    border: 1px solid var(--tw-border);
}

/* ========================================
   11. 投标信息 - 优化版（含排名）
   ======================================== */
.tw-bids-section {
    margin-top: var(--tw-space-4);
}

.tw-bids-section h3 {
    font-family: var(--tw-font-display);
    font-size: 1.125rem;
    font-weight: 600;
    margin: var(--tw-space-4) 0 var(--tw-space-2);
    padding-bottom: var(--tw-space-1);
    border-bottom: 1px solid var(--tw-border);
    color: var(--tw-ink);
}

.tw-count {
    font-size: 0.875rem;
    color: var(--tw-muted);
    font-weight: 400;
    margin-left: 0.5rem;
}

.tw-bid-list {
    display: flex;
    flex-direction: column;
    gap: var(--tw-space-2);
    margin-top: var(--tw-space-2);
}

.tw-bid-card {
    background: var(--tw-card, #ffffff);
    border: 1px solid var(--tw-border);
    border-radius: var(--tw-radius);
    padding: var(--tw-space-3);
    display: flex;
    gap: var(--tw-space-3);
    align-items: flex-start;
    transition: all 0.2s ease;
    position: relative;
}

.tw-bid-card:hover {
    border-color: var(--tw-ink);
}

/* 投标排名标识 */
.tw-bid-rank {
    flex-shrink: 0;
    display: flex;
    align-items: flex-start;
    padding-top: 0.5rem;
    min-width: 32px;
}

.tw-rank-badge {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--tw-paper);
}

.tw-rank-badge.tw-rank-1 { background: linear-gradient(135deg, #c9a227, #e8c94a); }
.tw-rank-badge.tw-rank-2 { background: linear-gradient(135deg, #9eabbf, #b8c4d4); }
.tw-rank-badge.tw-rank-3 { background: linear-gradient(135deg, #b5651d, #d4894a); }
.tw-rank-num {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--tw-muted-light);
    background: var(--tw-paper-dark);
}

.tw-bid-main {
    flex: 1;
    min-width: 0;
}

.tw-bid-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
}

.tw-bid-user {
    font-weight: 600;
    font-size: 0.9375rem;
    color: var(--tw-ink);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* ===== 投标者信息（增强版） ===== */
.tw-bidder-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--tw-space-2);
    margin-bottom: 0.75rem;
}

.tw-bidder-info {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex: 1;
    min-width: 0;
}

.tw-bidder-meta {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
}

.tw-bidder-name {
    font-weight: 600;
    font-size: 0.9375rem;
    color: var(--tw-ink);
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex-wrap: wrap;
}

.tw-seller-badge {
    font-size: 0.625rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.125rem 0.375rem;
    background: var(--tw-accent);
    color: var(--tw-ink);
    border-radius: var(--tw-radius-sm);
}

.tw-level-badge {
    font-size: 0.625rem;
    font-weight: 600;
    padding: 0.125rem 0.375rem;
    background: var(--tw-paper-dark);
    color: var(--tw-muted);
    border-radius: var(--tw-radius-sm);
}

.tw-bidder-stats {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
    font-size: 0.75rem;
    color: var(--tw-muted);
}

.tw-stat-item {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.tw-rating-stars {
    display: inline-flex;
    align-items: center;
    gap: 0.125rem;
}

.tw-rating-stars svg {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
}

.tw-rating-num {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--tw-warning);
    margin-left: 0.125rem;
}

/* 头像样式增强 */
.tw-avatar {
    display: inline-flex;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--tw-paper-dark);
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
}

.tw-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tw-avatar-default {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--tw-muted);
    text-transform: uppercase;
}

.tw-avatar svg {
    width: 14px;
    height: 14px;
    opacity: 0.6;
}

.tw-avatar {
    display: inline-flex;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--tw-paper-dark);
    align-items: center;
    justify-content: center;
}

.tw-avatar svg {
    width: 14px;
    height: 14px;
    opacity: 0.6;
}

.tw-bid-price {
    font-family: var(--tw-font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--tw-ink);
}

.tw-bid-info {
    font-size: 0.8125rem;
    color: var(--tw-muted);
    margin-bottom: 0.5rem;
    display: flex;
    gap: 1rem;
    align-items: center;
    flex-wrap: wrap;
}

.tw-bid-info svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    opacity: 0.6;
}

.tw-bid-info span {
    display: flex;
    align-items: center;
    gap: 0.375rem;
}

.tw-bid-msg {
    font-size: 0.875rem;
    color: var(--tw-muted);
    font-style: italic;
    margin-top: 0.75rem;
    padding-left: 1rem;
    border-left: 2px solid var(--tw-border);
}

.tw-quote {
    color: var(--tw-muted-light);
    font-size: 1.25rem;
    line-height: 0;
    vertical-align: -2px;
}
.tw-section {
    margin-top: var(--tw-space-4);
}

.tw-bid-card,
.tw-delivery-card,
.tw-review-card {
    background: var(--tw-card, #ffffff);
    border: 1px solid var(--tw-border);
    border-radius: var(--tw-radius);
    padding: var(--tw-space-3);
    margin-bottom: var(--tw-space-2);
    transition: all 0.2s ease;
}

.tw-bid-card:hover,
.tw-delivery-card:hover {
    border-color: var(--tw-ink);
}

.tw-bid-header,
.tw-delivery-header,
.tw-review-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem;
}

.tw-bid-user {
    font-weight: 600;
    font-size: 0.9375rem;
    color: var(--tw-ink);
}

.tw-bid-price {
    font-family: var(--tw-font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--tw-ink);
}

.tw-bid-info {
    font-size: 0.8125rem;
    color: var(--tw-muted);
    margin-bottom: 0.5rem;
}

.tw-bid-msg {
    font-size: 0.875rem;
    color: var(--tw-muted);
    font-style: italic;
    margin-top: 0.75rem;
    padding-left: 1rem;
    border-left: 2px solid var(--tw-border);
}

/* 标签 */
.tw-badge {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.25rem 0.5rem;
    border-radius: var(--tw-radius-sm);
    display: inline-block;
}

.tw-badge-success { background: #d8f3dc; color: var(--tw-success); }
.tw-badge-warning { background: #fef3c7; color: var(--tw-warning); }
.tw-badge-danger { background: #fee2e2; color: var(--tw-danger); }
.tw-badge-muted { background: var(--tw-paper-dark); color: var(--tw-muted); }

.tw-time {
    font-size: 0.75rem;
    color: var(--tw-muted-light);
}

/* ========================================
   12. 侧边栏
   ======================================== */
.tw-detail-sidebar {
    position: sticky;
    top: var(--tw-space-3);
    align-self: start;
}

/* 侧栏执行者信息 */
.tw-assigned-card h3 {
    margin-bottom: var(--tw-space-2);
}

.tw-assigned-info {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.tw-assigned-meta {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.tw-assigned-name {
    font-weight: 600;
    font-size: 0.9375rem;
    color: var(--tw-ink);
}

.tw-info-card,
.tw-bid-form,
.tw-delivery-form,
.tw-review-form {
    background: var(--tw-card, #ffffff);
    border: 1px solid var(--tw-border);
    border-radius: var(--tw-radius);
    padding: var(--tw-space-3);
    margin-bottom: var(--tw-space-2);
}

.tw-bid-form h3,
.tw-info-card h3 {
    font-family: var(--tw-font-display);
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 var(--tw-space-2);
    color: var(--tw-ink);
}

/* 表单 */
.tw-form-group {
    margin-bottom: var(--tw-space-2);
}

.tw-form-group label {
    display: block;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--tw-ink);
    margin-bottom: 0.375rem;
}

.tw-form-group input,
.tw-form-group textarea,
.tw-form-group select {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1px solid var(--tw-border);
    border-radius: var(--tw-radius-sm);
    font-family: var(--tw-font-body);
    font-size: 0.9375rem;
    background: var(--tw-paper);
    color: var(--tw-ink);
    transition: all 0.2s ease;
    box-sizing: border-box;
}

.tw-form-group input:focus,
.tw-form-group textarea:focus,
.tw-form-group select:focus {
    outline: none;
    border-color: var(--tw-accent);
    box-shadow: 0 0 0 3px var(--tw-accent-subtle);
    background: #fff;
}

/* 操作按钮 */
.tw-action-btn {
    padding: 0.625rem 1.25rem;
    border-radius: var(--tw-radius-sm);
    font-size: 0.8125rem;
    font-weight: 600;
    cursor: pointer;
    border: none;
    transition: all 0.2s ease;
}

.tw-action-accept {
    background: var(--tw-ink);
    color: var(--tw-paper);
}

.tw-action-accept:hover {
    background: var(--tw-ink-light);
}

.tw-action-reject {
    background: var(--tw-danger);
    color: #fff;
}

.tw-action-reject:hover {
    opacity: 0.9;
}

/* 评审操作 */
.tw-review-actions {
    margin-top: var(--tw-space-2);
    padding-top: var(--tw-space-2);
    border-top: 1px solid var(--tw-border);
}

.tw-review-actions textarea {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1px solid var(--tw-border);
    border-radius: var(--tw-radius-sm);
    font-family: var(--tw-font-body);
    font-size: 0.875rem;
    resize: vertical;
    min-height: 80px;
    box-sizing: border-box;
    margin-bottom: 0.75rem;
}

.tw-action-btns {
    display: flex;
    gap: 0.5rem;
}

/* ========================================
   13. 发布任务表单
   ======================================== */
.tw-form-header {
    margin-bottom: var(--tw-space-4);
}

.tw-back {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.875rem;
    color: var(--tw-muted);
    text-decoration: none;
    margin-bottom: var(--tw-space-2);
}

.tw-back:hover {
    color: var(--tw-ink);
}

.tw-form-header h1 {
    font-size: clamp(1.5rem, 4vw, 2rem);
}

.tw-form-tip {
    font-size: 0.9375rem;
    color: var(--tw-muted);
    margin-top: 0.5rem;
}

.tw-form-card {
    background: var(--tw-card, #ffffff);
    border: 1px solid var(--tw-border);
    border-radius: var(--tw-radius);
    padding: var(--tw-space-4);
    margin-bottom: var(--tw-space-3);
}

.tw-form-card h3 {
    font-family: var(--tw-font-display);
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0 0 var(--tw-space-3);
    padding-bottom: var(--tw-space-2);
    border-bottom: 1px solid var(--tw-border);
    color: var(--tw-ink);
}

.tw-required {
    color: var(--tw-danger);
}

.tw-help {
    font-size: 0.75rem;
    color: var(--tw-muted);
    margin-top: 0.25rem;
}

.tw-budget-preview {
    background: var(--tw-paper-dark);
    border-radius: var(--tw-radius-sm);
    padding: var(--tw-space-2) var(--tw-space-3);
    margin-bottom: var(--tw-space-3);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.tw-budget-preview .tw-budget-label {
    font-size: 0.875rem;
    color: var(--tw-muted);
}

.tw-budget-preview .tw-budget-value {
    font-family: var(--tw-font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--tw-ink);
}

.tw-form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    padding-top: var(--tw-space-3);
}

/* ========================================
   14. 我的任务/投标页面
   ======================================== */
.tw-page-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: var(--tw-space-4);
    padding-bottom: var(--tw-space-3);
    border-bottom: 1px solid var(--tw-border);
}

.tw-page-header h1 {
    font-size: clamp(1.5rem, 4vw, 2rem);
    margin: 0;
}

.tw-list-cards {
    display: flex;
    flex-direction: column;
    gap: var(--tw-space-2);
}

.tw-list-card {
    background: var(--tw-card, #ffffff);
    border: 1px solid var(--tw-border);
    border-radius: var(--tw-radius);
    padding: var(--tw-space-3);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--tw-space-3);
    transition: all 0.2s ease;
}

.tw-list-card:hover {
    border-color: var(--tw-ink);
    box-shadow: var(--tw-shadow);
}

.tw-list-card-main {
    flex: 1;
    min-width: 0;
}

.tw-list-card-title {
    font-family: var(--tw-font-display);
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 0.5rem;
}

.tw-list-card-title a {
    color: var(--tw-ink);
    text-decoration: none;
}

.tw-list-card-title a:hover {
    text-decoration: underline;
}

.tw-list-card-meta {
    font-size: 0.8125rem;
    color: var(--tw-muted);
    display: flex;
    gap: 1.5rem;
}

.tw-list-card-actions {
    display: flex;
    gap: 0.5rem;
    flex-shrink: 0;
}

.tw-bid-quote {
    font-size: 0.875rem;
    color: var(--tw-muted);
    font-style: italic;
    margin-top: 0.5rem;
    padding-left: 1rem;
    border-left: 2px solid var(--tw-border);
}

.tw-winner-badge {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.25rem 0.5rem;
    background: var(--tw-accent);
    color: var(--tw-ink);
    border-radius: var(--tw-radius-sm);
}

/* ========================================
   15. 后台管理表格
   ======================================== */
.admin-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--tw-space-3);
}

.admin-header h1 {
    font-size: 1.5rem;
    margin: 0;
}

.admin-filters {
    margin-bottom: var(--tw-space-3);
}

.filter-tabs {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.filter-tabs .tab {
    padding: 0.5rem 1rem;
    border-radius: var(--tw-radius-sm);
    font-size: 0.875rem;
    color: var(--tw-muted);
    text-decoration: none;
    background: transparent;
    border: 1px solid transparent;
    transition: all 0.2s ease;
}

.filter-tabs .tab:hover {
    background: var(--tw-paper-dark);
}

.filter-tabs .tab.active {
    background: var(--tw-ink);
    color: var(--tw-paper);
}

.admin-table-wrap {
    background: var(--tw-card, #ffffff);
    border: 1px solid var(--tw-border);
    border-radius: var(--tw-radius);
    overflow: hidden;
}

.admin-table {
    width: 100%;
    border-collapse: collapse;
}

.admin-table th {
    background: var(--tw-paper-dark);
    padding: 1rem 1.25rem;
    text-align: left;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--tw-muted);
    border-bottom: 1px solid var(--tw-border);
}

.admin-table td {
    padding: 1rem 1.25rem;
    font-size: 0.875rem;
    border-bottom: 1px solid var(--tw-border);
}

.admin-table tr:last-child td {
    border-bottom: none;
}

.admin-table tr:hover td {
    background: var(--tw-paper);
}

.admin-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.5rem;
    padding: var(--tw-space-3);
    border-top: 1px solid var(--tw-border);
}

/* ========================================
   16. 响应式
   ======================================== */
@media (max-width: 768px) {
    .tw-container {
        padding: var(--tw-space-3) var(--tw-space-2);
    }
    
    .tw-header {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--tw-space-2);
    }
    
    .tw-list-card {
        flex-direction: column;
        align-items: flex-start;
    }
    
    .tw-list-card-actions {
        width: 100%;
        margin-top: var(--tw-space-2);
    }
    
    .tw-list-card-actions .tw-btn {
        flex: 1;
        justify-content: center;
    }
    
    .tw-detail-sidebar {
        position: static;
    }
    
    .tw-form-actions {
        flex-direction: column;
    }
    
    .tw-form-actions .tw-btn {
        width: 100%;
        justify-content: center;
    }
}

/* ========================================
   17. 搜索框
   ======================================== */
.tw-search {
    display: flex;
    gap: 0.75rem;
    margin-bottom: var(--tw-space-3);
}

.tw-search input {
    flex: 1;
    padding: 0.75rem 1rem;
    border: 1px solid var(--tw-border);
    border-radius: var(--tw-radius-sm);
    font-family: var(--tw-font-body);
    font-size: 0.9375rem;
    background: var(--tw-paper);
    color: var(--tw-ink);
    transition: all 0.2s ease;
}

.tw-search input:focus {
    outline: none;
    border-color: var(--tw-ink);
    background: #fff;
}

/* ========================================
   18. 表格
   ======================================== */
.tw-table {
    width: 100%;
    border-collapse: collapse;
}

.tw-table th {
    background: var(--tw-paper-dark);
    padding: 0.875rem 1rem;
    text-align: left;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--tw-muted);
    border-bottom: 2px solid var(--tw-border);
}

.tw-table td {
    padding: 1rem;
    font-size: 0.875rem;
    border-bottom: 1px solid var(--tw-border);
}

.tw-table tr:hover td {
    background: rgba(26, 47, 35, 0.02);
}

.tw-form {
    width: 100%;
}

/* 发布页：表单 + 右侧须知两栏，填充右侧空白，对齐主系统内容布局 */
.tw-publish-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: var(--tw-space-4);
    align-items: start;
}

.tw-publish-aside {
    position: sticky;
    top: calc(var(--tw-space-3) + 72px);
    display: flex;
    flex-direction: column;
    gap: var(--tw-space-3);
}

.tw-aside-card {
    background: var(--tw-card, #fff);
    border: 1px solid var(--tw-border);
    border-radius: var(--tw-radius);
    padding: var(--tw-space-3);
}

.tw-aside-card h4 {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-family: var(--tw-font-display);
    font-size: 1rem;
    font-weight: 600;
    color: var(--tw-ink);
    margin: 0 0 var(--tw-space-2);
}

.tw-aside-card h4 svg {
    width: 18px;
    height: 18px;
    color: var(--tw-accent);
    flex-shrink: 0;
}

.tw-aside-card ol,
.tw-aside-card ul {
    margin: 0;
    padding-left: 1.1rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.tw-aside-card li {
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--tw-muted);
}

.tw-aside-card li b {
    color: var(--tw-ink);
    font-weight: 600;
}

.tw-aside-tip {
    display: flex;
    gap: 0.625rem;
    font-size: 0.8125rem;
    line-height: 1.6;
    color: var(--tw-muted-dark);
    background: var(--tw-accent-subtle);
    border: 1px solid rgba(83, 58, 253, 0.18);
    border-radius: var(--tw-radius);
    padding: 0.75rem 0.875rem;
}

.tw-aside-tip svg {
    width: 18px;
    height: 18px;
    color: var(--tw-accent);
    flex-shrink: 0;
    margin-top: 1px;
}

@media (max-width: 900px) {
    .tw-publish-layout {
        grid-template-columns: 1fr;
    }
    .tw-publish-aside {
        position: static;
        order: -1;
    }
}

.tw-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--tw-space-2);
}

@media (max-width: 600px) {
    .tw-form-row {
        grid-template-columns: 1fr;
    }
}

/* ========================================
   19. 交互动效
   ======================================== */
@media (prefers-reduced-motion: no-preference) {
    .tw-card,
    .tw-btn,
    .tw-tab,
    .tw-page-btn,
    .tw-form-group input,
    .tw-form-group textarea {
        transition: all 0.2s ease;
    }
}

/* ========================================
   20. 交付内容
   ======================================== */
.tw-delivery-content {
    font-size: 0.9375rem;
    line-height: 1.7;
    color: var(--tw-ink-light);
    margin-bottom: 0.75rem;
}

.tw-delivery-feedback {
    font-size: 0.875rem;
    color: var(--tw-muted);
    background: var(--tw-paper-dark);
    padding: 0.75rem 1rem;
    border-radius: var(--tw-radius-sm);
    margin-top: 0.75rem;
}

.tw-review-content {
    font-size: 0.9375rem;
    color: var(--tw-muted);
    line-height: 1.6;
    margin-top: 0.5rem;
}

.tw-stars {
    color: var(--tw-accent);
}

/* 评分选择 */
.tw-form-group select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237a7a72' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    padding-right: 2.5rem;
}

/* ========================================
   21. 新布局 - 主内容+侧边栏
   ======================================== */
.tw-layout {
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: var(--tw-space-4);
    align-items: start;
}

@media (max-width: 900px) {
    .tw-layout {
        grid-template-columns: 1fr;
    }
}

/* 主内容区 */
.tw-main {
    min-width: 0;
}

/* 统计概览 */
.tw-stats {
    display: flex;
    gap: var(--tw-space-3);
    margin-bottom: var(--tw-space-3);
    padding: var(--tw-space-2) var(--tw-space-3);
    background: var(--tw-paper-dark);
    border-radius: var(--tw-radius);
}

.tw-stat {
    display: flex;
    align-items: baseline;
    gap: 0.375rem;
}

.tw-stat-value {
    font-family: var(--tw-font-display);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--tw-ink);
}

.tw-stat-label {
    font-size: 0.8125rem;
    color: var(--tw-muted);
}

/* 任务列表 - 横向布局 */
.tw-task-list {
    display: flex;
    flex-direction: column;
    gap: var(--tw-space-2);
}

.tw-task-item {
    background: var(--tw-card, #ffffff);
    border: 1px solid var(--tw-border);
    border-radius: var(--tw-radius);
    padding: var(--tw-space-3);
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: var(--tw-space-3);
    align-items: center;
    transition: all 0.2s ease;
}

.tw-task-item:hover {
    border-color: var(--tw-ink);
    box-shadow: var(--tw-shadow);
}

@media (max-width: 768px) {
    .tw-task-item {
        grid-template-columns: 1fr;
        gap: var(--tw-space-2);
    }
}

.tw-task-main {
    min-width: 0;
}

.tw-task-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    flex-wrap: wrap;
}

.tw-task-title {
    font-family: var(--tw-font-display);
    font-size: 1rem;
    font-weight: 600;
    margin: 0 0 0.375rem;
    line-height: 1.3;
}

.tw-task-title a {
    color: var(--tw-ink);
    text-decoration: none;
}

.tw-task-title a:hover {
    color: var(--tw-accent-dark);
}

.tw-task-desc {
    font-size: 0.8125rem;
    color: var(--tw-muted);
    margin: 0;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.tw-task-sidebar {
    text-align: right;
}

.tw-task-budget {
    display: flex;
    align-items: baseline;
    gap: 0.25rem;
    white-space: nowrap;
}

.tw-budget-min {
    font-family: var(--tw-font-display);
    font-size: 1rem;
    font-weight: 600;
    color: var(--tw-muted);
}

.tw-budget-sep {
    color: var(--tw-muted-light);
    font-size: 0.75rem;
}

.tw-budget-max {
    font-family: var(--tw-font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--tw-ink);
}

.tw-task-meta {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 160px;
}

@media (max-width: 768px) {
    .tw-task-meta {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        min-width: 0;
    }
}

.tw-meta-row {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.tw-meta-item {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
    color: var(--tw-muted);
}

.tw-meta-item svg {
    flex-shrink: 0;
    opacity: 0.6;
}

.tw-task-action {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--tw-ink);
    text-decoration: none;
}

.tw-task-action:hover {
    color: var(--tw-accent-dark);
}

/* ========================================
   22. 侧边栏组件
   ======================================== */
.tw-sidebar {
    display: flex;
    flex-direction: column;
    gap: var(--tw-space-3);
}

@media (max-width: 900px) {
    .tw-sidebar {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    }
}

.tw-widget {
    background: var(--tw-card, #ffffff);
    border: 1px solid var(--tw-border);
    border-radius: var(--tw-radius);
    padding: var(--tw-space-2);
}

.tw-widget-title {
    font-family: var(--tw-font-display);
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--tw-ink);
    margin: 0 0 var(--tw-space-2);
    padding-bottom: 0.75rem;
    border-bottom: 1px solid var(--tw-border);
}

/* 热门列表 */
.tw-hot-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.tw-hot-item {
    margin-bottom: 0.75rem;
}

.tw-hot-item:last-child {
    margin-bottom: 0;
}

.tw-hot-link {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    text-decoration: none;
}

.tw-hot-title {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--tw-ink);
    line-height: 1.4;
}

.tw-hot-link:hover .tw-hot-title {
    color: var(--tw-accent-dark);
}

.tw-hot-meta {
    display: flex;
    gap: 0.75rem;
    font-size: 0.75rem;
    color: var(--tw-muted);
}

.tw-hot-bids {
    color: var(--tw-warning);
}

.tw-hot-price {
    font-weight: 600;
    color: var(--tw-ink);
}

/* 分类网格 */
.tw-category-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
}

.tw-category-chip {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--tw-muted);
    background: var(--tw-paper);
    border-radius: var(--tw-radius-sm);
    text-decoration: none;
    transition: all 0.2s ease;
}

.tw-category-chip:hover {
    background: var(--tw-paper-dark);
    color: var(--tw-ink);
}

/* 快捷操作链接组 */
.tw-quick-links {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

/* 平台数据统计 */
.tw-platform-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
}

.tw-platform-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.75rem 0.25rem;
    background: var(--tw-paper);
    border-radius: var(--tw-radius-sm);
}

.tw-platform-stat-value {
    font-family: var(--tw-font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--tw-accent-dark);
    line-height: 1.2;
}

.tw-platform-stat-label {
    font-size: 0.6875rem;
    color: var(--tw-muted);
    margin-top: 0.25rem;
}

/* 新手指南 */
.tw-guide-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.tw-guide-item {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.625rem 0;
    border-bottom: 1px solid var(--tw-border);
}

.tw-guide-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.tw-guide-item:first-child {
    padding-top: 0;
}

.tw-guide-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    font-size: 0.75rem;
    font-weight: 700;
    color: #fff;
    background: var(--tw-accent-dark);
    border-radius: 50%;
    flex-shrink: 0;
    line-height: 1;
}

.tw-guide-text {
    flex: 1;
    min-width: 0;
}

.tw-guide-text strong {
    display: block;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--tw-ink);
    margin-bottom: 0.125rem;
}

.tw-guide-text p {
    margin: 0;
    font-size: 0.75rem;
    color: var(--tw-muted);
    line-height: 1.4;
}

/* 空状态小字 */
.tw-empty-text-sm {
    margin: 0;
    font-size: 0.8125rem;
    color: var(--tw-muted);
    text-align: center;
    padding: 1rem 0;
}

/* 热门角标 */
.tw-card-hot {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.25rem 0.5rem;
    background: var(--tw-accent);
    color: var(--tw-ink);
    border-radius: var(--tw-radius-sm);
}

/* ========================================
   24. SVG 图标规范（统一 24x24，禁止 emoji）
   ======================================== */
.tw-icon { width: 16px; height: 16px; flex-shrink: 0; }
.tw-icon-sm { width: 14px; height: 14px; flex-shrink: 0; }
.tw-icon-lg { width: 22px; height: 22px; flex-shrink: 0; }

/* ========================================
   25. 分类导航（纯文本标签横排）
   ======================================== */
.tw-catnav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: var(--tw-space-4);
    padding: var(--tw-space-2);
    background: var(--tw-paper);
    border-radius: var(--tw-radius);
    border: 1px solid var(--tw-border);
}

.tw-catnav-item {
    display: inline-flex;
    align-items: center;
    padding: 0.5rem 1.25rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--tw-muted-dark);
    background: transparent;
    border: 1px solid transparent;
    border-radius: 999px;
    text-decoration: none;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.tw-catnav-item:hover {
    color: var(--tw-accent-dark);
    background: rgba(201, 162, 39, 0.08);
    border-color: rgba(201, 162, 39, 0.2);
}

.tw-catnav-item.active {
    color: var(--tw-ink);
    font-weight: 600;
    background: var(--tw-card, #ffffff);
    border-color: var(--tw-accent);
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

/* ========================================
   26. 状态筛选 Tab（个人中心等）
   ======================================== */
.tw-tabs {
    display: flex;
    gap: 0.25rem;
    margin-bottom: var(--tw-space-4);
    flex-wrap: wrap;
    border-bottom: 1px solid var(--tw-border);
}

.tw-tab-pill {
    font-family: var(--tw-font-body);
    font-size: 0.875rem;
    font-weight: 500;
    padding: 0.625rem 1rem;
    color: var(--tw-muted);
    text-decoration: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.tw-tab-pill:hover { color: var(--tw-ink); }

.tw-tab-pill.active {
    color: var(--tw-ink);
    border-bottom-color: var(--tw-accent);
    font-weight: 600;
}

.tw-tab-count {
    display: inline-block;
    min-width: 1.25rem;
    padding: 0 0.375rem;
    margin-left: 0.375rem;
    font-size: 0.6875rem;
    font-weight: 600;
    text-align: center;
    background: var(--tw-paper-dark);
    color: var(--tw-muted);
    border-radius: 999px;
}

.tw-tab-pill.active .tw-tab-count {
    background: var(--tw-accent);
    color: var(--tw-ink);
}

/* ========================================
   27. 页面头部（个人中心等统一）
   ======================================== */
.tw-page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--tw-space-2);
    margin-bottom: var(--tw-space-4);
    flex-wrap: wrap;
}

.tw-page-header h1 {
    font-family: var(--tw-font-display);
    font-size: clamp(1.5rem, 4vw, 2rem);
    font-weight: 700;
    color: var(--tw-ink);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.tw-page-header h1 svg { width: 26px; height: 26px; color: var(--tw-accent-dark); }

/* ========================================
   28. 列表卡片（我的任务 / 我的投标 统一）
   ======================================== */
.tw-list-cards { display: flex; flex-direction: column; gap: var(--tw-space-2); }

.tw-list-card {
    background: var(--tw-card, #ffffff);
    border: 1px solid var(--tw-border);
    border-radius: var(--tw-radius);
    padding: var(--tw-space-3);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--tw-space-3);
    transition: all 0.2s ease;
}

.tw-list-card:hover {
    border-color: var(--tw-ink);
    box-shadow: var(--tw-shadow);
}

.tw-list-card.tw-winner {
    border-color: var(--tw-accent);
    background: var(--tw-paper);
}

.tw-list-card-main { flex: 1; min-width: 0; }

.tw-list-card-header {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    flex-wrap: wrap;
    align-items: center;
}

.tw-list-card-title {
    font-family: var(--tw-font-display);
    font-size: 1.0625rem;
    font-weight: 600;
    margin: 0 0 0.5rem;
    line-height: 1.3;
}

.tw-list-card-title a { color: var(--tw-ink); text-decoration: none; }
.tw-list-card-title a:hover { color: var(--tw-accent-dark); }

.tw-list-card-meta {
    display: flex;
    gap: 1.25rem;
    font-size: 0.8125rem;
    color: var(--tw-muted);
    flex-wrap: wrap;
}

.tw-list-card-meta span {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}

.tw-list-card-meta svg { opacity: 0.6; flex-shrink: 0; }

.tw-list-card-actions {
    display: flex;
    gap: 0.5rem;
    flex-shrink: 0;
    flex-wrap: wrap;
}

.tw-bid-amount { color: var(--tw-accent-dark); font-weight: 700; }

.tw-bid-quote {
    margin-top: 0.5rem;
    font-size: 0.8125rem;
    color: var(--tw-muted);
    font-style: italic;
    padding-left: 0.75rem;
    border-left: 3px solid var(--tw-border);
}

.tw-winner-badge {
    padding: 0.25rem 0.625rem;
    background: var(--tw-accent);
    color: var(--tw-ink);
    border-radius: var(--tw-radius-sm);
    font-size: 0.75rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

/* ========================================
   29. 发布任务表单（统一 editorial，去紫）
   ======================================== */
.tw-form-tip { color: var(--tw-muted); font-size: 0.9375rem; }

.tw-form-card {
    background: var(--tw-card, #ffffff);
    border: 1px solid var(--tw-border);
    border-radius: var(--tw-radius);
    padding: var(--tw-space-3);
    margin-bottom: var(--tw-space-3);
}

.tw-form-card h3 {
    font-family: var(--tw-font-display);
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--tw-ink);
    margin: 0 0 var(--tw-space-2);
    padding-bottom: var(--tw-space-1);
    border-bottom: 1px solid var(--tw-border);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.tw-form-card h3 svg { width: 18px; height: 18px; color: var(--tw-accent-dark); }

.tw-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--tw-space-2); }

.tw-help { display: block; font-size: 0.75rem; color: var(--tw-muted-light); margin-top: 0.375rem; }

.tw-required { color: var(--tw-danger); }

.tw-budget-preview {
    background: var(--tw-paper);
    border-left: 4px solid var(--tw-accent);
    border-radius: var(--tw-radius);
    padding: var(--tw-space-2);
    margin-bottom: var(--tw-space-2);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.tw-budget-preview .tw-budget-label { font-size: 0.875rem; color: var(--tw-muted); }

.tw-budget-preview .tw-budget-value {
    font-family: var(--tw-font-display);
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--tw-ink);
}

/* ========================================
   30. 按钮变体补充
   ======================================== */
.tw-btn-outline {
    background: var(--tw-paper);
    color: var(--tw-ink);
    border: 1px solid var(--tw-border);
}
.tw-btn-outline:hover { background: var(--tw-paper-dark); color: var(--tw-ink); }

.tw-btn-cancel {
    background: #fff;
    color: var(--tw-danger);
    border: 1px solid var(--tw-border);
}
.tw-btn-cancel:hover { background: var(--tw-paper-dark); }

.tw-btn-ghost {
    background: transparent;
    color: var(--tw-muted);
    border: 1px solid var(--tw-border);
}
.tw-btn-ghost:hover { background: var(--tw-paper-dark); color: var(--tw-ink); }

/* ========================================
   31. 响应式补充
   ======================================== */
@media (max-width: 768px) {
    .tw-form-row { grid-template-columns: 1fr; }
    .tw-page-header { flex-direction: column; align-items: flex-start; }
    .tw-list-card { flex-direction: column; align-items: flex-start; }
    .tw-list-card-actions { width: 100%; }
    .tw-list-card-actions .tw-btn { flex: 1; justify-content: center; }
    .tw-list-card-meta { gap: 0.75rem; }
}

/* 任务卡片预算小标签 */
.tw-task-budget-cap {
    display: block;
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--tw-muted-light);
    margin-bottom: 0.25rem;
}

/* 表单操作区 */
.tw-form-actions {
    display: flex;
    justify-content: flex-end;
    gap: var(--tw-space-2);
    padding-top: var(--tw-space-1);
}

@media (max-width: 768px) {
    .tw-form-actions { flex-direction: column; }
    .tw-form-actions .tw-btn { width: 100%; justify-content: center; }
}

.tw-form-header h1 {
    font-family: var(--tw-font-display);
    font-size: clamp(1.5rem, 4vw, 2rem);
    font-weight: 700;
    color: var(--tw-ink);
    margin: 0 0 var(--tw-space-1);
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.tw-form-header h1 svg { color: var(--tw-accent-dark); }
/* ============================================================
   28. Ui Ux Pro Max 重构补充 - 反馈/加载/搜索/Hero/无障碍
   ============================================================ */

/* ---- 28.1 Toast 轻提示（替代原生 alert） ---- */
.tw-toast-wrap {
    position: fixed;
    top: 1.25rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    pointer-events: none;
    width: calc(100% - 2rem);
    max-width: 420px;
}

.tw-toast {
    pointer-events: auto;
    cursor: pointer;
    font-family: var(--tw-font-body);
    font-size: 0.875rem;
    font-weight: 500;
    line-height: 1.45;
    padding: 0.75rem 1.125rem;
    border-radius: var(--tw-radius);
    background: var(--tw-ink);
    color: var(--tw-paper);
    box-shadow: 0 8px 24px rgba(26, 47, 35, 0.22);
    border: 1px solid rgba(255, 255, 255, 0.08);
    opacity: 0;
    transform: translateY(-12px) scale(0.98);
    transition: opacity 0.22s ease, transform 0.22s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.tw-toast-show {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.tw-toast-success { background: var(--tw-success); color: #fff; }
.tw-toast-error { background: var(--tw-danger); color: #fff; }
.tw-toast-info { background: var(--tw-ink); color: var(--tw-paper); }

/* ---- 28.2 加载动画 ---- */
.tw-spinner {
    width: 15px;
    height: 15px;
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-top-color: #fff;
    border-radius: 50%;
    display: inline-block;
    animation: tw-spin 0.6s linear infinite;
    flex-shrink: 0;
}

@keyframes tw-spin { to { transform: rotate(360deg); } }

.tw-is-loading { opacity: 0.85; cursor: progress; }

/* 表单内联错误 */
.tw-form-error {
    display: none;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--tw-danger);
    background: rgba(155, 44, 44, 0.06);
    border: 1px solid rgba(155, 44, 44, 0.18);
    border-radius: var(--tw-radius-sm);
    padding: 0.625rem 0.875rem;
    margin-bottom: var(--tw-space-3);
}

.tw-form-error.tw-show { display: flex; }

.tw-input-error {
    border-color: var(--tw-danger) !important;
    background: rgba(155, 44, 44, 0.03);
}

/* ---- 28.3 搜索栏（index 顶部） ---- */
.tw-searchbar {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--tw-card, #fff);
    border: 1px solid var(--tw-border);
    border-radius: 999px;
    padding: 0.375rem 0.5rem 0.375rem 1rem;
    margin-bottom: var(--tw-space-3);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.tw-searchbar:focus-within {
    border-color: var(--tw-ink);
    box-shadow: 0 0 0 3px rgba(26, 47, 35, 0.06);
}

.tw-searchbar svg {
    width: 18px;
    height: 18px;
    color: var(--tw-muted);
    flex-shrink: 0;
}

.tw-searchbar input {
    flex: 1;
    min-width: 0;
    border: none;
    outline: none;
    background: transparent;
    font-family: var(--tw-font-body);
    font-size: 0.9375rem;
    color: var(--tw-ink);
    padding: 0.5rem 0;
}

.tw-searchbar input::placeholder { color: var(--tw-muted-light); }

.tw-searchbar button {
    flex-shrink: 0;
    border: none;
    background: var(--tw-accent);
    color: #fff;
    font-family: var(--tw-font-body);
    font-size: 0.8125rem;
    font-weight: 600;
    padding: 0.5rem 1.125rem;
    border-radius: 999px;
    cursor: pointer;
    transition: background 0.2s ease;
    min-height: 38px;
}

.tw-searchbar button:hover { background: var(--tw-accent-dark); }

/* ---- 28.4 Hero 强化（index 头部） ---- */
.tw-hero {
    position: relative;
    background: linear-gradient(135deg, #533afd 0%, #7c3aed 100%);
    border-radius: var(--tw-radius-lg);
    padding: var(--tw-space-4) var(--tw-space-4);
    margin-bottom: var(--tw-space-4);
    overflow: hidden;
    color: #fff;
}

.tw-hero::after {
    content: '';
    position: absolute;
    right: -40px;
    top: -40px;
    width: 180px;
    height: 180px;
    background: radial-gradient(circle, rgba(201, 162, 39, 0.22), transparent 70%);
    pointer-events: none;
}

.tw-hero-inner {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--tw-space-3);
    flex-wrap: wrap;
}

.tw-hero-title {
    font-family: var(--tw-font-display);
    font-size: clamp(1.5rem, 4vw, 2.25rem);
    font-weight: 700;
    letter-spacing: -0.02em;
    margin: 0 0 0.5rem;
    color: var(--tw-paper);
}

.tw-hero .tw-hero-sub {
    font-size: 0.9375rem;
    color: rgba(255, 255, 255, 0.95);
    font-weight: 500;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.12);
    margin: 0;
    max-width: 42ch;
}

.tw-hero .tw-btn-primary {
    background: #fff;
    color: #533afd;
    border-color: #fff;
    box-shadow: 0 4px 14px rgba(83, 58, 253, 0.28);
}

.tw-hero .tw-btn-primary:hover {
    background: #f4f2ff;
    color: #4338ca;
    border-color: #f4f2ff;
    box-shadow: 0 6px 18px rgba(83, 58, 253, 0.35);
}

/* ---- 28.5 预算范围可视化（create 页） ---- */
.tw-budget-bar {
    position: relative;
    height: 8px;
    background: var(--tw-paper-dark);
    border-radius: 999px;
    margin: 0.75rem 0;
    overflow: hidden;
}

.tw-budget-bar-fill {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 100%;
    background: linear-gradient(90deg, var(--tw-accent-dark), var(--tw-accent));
    border-radius: 999px;
    transition: left 0.25s ease, right 0.25s ease;
}

/* ---- 28.6 无障碍 - 可见焦点环 ---- */
.tw-container a:focus-visible,
.tw-container button:focus-visible,
.tw-container input:focus-visible,
.tw-container textarea:focus-visible,
.tw-container select:focus-visible,
.tw-container [tabindex]:focus-visible {
    outline: 2px solid var(--tw-accent);
    outline-offset: 2px;
}

/* ---- 28.7 触控目标 ≥ 44px ---- */
.tw-btn,
.tw-tab,
.tw-page-btn,
.tw-catnav-item,
.tw-action-btn,
.tw-task-action,
.tw-category-chip {
    min-height: 44px;
    align-items: center;
    justify-content: center;
}

/* 紧凑型（含图标）允许略小但≥40 */
.tw-icon-btn,
.tw-searchbar button {
    min-height: 40px;
}

/* ---- 28.8 列表项 hover 提升（统一编辑风） ---- */
.tw-task-item:hover .tw-task-title a,
.tw-hot-link:hover .tw-hot-title {
    color: var(--tw-accent-dark);
}

/* 移动端：搜索栏与筛选换行不溢出 */
@media (max-width: 768px) {
    .tw-hero-inner { flex-direction: column; align-items: flex-start; }
    .tw-hero .tw-btn { width: 100%; justify-content: center; }
    .tw-searchbar { padding-left: 0.875rem; }
}

/* ============================================================
   29. 富文本编辑器（任务描述）
   ============================================================ */
.tw-editor-host {
    border: 1.5px solid var(--tw-border, #e5edf5);
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.tw-editor-host:focus-within {
    border-color: var(--tw-accent, #533afd);
    box-shadow: 0 0 0 3px rgba(83, 58, 253, .12);
}
.tw-editor-host .ql-toolbar.ql-snow {
    border: none;
    border-bottom: 1px solid var(--tw-border, #e5edf5);
    background: #fafbff;
    border-radius: 12px 12px 0 0;
    padding: 8px 10px;
}
.tw-editor-host .ql-container.ql-snow {
    border: none;
    font-family: inherit;
    font-size: 0.9375rem;
    color: var(--tw-ink, #061b31);
}
.tw-editor-host .ql-editor {
    min-height: 240px;
    padding: 14px 16px;
    line-height: 1.7;
}
.tw-editor-host .ql-editor.ql-blank::before {
    color: #9aa7b8;
    font-style: normal;
    left: 16px;
}
.tw-editor-host .ql-snow .ql-stroke { stroke: var(--tw-ink, #061b31); }
.tw-editor-host .ql-snow .ql-fill { fill: var(--tw-ink, #061b31); }
.tw-editor-host .ql-snow.ql-toolbar button:hover .ql-stroke,
.tw-editor-host .ql-snow.ql-toolbar button.ql-active .ql-stroke { stroke: var(--tw-accent, #533afd); }
.tw-editor-host .ql-snow.ql-toolbar button:hover .ql-fill,
.tw-editor-host .ql-snow.ql-toolbar button.ql-active .ql-fill { fill: var(--tw-accent, #533afd); }
/* 极端兜底：Quill 不可用时的纯文本域 */
.tw-editor-fallback {
    width: 100%;
    min-height: 240px;
    border: 1.5px solid var(--tw-border, #e5edf5);
    border-radius: 12px;
    padding: 14px 16px;
    font: inherit;
    line-height: 1.7;
    resize: vertical;
    box-sizing: border-box;
    color: var(--tw-ink, #061b31);
}
.tw-editor-fallback:focus {
    outline: none;
    border-color: var(--tw-accent, #533afd);
    box-shadow: 0 0 0 3px rgba(83, 58, 253, .12);
}

/* ===== 任务详情页：发布者视角侧边栏卡片（填充右侧空白） ===== */
.tw-owner-card .tw-owner-head {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: var(--tw-space-2);
}
.tw-owner-meta {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}
.tw-owner-name {
    font-weight: 600;
    font-size: 0.9375rem;
    color: var(--tw-ink, #061b31);
}
.tw-owner-tag {
    display: inline-block;
    font-size: 0.6875rem;
    color: var(--tw-accent, #533afd);
    background: rgba(83, 58, 253, .08);
    border-radius: 999px;
    padding: 2px 8px;
}
.tw-owner-stats {
    display: flex;
    gap: 0.5rem;
}
.tw-owner-stats > div {
    flex: 1;
    background: var(--tw-paper, #f7faff);
    border: 1px solid var(--tw-border, #e5edf5);
    border-radius: var(--tw-radius-sm, 10px);
    padding: 0.625rem 0.5rem;
    text-align: center;
}
.tw-owner-stats strong {
    display: block;
    font-size: 1.125rem;
    color: var(--tw-ink, #061b31);
    font-family: var(--tw-font-display);
}
.tw-owner-stats span {
    font-size: 0.75rem;
    color: var(--tw-muted, #6b7a90);
}
.tw-owner-joined {
    margin-top: var(--tw-space-2);
    font-size: 0.75rem;
    color: var(--tw-muted, #6b7a90);
}

/* 任务数据卡 */
.tw-task-stats .tw-stat-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 0;
    border-bottom: 1px dashed var(--tw-border, #e5edf5);
    font-size: 0.875rem;
    color: var(--tw-muted, #6b7a90);
}
.tw-task-stats .tw-stat-row:last-child { border-bottom: none; }
.tw-task-stats .tw-stat-row strong { color: var(--tw-ink, #061b31); }
.tw-task-stats .tw-stat-row svg { margin-right: 4px; vertical-align: -2px; color: var(--tw-accent, #533afd); }

/* 任务管理卡 */
.tw-manage-card .tw-manage-link {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 0;
    font-size: 0.875rem;
    color: var(--tw-ink, #061b31);
    text-decoration: none;
    border-bottom: 1px dashed var(--tw-border, #e5edf5);
}
.tw-manage-card .tw-manage-link:last-of-type { border-bottom: none; }
.tw-manage-card .tw-manage-link svg { color: var(--tw-accent, #533afd); }
.tw-manage-card .tw-manage-link:hover { color: var(--tw-accent, #533afd); }
.tw-mt { margin-top: var(--tw-space-2); }

/* 发布者须知卡 */
.tw-tips-card .tw-tips-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.tw-tips-card .tw-tips-list li {
    position: relative;
    padding-left: 1.1rem;
    font-size: 0.8125rem;
    line-height: 1.6;
    color: var(--tw-muted, #6b7a90);
    margin-bottom: 0.5rem;
}
.tw-tips-card .tw-tips-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.5rem;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--tw-accent, #533afd);
}

/* ── 成交金额 / 结算标记 ── */
.tw-settled-row {
    margin-top: 4px;
    padding-top: 8px;
    border-top: 1px dashed var(--tw-border, #e5edf5);
}
.tw-settled-amount {
    color: var(--tw-accent-dark, #3f2ed1);
    font-weight: 700;
}
.tw-settled-tag {
    display: inline-block;
    margin-left: 8px;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    color: var(--tw-accent, #533afd);
    background: var(--tw-accent-subtle, rgba(83, 58, 253, 0.06));
    border: 1px solid var(--tw-accent, #533afd);
}
.tw-amt {
    color: var(--tw-accent-dark, #3f2ed1);
}
.tw-settled-at {
    margin-left: 6px;
    font-size: 12px;
    color: #8a94a6;
}

/* ── 保证金（冻结中）标记 ── */
.tw-frozen-row {
    margin-top: 4px;
    padding-top: 8px;
    border-top: 1px dashed var(--tw-border, #e5edf5);
}
.tw-frozen-amount {
    color: #d97706;
    font-weight: 700;
}
.tw-frozen-tag {
    display: inline-block;
    margin-left: 8px;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    color: #d97706;
    background: rgba(217, 119, 6, 0.08);
    border: 1px solid #d97706;
}

/* ── 争议处理 ── */
.tw-dispute-banner {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 14px 0;
    padding: 12px 16px;
    border-radius: 10px;
    background: rgba(220, 38, 38, 0.06);
    border: 1px solid rgba(220, 38, 38, 0.35);
    border-left: 4px solid #dc2626;
    color: #991b1b;
    font-size: 13px;
    line-height: 1.6;
}
.tw-dispute-banner b { color: #dc2626; }
.tw-dispute-card.tw-info-card {
    border-color: rgba(220, 38, 38, 0.35);
}
.tw-dispute-tip {
    font-size: 12px;
    color: var(--tw-ink-muted, #6b7280);
    margin: 8px 0 12px;
    line-height: 1.6;
}
.tw-dispute-form {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed var(--tw-border, #e5edf5);
}
.tw-req { color: #dc2626; }

/* 危险按钮（取消 / 发起争议） */
.tw-btn-danger {
    background: #dc2626;
    color: #fff;
    border: 1px solid #dc2626;
}
.tw-btn-danger:hover {
    background: #b91c1c;
}