/**
 * XWRR Links - 友链申请样式
 * 简约精致风格 v1.0
 * 依赖 xwrr-design-system.css 变量系统
 */

/* ==================== 容器基础样式 ==================== */
.xwrr-links-wrapper {
    max-width: 800px;
    margin: 0 auto;
    padding: var(--xwrr-space-6);
}

/* ==================== 表单容器 ==================== */
.xwrr-form-container {
    background: var(--xwrr-color-bg-elevated);
    border-radius: var(--xwrr-radius-2xl);
    padding: var(--xwrr-space-8);
    box-shadow: var(--xwrr-shadow-lg);
    border: 1px solid var(--xwrr-color-border-light);
    transition: box-shadow var(--xwrr-transition-base);
    animation: slideUp 0.3s ease;
}

.xwrr-form-container:hover {
    box-shadow: var(--xwrr-shadow-xl);
}

.xwrr-form-title {
    margin: 0 0 var(--xwrr-space-6);
    font-size: var(--xwrr-text-xl);
    font-weight: var(--xwrr-font-semibold);
    color: var(--xwrr-color-text-primary);
    text-align: center;
}

/* ==================== 表单组件 ==================== */
.xwrr-form-group {
    margin-bottom: var(--xwrr-space-5);
}

.xwrr-form-group label {
    display: block;
    margin-bottom: var(--xwrr-space-2);
    font-size: var(--xwrr-text-sm);
    font-weight: var(--xwrr-font-medium);
    color: var(--xwrr-color-text-primary);
}

.xwrr-required {
    color: var(--xwrr-error-500);
    margin-left: 2px;
}

.xwrr-form-group input,
.xwrr-form-group textarea {
    width: 100%;
    padding: 10px 14px;
    font-size: var(--xwrr-text-sm);
    color: var(--xwrr-color-text-primary);
    background: var(--xwrr-color-bg-secondary);
    border: 1px solid var(--xwrr-color-border-light);
    border-radius: var(--xwrr-radius-lg);
    transition: all var(--xwrr-transition-fast);
    outline: none;
    line-height: 1.5;
}

.xwrr-form-group input:focus,
.xwrr-form-group textarea:focus {
    border-color: var(--xwrr-color-primary);
    box-shadow: 0 0 0 1px var(--xwrr-primary-100);
    background: var(--xwrr-color-bg-elevated);
}

.xwrr-form-group input::placeholder,
.xwrr-form-group textarea::placeholder {
    color: var(--xwrr-color-text-tertiary);
}

.xwrr-hint {
    margin: 6px 0 0;
    font-size: var(--xwrr-text-xs);
    color: var(--xwrr-color-text-tertiary);
    line-height: 1.4;
}

/* ==================== URL输入组件 ==================== */
.xwrr-url-input-wrapper {
    display: flex;
    gap: var(--xwrr-space-3);
}

.xwrr-url-input-wrapper input {
    flex: 1;
}

.xwrr-auto-fetch-btn {
    padding: var(--xwrr-space-3) var(--xwrr-space-5);
    background: var(--xwrr-color-bg-secondary);
    border: 1px solid var(--xwrr-color-border-light);
    border-radius: var(--xwrr-radius-lg);
    color: var(--xwrr-color-text-secondary);
    font-size: var(--xwrr-text-sm);
    font-weight: var(--xwrr-font-medium);
    cursor: pointer;
    white-space: nowrap;
    transition: all var(--xwrr-transition-base);
}

.xwrr-auto-fetch-btn:hover {
    background: var(--xwrr-color-primary);
    border-color: var(--xwrr-color-primary);
    color: var(--xwrr-color-text-inverse);
}

/* ==================== 验证码组件 ==================== */
.xwrr-captcha-container {
    margin: var(--xwrr-space-6) 0;
    padding: var(--xwrr-space-5);
    background: var(--xwrr-color-bg-secondary);
    border-radius: var(--xwrr-radius-xl);
    border: 1px solid var(--xwrr-color-border-light);
    text-align: center;
}

.xwrr-captcha-container label {
    text-align: left;
    margin-bottom: var(--xwrr-space-3);
}

.xwrr-simple-captcha {
    display: block;
    width: 100%;
    max-width: 300px;
    margin: 0 auto;
}

.xwrr-simple-captcha-box {
    width: 100%;
    height: 64px;
    background: var(--xwrr-color-bg-elevated);
    border: 2px dashed var(--xwrr-color-border-medium);
    border-radius: var(--xwrr-radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    user-select: none;
    transition: all var(--xwrr-transition-base);
}

.xwrr-simple-captcha-box:hover {
    border-color: var(--xwrr-color-primary);
    transform: scale(1.01);
}

.xwrr-simple-captcha-box.success {
    border: 2px solid var(--xwrr-success-500);

}

.xwrr-simple-captcha-box.error {
    border: 2px solid var(--xwrr-error-500);
    background: var(--xwrr-error-50);
    animation: shake 0.4s ease;
}

.xwrr-simple-captcha-box.refreshing {
    animation: pulse 0.3s ease;
}

@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(0.98); opacity: 0.8; }
    100% { transform: scale(1); }
}

.xwrr-simple-captcha-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--xwrr-space-2);
}

.xwrr-simple-captcha-icon {
    width: 28px;
    height: 28px;
    color: var(--xwrr-color-primary);
    transition: color var(--xwrr-transition-base);
}

.xwrr-simple-captcha-box.success .xwrr-simple-captcha-icon {
    color: var(--xwrr-success-500);
}

.xwrr-simple-captcha-box.error .xwrr-simple-captcha-icon {
    color: var(--xwrr-error-500);
}

.xwrr-simple-captcha-text {
    font-size: var(--xwrr-text-sm);
    font-weight: var(--xwrr-font-medium);
    color: var(--xwrr-color-text-secondary);
}

.xwrr-simple-captcha-box.success .xwrr-simple-captcha-text {
    color: var(--xwrr-success-600);
}

.xwrr-simple-captcha-box.error .xwrr-simple-captcha-text {
    color: var(--xwrr-error-600);
}

.xwrr-simple-captcha-loading {
    display: none;
    flex-direction: column;
    align-items: center;
    gap: var(--xwrr-space-3);
}

.xwrr-simple-captcha-spinner {
    width: 28px;
    height: 28px;
    border: 3px solid var(--xwrr-color-border-light);
    border-top-color: var(--xwrr-color-primary);
    border-radius: 50%;
    animation: spin 0.7s linear infinite;
}

.xwrr-simple-captcha-loading span {
    font-size: var(--xwrr-text-sm);
    color: var(--xwrr-color-text-tertiary);
}

/* ==================== 提交按钮 ==================== */
.xwrr-form-actions {
    margin-top: var(--xwrr-space-8);
    text-align: center;
}

.xwrr-submit-btn {
    min-width: 200px;
    padding: var(--xwrr-space-4) var(--xwrr-space-8);
    font-size: var(--xwrr-text-base);
    font-weight: var(--xwrr-font-semibold);
    color: var(--xwrr-color-text-inverse);
    background: var(--xwrr-color-primary);
    border: none;
    border-radius: var(--xwrr-radius-lg);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--xwrr-space-2);
    height: 48px;
    transition: all var(--xwrr-transition-base);
    box-shadow: var(--xwrr-shadow-primary);
}

.xwrr-submit-btn:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: var(--xwrr-shadow-xl);
    background: var(--xwrr-color-primary-hover);
}

.xwrr-submit-btn:disabled {
    background: var(--xwrr-color-border-medium);
    cursor: not-allowed;
    box-shadow: none;
    transform: none;
    color: var(--xwrr-color-text-tertiary);
}

.xwrr-submit-btn.xwrr-submit-ready {
    background: var(--xwrr-success-500);

}

.xwrr-submit-btn.xwrr-submit-ready:hover:not(:disabled) {
    background: var(--xwrr-success-600);
}

.xwrr-submit-hint {
    margin-top: var(--xwrr-space-4);
    font-size: var(--xwrr-text-sm);
    color: var(--xwrr-color-text-tertiary);
}

.xwrr-submit-hint.xwrr-hint-ready {
    color: var(--xwrr-success-500);
    font-weight: var(--xwrr-font-medium);
}

/* ==================== 消息提示 ==================== */
.xwrr-message {
    margin-bottom: var(--xwrr-space-6);
    padding: var(--xwrr-space-4) var(--xwrr-space-5);
    border-radius: var(--xwrr-radius-lg);
    font-size: var(--xwrr-text-sm);
    display: none;
    animation: fadeIn 0.3s ease;
}

.xwrr-message.success {
    display: block;
    background: var(--xwrr-success-50);
    color: var(--xwrr-success-600);
    border: 1px solid var(--xwrr-success-500);
}

.xwrr-message.error {
    display: block;
    background: var(--xwrr-error-50);
    color: var(--xwrr-error-600);
    border: 1px solid var(--xwrr-error-500);
}

/* ==================== 我的友链模块 ==================== */
.xwrr-my-links {
    background: var(--xwrr-color-bg-elevated);
    border-radius: var(--xwrr-radius-2xl);
    padding: var(--xwrr-space-6);
    box-shadow: var(--xwrr-shadow-lg);
    border: 1px solid var(--xwrr-color-border-light);
    transition: box-shadow var(--xwrr-transition-base);
    animation: slideUp 0.3s ease;
}

.xwrr-my-links:hover {
    box-shadow: var(--xwrr-shadow-xl);
}

/* ==================== 统计栏 ==================== */
.xwrr-stats-bar {
    display: flex;
    gap: var(--xwrr-space-3);
    margin-bottom: var(--xwrr-space-5);
    padding: var(--xwrr-space-4);
    background: var(--xwrr-color-bg-secondary);
    border-radius: var(--xwrr-radius-xl);
}

.xwrr-stat-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: var(--xwrr-space-3);
    background: var(--xwrr-color-bg-elevated);
    border-radius: var(--xwrr-radius-lg);
    border: 1px solid var(--xwrr-color-border-light);
    transition: all var(--xwrr-transition-base);
}

.xwrr-stat-item:hover {
    transform: translateY(-2px);
    box-shadow: var(--xwrr-shadow);
}

.xwrr-stat-value {
    font-size: var(--xwrr-text-xl);
    font-weight: var(--xwrr-font-bold);
    color: var(--xwrr-color-text-primary);
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.xwrr-stat-label {
    font-size: var(--xwrr-text-xs);
    color: var(--xwrr-color-text-tertiary);
    font-weight: var(--xwrr-font-medium);
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.xwrr-stat-normal .xwrr-stat-value { color: var(--xwrr-success-500); }
.xwrr-stat-error .xwrr-stat-value { color: var(--xwrr-error-500); }
.xwrr-stat-backlink .xwrr-stat-value { color: var(--xwrr-warning-500); }

/* ==================== 表格头部 ==================== */
.xwrr-table-header {
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--xwrr-space-4);
    flex-wrap: wrap;
    gap: var(--xwrr-space-3);
}

.xwrr-table-title {
    margin: 0;
    font-size: var(--xwrr-text-lg);
    font-weight: var(--xwrr-font-semibold);
    color: var(--xwrr-color-text-primary);
}

.xwrr-tabs {
    gap: var(--xwrr-space-2);
}

.xwrr-tab {
    padding: var(--xwrr-space-2) var(--xwrr-space-4);
    font-size: var(--xwrr-text-sm);
    font-weight: var(--xwrr-font-medium);
    color: var(--xwrr-color-text-secondary);
    background: var(--xwrr-color-bg-secondary);
    border: 1px solid var(--xwrr-color-border-light);
    border-radius: var(--xwrr-radius-lg);
    cursor: pointer;
    transition: all var(--xwrr-transition-fast);
}

.xwrr-tab:hover {
    color: var(--xwrr-color-primary);
    border-color: var(--xwrr-color-primary);
}

.xwrr-tab.active {
    color: var(--xwrr-color-text-inverse);
    background: var(--xwrr-color-primary);
    border-color: var(--xwrr-color-primary);
}

.xwrr-status-tab {
    padding: 6px 12px;
    font-size: 13px;
    font-weight: 500;
    color: #64748b;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.xwrr-status-tab:hover {
    color: #3b82f6;
    border-color: #3b82f6;
}

.xwrr-status-tab.active {
    color: #fff;
    background: #3b82f6;
    border-color: #3b82f6;
}

/* ==================== 表格样式 ==================== */
.xwrr-links-table-container {
    overflow-x: auto;
    border-radius: var(--xwrr-radius-xl);
    border: 1px solid var(--xwrr-color-border-light);
    background: var(--xwrr-color-bg-elevated);
    -webkit-overflow-scrolling: touch;
}

.xwrr-links-table {
    width: 100%;
    min-width: 600px;
    border-collapse: collapse;
    font-size: var(--xwrr-text-sm);
}

.xwrr-links-table th,
.xwrr-links-table td {
    padding: 12px 16px;
    text-align: left;
    vertical-align: middle;
    border-bottom: 1px solid var(--xwrr-color-border-light);
}

.xwrr-links-table th {
    position: sticky;
    top: 0;
    z-index: 10;
    background: var(--xwrr-color-bg-secondary);
    font-weight: var(--xwrr-font-semibold);
    color: var(--xwrr-color-text-secondary);
    font-size: var(--xwrr-text-xs);
    text-transform: uppercase;
    letter-spacing: 0.3px;
    white-space: nowrap;
}

.xwrr-links-table td {
    color: var(--xwrr-color-text-primary);
    line-height: 1.5;
}

.xwrr-links-table td:first-child {
    display: flex;
    align-items: center;
    gap: 10px;
}

.xwrr-links-table tbody tr:last-child td {
    border-bottom: none;
}

.xwrr-links-table tbody tr {
    transition: background var(--xwrr-transition-fast);
}

.xwrr-links-table tbody tr:hover {
    background: var(--xwrr-color-bg-secondary);
}

/* 空状态 */
.xwrr-table-empty {
    text-align: center;
    padding: var(--xwrr-space-10) var(--xwrr-space-4);
    color: var(--xwrr-color-text-tertiary);
}

.xwrr-table-empty-icon {
    width: 48px;
    height: 48px;
    margin: 0 auto var(--xwrr-space-4);
    opacity: 0.5;
}

.xwrr-table-empty-text {
    font-size: var(--xwrr-text-sm);
}

/* 加载骨架屏 */
.xwrr-table-skeleton {
    padding: var(--xwrr-space-3) var(--xwrr-space-4);
}

.xwrr-skeleton-row {
    display: flex;
    gap: var(--xwrr-space-4);
    padding: var(--xwrr-space-3) var(--xwrr-space-4);
}

.xwrr-skeleton-cell {
    height: 16px;
    background: linear-gradient(90deg, var(--xwrr-color-bg-secondary) 25%, var(--xwrr-color-bg-tertiary) 50%, var(--xwrr-color-bg-secondary) 75%);
    background-size: 200% 100%;
    animation: skeleton-loading 1.5s infinite;
    border-radius: var(--xwrr-radius-sm);
}

.xwrr-skeleton-row:nth-child(1) .xwrr-skeleton-cell:nth-child(1) { width: 25%; }
.xwrr-skeleton-row:nth-child(1) .xwrr-skeleton-cell:nth-child(2) { width: 35%; }
.xwrr-skeleton-row:nth-child(1) .xwrr-skeleton-cell:nth-child(3) { width: 15%; }
.xwrr-skeleton-row:nth-child(1) .xwrr-skeleton-cell:nth-child(4) { width: 15%; }
.xwrr-skeleton-row:nth-child(1) .xwrr-skeleton-cell:nth-child(5) { width: 10%; }

.xwrr-skeleton-row:nth-child(2) .xwrr-skeleton-cell:nth-child(1) { width: 30%; }
.xwrr-skeleton-row:nth-child(2) .xwrr-skeleton-cell:nth-child(2) { width: 30%; }
.xwrr-skeleton-row:nth-child(2) .xwrr-skeleton-cell:nth-child(3) { width: 12%; }
.xwrr-skeleton-row:nth-child(2) .xwrr-skeleton-cell:nth-child(4) { width: 18%; }
.xwrr-skeleton-row:nth-child(2) .xwrr-skeleton-cell:nth-child(5) { width: 10%; }

.xwrr-skeleton-row:nth-child(3) .xwrr-skeleton-cell:nth-child(1) { width: 20%; }
.xwrr-skeleton-row:nth-child(3) .xwrr-skeleton-cell:nth-child(2) { width: 40%; }
.xwrr-skeleton-row:nth-child(3) .xwrr-skeleton-cell:nth-child(3) { width: 15%; }
.xwrr-skeleton-row:nth-child(3) .xwrr-skeleton-cell:nth-child(4) { width: 15%; }
.xwrr-skeleton-row:nth-child(3) .xwrr-skeleton-cell:nth-child(5) { width: 10%; }

@keyframes skeleton-loading {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ==================== 状态标签 ==================== */
.xwrr-status-normal,
.xwrr-status-error,
.xwrr-status-unknown {
    font-weight: var(--xwrr-font-medium);
    display: inline-flex;
    align-items: center;
    gap: var(--xwrr-space-1);
    padding: var(--xwrr-space-1) var(--xwrr-space-3);
    border-radius: var(--xwrr-radius-full);
    font-size: var(--xwrr-text-xs);
}

.xwrr-status-normal {
    color: var(--xwrr-success-600);
    background: var(--xwrr-success-50);
}

.xwrr-status-error {
    color: var(--xwrr-error-600);
    background: var(--xwrr-error-50);
}

.xwrr-status-unknown {
    color: var(--xwrr-color-text-tertiary);
    background: var(--xwrr-color-bg-secondary);
}

.xwrr-response-time {
    font-family: var(--xwrr-font-mono);
    color: var(--xwrr-color-text-tertiary);
    font-size: var(--xwrr-text-sm);
}

/* ==================== 链接项 ==================== */
.xwrr-link-item {
    display: flex;
    align-items: center;
    gap: var(--xwrr-space-3);
    padding: var(--xwrr-space-3) var(--xwrr-space-4);
    border-radius: var(--xwrr-radius-lg);
    transition: background var(--xwrr-transition-fast);
}

.xwrr-link-item:hover {
    background: var(--xwrr-color-bg-secondary);
}

.xwrr-link-item > a {
    display: inline-flex;
    align-items: center;
    gap: var(--xwrr-space-3);
    text-decoration: none;
    color: inherit;
}

.xwrr-link-logo {
    width: 18px !important;
    height: 18px !important;
    border-radius: 6px !important;
    object-fit: cover !important;
    flex-shrink: 0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.xwrr-link-name {
    font-size: var(--xwrr-text-sm);
    font-weight: var(--xwrr-font-medium);
    color: var(--xwrr-color-text-primary);
}

/* ==================== 加载状态 ==================== */
.xwrr-loading {
    text-align: center;
    padding: var(--xwrr-space-10) var(--xwrr-space-5);
    color: var(--xwrr-color-text-tertiary);
}

.xwrr-loading-text {
    display: inline-flex;
    align-items: center;
    gap: var(--xwrr-space-2);
}

.xwrr-loading-text::before {
    content: '';
    width: 16px;
    height: 16px;
    border: 2px solid var(--xwrr-color-border-light);
    border-top-color: var(--xwrr-color-primary);
    border-radius: 50%;
    animation: spin 0.7s linear infinite;
}

/* ==================== 百度统计小工具 ==================== */
.xwrr-bstats { font-size: var(--xwrr-text-sm); }

.xwrr-bstats-minimal { display: flex; flex-direction: column; gap: var(--xwrr-space-2); }
.xwrr-bstats-row {
    display: flex; align-items: center; justify-content: space-between;
    padding: var(--xwrr-space-3) var(--xwrr-space-4);
    background: var(--xwrr-color-bg-secondary);
    border-radius: var(--xwrr-radius-lg);
    transition: background var(--xwrr-transition-fast);
}
.xwrr-bstats-row:hover { background: var(--xwrr-color-bg-tertiary); }
.xwrr-bstats-row-head { display: flex; align-items: center; gap: var(--xwrr-space-3); }
.xwrr-bstats-dot { width: 8px; height: 8px; border-radius: 50%; }
.xwrr-bstats-dot.today { background: var(--xwrr-primary-500); }
.xwrr-bstats-dot.week { background: var(--xwrr-success-500); }
.xwrr-bstats-dot.month { background: var(--xwrr-warning-500); }
.xwrr-bstats-row-label { font-weight: var(--xwrr-font-medium); color: var(--xwrr-color-text-secondary); }
.xwrr-bstats-row-data { display: flex; align-items: baseline; gap: var(--xwrr-space-1); }
.xwrr-bstats-num { font-size: var(--xwrr-text-lg); font-weight: var(--xwrr-font-bold); font-variant-numeric: tabular-nums; }
.xwrr-bstats-unit { font-size: var(--xwrr-text-xs); color: var(--xwrr-color-text-tertiary); margin-right: var(--xwrr-space-2); }
.xwrr-bstats-sep { width: 1px; height: 12px; background: var(--xwrr-color-border-light); margin: 0 var(--xwrr-space-2); }

.xwrr-bstats-compact { display: flex; flex-direction: column; gap: var(--xwrr-space-2); }
.xwrr-bstats-compact-item {
    display: flex; align-items: center; gap: var(--xwrr-space-4);
    padding: var(--xwrr-space-4);
    background: var(--xwrr-color-bg-secondary);
    border-radius: var(--xwrr-radius-lg);
    transition: all var(--xwrr-transition-fast);
}
.xwrr-bstats-compact-item:hover { background: var(--xwrr-color-bg-tertiary); transform: translateX(3px); }
.xwrr-bstats-compact-icon {
    width: 36px; height: 36px;
    display: flex; align-items: center; justify-content: center;
    border-radius: var(--xwrr-radius-lg);
    background: var(--xwrr-primary-50); color: var(--xwrr-primary-500);
}
.xwrr-bstats-compact-item:nth-child(2) .xwrr-bstats-compact-icon { background: var(--xwrr-success-50); color: var(--xwrr-success-500); }
.xwrr-bstats-compact-item:nth-child(3) .xwrr-bstats-compact-icon { background: var(--xwrr-warning-50); color: var(--xwrr-warning-500); }
.xwrr-bstats-compact-body { flex: 1; }
.xwrr-bstats-compact-label { font-size: var(--xwrr-text-xs); color: var(--xwrr-color-text-tertiary); }
.xwrr-bstats-compact-value { font-size: var(--xwrr-text-xl); font-weight: var(--xwrr-font-bold); font-variant-numeric: tabular-nums; }

.xwrr-bstats-pill { display: flex; gap: var(--xwrr-space-3); }
.xwrr-bstats-pill-item {
    flex: 1;
    display: flex; flex-direction: column; align-items: center; gap: var(--xwrr-space-2);
    padding: var(--xwrr-space-4) var(--xwrr-space-3);
    background: var(--xwrr-color-bg-secondary);
    border-radius: var(--xwrr-radius-xl);
    transition: all var(--xwrr-transition-fast);
}
.xwrr-bstats-pill-item:hover { transform: translateY(-3px); box-shadow: var(--xwrr-shadow); }
.xwrr-bstats-pill-label { font-size: var(--xwrr-text-xs); font-weight: var(--xwrr-font-medium); color: var(--xwrr-color-text-tertiary); }

.xwrr-bstats-stack { display: flex; flex-direction: column; gap: var(--xwrr-space-4); }
.xwrr-bstats-stack-item { display: flex; flex-direction: column; gap: var(--xwrr-space-2); }
.xwrr-bstats-stack-head { display: flex; justify-content: space-between; align-items: center; }
.xwrr-bstats-stack-label { font-weight: var(--xwrr-font-medium); color: var(--xwrr-color-text-secondary); }
.xwrr-bstats-stack-ip { font-size: var(--xwrr-text-xs); color: var(--xwrr-color-text-tertiary); }
.xwrr-bstats-stack-bar {
    height: 8px;
    background: var(--xwrr-color-bg-tertiary);
    border-radius: var(--xwrr-radius-lg);
    overflow: hidden;
}
.xwrr-bstats-stack-bar span {
    display: block; height: 100%;
    background: linear-gradient(90deg, var(--xwrr-primary-500), var(--xwrr-primary-400));
    border-radius: var(--xwrr-radius-lg);
    transition: width 0.6s ease;
}
.xwrr-bstats-stack-item:nth-child(2) .xwrr-bstats-stack-bar span { background: linear-gradient(90deg, var(--xwrr-success-500), var(--xwrr-success-400)); }
.xwrr-bstats-stack-item:nth-child(3) .xwrr-bstats-stack-bar span { background: linear-gradient(90deg, var(--xwrr-warning-500), var(--xwrr-warning-400)); }
.xwrr-bstats-stack-pv { font-size: var(--xwrr-text-xs); color: var(--xwrr-color-text-tertiary); text-align: right; }

.xwrr-bstats-hero {
    text-align: center;
    padding: var(--xwrr-space-7) var(--xwrr-space-6);
    background: linear-gradient(135deg, var(--xwrr-primary-600), var(--xwrr-primary-500));
    border-radius: var(--xwrr-radius-xl);
    color: var(--xwrr-color-text-inverse);
}
.xwrr-bstats-hero-label { font-size: var(--xwrr-text-sm); opacity: 0.9; margin-bottom: var(--xwrr-space-2); }
.xwrr-bstats-hero-value { font-size: 52px; font-weight: var(--xwrr-font-extrabold); line-height: 1; margin-bottom: var(--xwrr-space-4); font-variant-numeric: tabular-nums; }
.xwrr-bstats-hero-meta { display: flex; justify-content: center; gap: var(--xwrr-space-5); font-size: var(--xwrr-text-sm); opacity: 0.85; }
.xwrr-bstats-hero-meta span { display: flex; align-items: center; gap: var(--xwrr-space-2); }

.xwrr-bstats-error { padding: var(--xwrr-space-4); background: var(--xwrr-error-50); color: var(--xwrr-error-500); border-radius: var(--xwrr-radius-lg); font-size: var(--xwrr-text-sm); text-align: center; }

/* ==================== 动画 ==================== */
@keyframes spin {
    to { transform: rotate(360deg); }
}

@keyframes shake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-6px); }
    75% { transform: translateX(6px); }
}

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

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

/* ==================== 响应式设计 ==================== */
@media (max-width: 768px) {
    .xwrr-links-wrapper {
        padding: var(--xwrr-space-4);
    }
    
    .xwrr-form-container {
        padding: var(--xwrr-space-5);
        border-radius: var(--xwrr-radius-xl);
    }
    
    .xwrr-form-title {
        font-size: var(--xwrr-text-lg);
        margin-bottom: var(--xwrr-space-5);
    }
    
    .xwrr-form-group {
        margin-bottom: var(--xwrr-space-4);
    }
    
    .xwrr-url-input-wrapper {
        flex-direction: column;
    }
    
    .xwrr-auto-fetch-btn {
        width: 100%;
    }
    
    .xwrr-captcha-container {
        padding: var(--xwrr-space-4);
        margin: var(--xwrr-space-4) 0;
    }
    
    .xwrr-submit-btn {
        width: 100%;
    }
    
    .xwrr-my-links {
        padding: var(--xwrr-space-4);
    }
    
    .xwrr-stats-bar {
        flex-wrap: wrap;
        gap: var(--xwrr-space-2);
        padding: var(--xwrr-space-3);
    }
    
    .xwrr-stat-item {
        flex: 0 0 calc(50% - 4px);
        padding: var(--xwrr-space-2);
    }
    
    .xwrr-stat-value {
        font-size: var(--xwrr-text-lg);
    }
    
    .xwrr-table-header {
        flex-direction: column;
        align-items: stretch;
    }
    
    .xwrr-tabs {
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .xwrr-links-table th,
    .xwrr-links-table td {
        padding: 10px 12px;
        font-size: var(--xwrr-text-xs);
    }
    
    .xwrr-bstats-pill { flex-wrap: wrap; }
    .xwrr-bstats-pill-item { min-width: calc(50% - 6px); }
    .xwrr-bstats-hero-value { font-size: 40px; }
}

@media (max-width: 480px) {
    .xwrr-form-container {
        padding: var(--xwrr-space-4);
        border-radius: var(--xwrr-radius-lg);
    }
    
    .xwrr-form-title {
        font-size: var(--xwrr-text-base);
    }
    
    .xwrr-form-group input,
    .xwrr-form-group textarea {
        padding: 8px 12px;
    }
    
    .xwrr-stat-item {
        flex: 0 0 100%;
    }
    
    .xwrr-tab {
        padding: var(--xwrr-space-1) var(--xwrr-space-2);
        font-size: var(--xwrr-text-xs);
    }
}

/* ==================== 打印样式 ==================== */
@media print {
    .xwrr-form-container,
    .xwrr-my-links {
        box-shadow: none;
        border: 1px solid #ddd;
    }
    
    .xwrr-submit-btn,
    .xwrr-auto-fetch-btn,
    .xwrr-tabs {
        display: none;
    }
}

/* ==================== 友链弹窗样式 ==================== */
.xwrr-modal-container {
    background: var(--xwrr-color-bg-elevated);
    border-radius: var(--xwrr-radius-2xl);
    border: 1px solid var(--xwrr-color-border-light);
    width: 100%;
    max-width: 400px;
    box-shadow: var(--xwrr-shadow-xl);
    transform: scale(0.95) translateY(10px);
    transition: transform var(--xwrr-transition-base);
}

.xwrr-modal-overlay.active .xwrr-modal-container {
    transform: scale(1) translateY(0);
}

.xwrr-modal-content {
    padding: var(--xwrr-space-8);
    text-align: center;
}

.xwrr-modal-icon {
    width: 64px;
    height: 64px;
    margin: 0 auto var(--xwrr-space-5);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: iconPop 0.4s ease;
}

.xwrr-modal-icon.success {
    background: var(--xwrr-success-100);
    color: var(--xwrr-success-500);
}

.xwrr-modal-icon.error {
    background: var(--xwrr-error-100);
    color: var(--xwrr-error-500);
}

.xwrr-modal-icon.warning {
    background: var(--xwrr-warning-100);
    color: var(--xwrr-warning-500);
}

.xwrr-modal-icon.info {
    background: var(--xwrr-primary-100);
    color: var(--xwrr-primary-500);
}

.xwrr-modal-icon svg {
    width: 32px;
    height: 32px;
}

.xwrr-modal-title {
    margin: 0 0 var(--xwrr-space-3);
    font-size: var(--xwrr-text-xl);
    font-weight: var(--xwrr-font-semibold);
    color: var(--xwrr-color-text-primary);
}

.xwrr-modal-message {
    margin: 0 0 var(--xwrr-space-6);
    font-size: var(--xwrr-text-sm);
    color: var(--xwrr-color-text-secondary);
    line-height: 1.6;
}

.xwrr-modal-close-btn {
    min-width: 120px;
    padding: var(--xwrr-space-3) var(--xwrr-space-6);
    font-size: var(--xwrr-text-sm);
    font-weight: var(--xwrr-font-medium);
    color: var(--xwrr-color-text-inverse);
    background: var(--xwrr-color-primary);
    border: none;
    border-radius: var(--xwrr-radius-lg);
    cursor: pointer;
    transition: all var(--xwrr-transition-fast);
}

.xwrr-modal-close-btn:hover {
    background: var(--xwrr-color-primary-hover);
    transform: translateY(-1px);
}

.xwrr-modal-close-btn:active {
    transform: translateY(0);
}

/* 弹窗动画 */
@keyframes iconPop {
    0% { transform: scale(0); opacity: 0; }
    50% { transform: scale(1.2); }
    100% { transform: scale(1); opacity: 1; }
}

/* ==================== Modal Overlay ==================== */
.xwrr-reject-modal-overlay,
.xwrr-edit-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100001;
    padding: var(--xwrr-space-4);
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--xwrr-transition-base), visibility var(--xwrr-transition-base);
}

.xwrr-reject-modal-overlay.active,
.xwrr-edit-modal-overlay.active {
    opacity: 1;
    visibility: visible;
}

/* ==================== 拒绝原因弹窗 ==================== */
.xwrr-reject-modal {
    max-width: 480px;
    background: var(--xwrr-color-bg-elevated);
    border-radius: var(--xwrr-radius-2xl);
    border: 1px solid var(--xwrr-color-border-light);
    width: 100%;
    max-height: 90vh;
    overflow: hidden;
}

.xwrr-reject-modal .xwrr-modal-content {
    text-align: left;
    padding: var(--xwrr-space-6);
}

.xwrr-reject-modal .xwrr-modal-header {
    padding-bottom: var(--xwrr-space-4);
    border-bottom: 1px solid var(--xwrr-color-border-light);
    margin-bottom: var(--xwrr-space-4);
}

.xwrr-reject-modal .xwrr-modal-header h3 {
    margin: 0;
    font-size: var(--xwrr-text-lg);
    font-weight: var(--xwrr-font-semibold);
    color: var(--xwrr-color-text-primary);
}

.xwrr-reject-modal .xwrr-modal-body {
    margin-bottom: var(--xwrr-space-4);
}

.xwrr-reject-modal .xwrr-modal-body label {
    display: block;
    margin-bottom: var(--xwrr-space-2);
    font-size: var(--xwrr-text-sm);
    font-weight: var(--xwrr-font-medium);
    color: var(--xwrr-color-text-primary);
}

.xwrr-reject-modal .xwrr-modal-body textarea {
    width: 100%;
    min-height: 100px;
    padding: var(--xwrr-space-3);
    font-size: var(--xwrr-text-sm);
    color: var(--xwrr-color-text-primary);
    background: var(--xwrr-color-bg-secondary);
    border: 1px solid var(--xwrr-color-border-light);
    border-radius: var(--xwrr-radius-lg);
    resize: vertical;
    transition: all var(--xwrr-transition-fast);
    outline: none;
}

.xwrr-reject-modal .xwrr-modal-body textarea:focus {
    border-color: var(--xwrr-color-primary);
    box-shadow: 0 0 0 3px var(--xwrr-primary-100);
}

.xwrr-reject-modal .xwrr-modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: var(--xwrr-space-3);
    padding-top: var(--xwrr-space-4);
    border-top: 1px solid var(--xwrr-color-border-light);
}

.xwrr-reject-modal .xwrr-btn-cancel {
    padding: var(--xwrr-space-3) var(--xwrr-space-5);
    font-size: var(--xwrr-text-sm);
    font-weight: var(--xwrr-font-medium);
    color: var(--xwrr-color-text-secondary);
    background: var(--xwrr-color-bg-secondary);
    border: 1px solid var(--xwrr-color-border-light);
    border-radius: var(--xwrr-radius-lg);
    cursor: pointer;
    transition: all var(--xwrr-transition-fast);
}

.xwrr-reject-modal .xwrr-btn-cancel:hover {
    background: var(--xwrr-color-bg-tertiary);
}

.xwrr-reject-modal .xwrr-btn-confirm {
    padding: var(--xwrr-space-3) var(--xwrr-space-5);
    font-size: var(--xwrr-text-sm);
    font-weight: var(--xwrr-font-medium);
    color: var(--xwrr-color-text-inverse);
    background: var(--xwrr-error-500);
    border: none;
    border-radius: var(--xwrr-radius-lg);
    cursor: pointer;
    transition: all var(--xwrr-transition-fast);
}

.xwrr-reject-modal .xwrr-btn-confirm:hover {
    background: var(--xwrr-error-600);
}

/* ==================== 编辑弹窗 ==================== */
.xwrr-edit-modal {
    max-width: 480px;
    background: var(--xwrr-color-bg-elevated);
    border-radius: 16px;
    border: none;
    width: 100%;
    max-height: 90vh;
    overflow: hidden;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(0, 0, 0, 0.05);
    transform: scale(0.95);
    opacity: 0;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.xwrr-edit-modal-overlay.active .xwrr-edit-modal {
    transform: scale(1);
    opacity: 1;
}

.xwrr-edit-modal-header {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 20px 24px;
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border-bottom: 1px solid var(--xwrr-color-border-light);
}

.xwrr-edit-modal-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
    border-radius: 10px;
    color: #fff;
    flex-shrink: 0;
}

.xwrr-edit-modal-header h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: #1e293b;
    flex: 1;
}

.xwrr-edit-modal-close {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    border-radius: 8px;
    font-size: 20px;
    color: #94a3b8;
    cursor: pointer;
    transition: all 0.15s ease;
}

.xwrr-edit-modal-close:hover {
    background: #f1f5f9;
    color: #475569;
}

.xwrr-edit-modal-body {
    padding: 24px;
    max-height: 60vh;
    overflow-y: auto;
}

.xwrr-edit-modal .xwrr-form-group,
.xwrr-edit-modal .xwrr-edit-field {
    margin-bottom: 20px;
}

.xwrr-edit-modal .xwrr-form-group:last-child,
.xwrr-edit-modal .xwrr-edit-field:last-child {
    margin-bottom: 0;
}

.xwrr-edit-modal .xwrr-form-group label,
.xwrr-edit-modal .xwrr-edit-field label {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 500;
    color: #374151;
}

.xwrr-edit-modal .xwrr-form-group input,
.xwrr-edit-modal .xwrr-form-group textarea,
.xwrr-edit-modal .xwrr-edit-field input,
.xwrr-edit-modal .xwrr-edit-field textarea {
    width: 100%;
    padding: 12px 14px;
    font-size: 14px;
    color: #1e293b;
    background: #f8fafc;
    border: 1.5px solid #e2e8f0;
    border-radius: 10px;
    transition: all 0.15s ease;
    outline: none;
}

.xwrr-edit-modal .xwrr-form-group input::placeholder,
.xwrr-edit-modal .xwrr-form-group textarea::placeholder,
.xwrr-edit-modal .xwrr-edit-field input::placeholder,
.xwrr-edit-modal .xwrr-edit-field textarea::placeholder {
    color: #94a3b8;
}

.xwrr-edit-modal .xwrr-form-group input:hover,
.xwrr-edit-modal .xwrr-form-group textarea:hover,
.xwrr-edit-modal .xwrr-edit-field input:hover,
.xwrr-edit-modal .xwrr-edit-field textarea:hover {
    border-color: #cbd5e1;
    background: #fff;
}

.xwrr-edit-modal .xwrr-form-group input:focus,
.xwrr-edit-modal .xwrr-form-group textarea:focus,
.xwrr-edit-modal .xwrr-edit-field input:focus,
.xwrr-edit-modal .xwrr-edit-field textarea:focus {
    border-color: #3b82f6;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}

.xwrr-edit-modal .xwrr-edit-field textarea {
    resize: vertical;
    min-height: 80px;
}

.xwrr-edit-modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 16px 24px;
    background: #f8fafc;
    border-top: 1px solid #e2e8f0;
}

.xwrr-edit-modal-footer .xwrr-btn {
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 500;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: all 0.15s ease;
}

.xwrr-edit-modal-footer .xwrr-btn-secondary {
    background: #fff;
    border: 1.5px solid #e2e8f0;
    color: #475569;
}

.xwrr-edit-modal-footer .xwrr-btn-secondary:hover {
    background: #f1f5f9;
    border-color: #cbd5e1;
}

.xwrr-edit-modal-footer .xwrr-btn-primary {
    background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
    border: none;
    color: #fff;
    box-shadow: 0 2px 4px rgba(59, 130, 246, 0.3);
}

.xwrr-edit-modal-footer .xwrr-btn-primary:hover {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
    box-shadow: 0 4px 8px rgba(59, 130, 246, 0.4);
    transform: translateY(-1px);
}

.xwrr-edit-modal-footer .xwrr-btn-primary svg {
    stroke: currentColor;
}

.xwrr-edit-modal .xwrr-modal-footer,
.xwrr-edit-modal .xwrr-edit-actions {
    display: flex;
    justify-content: flex-end;
    gap: var(--xwrr-space-3);
    padding: var(--xwrr-space-4) var(--xwrr-space-6);
    margin-top: var(--xwrr-space-4);
    border-top: 1px solid var(--xwrr-color-border-light);
    background: var(--xwrr-color-bg-secondary);
}

.xwrr-edit-modal .xwrr-btn-save,
.xwrr-edit-modal .xwrr-edit-save {
    padding: var(--xwrr-space-3) var(--xwrr-space-5);
    font-size: var(--xwrr-text-sm);
    font-weight: var(--xwrr-font-medium);
    color: #fff;
    background: var(--xwrr-color-primary);
    border: none;
    border-radius: var(--xwrr-radius-lg);
    cursor: pointer;
    transition: all var(--xwrr-transition-fast);
}

.xwrr-edit-modal .xwrr-btn-save:hover,
.xwrr-edit-modal .xwrr-edit-save:hover {
    background: var(--xwrr-primary-600);
}

.xwrr-edit-modal .xwrr-edit-cancel {
    padding: var(--xwrr-space-3) var(--xwrr-space-5);
    font-size: var(--xwrr-text-sm);
    font-weight: var(--xwrr-font-medium);
    color: var(--xwrr-color-text-secondary);
    background: var(--xwrr-color-bg-tertiary);
    border: 1px solid var(--xwrr-color-border-light);
    border-radius: var(--xwrr-radius-lg);
    cursor: pointer;
    transition: all var(--xwrr-transition-fast);
}

.xwrr-edit-modal .xwrr-edit-cancel:hover {
    background: var(--xwrr-color-bg-secondary);
    border-color: var(--xwrr-color-border-medium);
}

/* ==================== 响应式弹窗 ==================== */
@media (max-width: 480px) {
    .xwrr-modal-container {
        max-width: calc(100% - 32px);
        margin: var(--xwrr-space-4);
    }
    
    .xwrr-modal-content {
        padding: var(--xwrr-space-6);
    }
    
    .xwrr-modal-icon {
        width: 56px;
        height: 56px;
    }
    
    .xwrr-modal-icon svg {
        width: 28px;
        height: 28px;
    }
    
    .xwrr-modal-title {
        font-size: var(--xwrr-text-lg);
    }
    
    .xwrr-reject-modal .xwrr-modal-footer,
    .xwrr-edit-modal .xwrr-modal-footer {
        flex-direction: column-reverse;
    }
    
    .xwrr-reject-modal .xwrr-modal-footer button,
    .xwrr-edit-modal .xwrr-modal-footer button {
        width: 100%;
    }
}