/**
 * 多元素模板 - 2026 年轻极简结构风样式表
 * 方正 / 微微圆角 / 无发光 / 高对比排版 / 游戏账号交易平台
 */

/* ===== 基础重置 ===== */
*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    margin: 0 !important;
    padding: 0 !important;
    scroll-behavior: smooth;
}

body {
    margin: 0 !important;
    padding: 0 !important;
    font-family: 'Inter', 'PingFang SC', 'Microsoft YaHei', -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--text-primary);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background: var(--body-bg);
    min-height: 100vh;
    letter-spacing: -0.01em;
}

a {
    text-decoration: none;
    color: inherit;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

button {
    font-family: inherit;
    cursor: pointer;
    border: none;
    background: none;
}

/* ===== CSS 变量 - Win11 轻量商务主题 ===== */
:root {
    --bg-page: #F1F5F9;
    --bg-card: #FFFFFF;
    --bg-soft: #F8FAFC;
    --bg-muted: #EEF2FF;

    --ink: #1E293B;
    --ink-2: #334155;
    --ink-3: #64748B;
    --ink-4: #94A3B8;

    --accent: #4F46E5;
    --accent-hover: #4338CA;
    --accent-pressed: #3730A3;
    --accent-light: #EEF2FF;

    --blue: #6366F1;
    --blue-light: #EEF2FF;

    --violet: #8B5CF6;
    --orange: #F59E0B;

    --text-primary: var(--ink);
    --text-secondary: var(--ink-3);
    --text-muted: var(--ink-4);
    --text-white: #FFFFFF;

    --border: rgba(15, 23, 42, 0.08);
    --border-strong: rgba(15, 23, 42, 0.14);

    --radius-sm: 2px;
    --radius-md: 3px;
    --radius-lg: 4px;
    --radius-xl: 4px;

    --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
    --shadow-md: 0 2px 8px rgba(15, 23, 42, 0.06);
    --shadow-lg: 0 4px 16px rgba(15, 23, 42, 0.08);

    --transition: all 0.18s ease;

    --body-bg: var(--bg-page);
}

/* ===== 顶部工具栏 ===== */
.dy-topbar {
    background: var(--bg-card);
    border-bottom: 1px solid var(--border);
    font-size: 12px;
    color: var(--text-secondary);
}

.dy-topbar-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 32px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.dy-topbar-left,
.dy-topbar-right {
    display: flex;
    align-items: center;
    gap: 16px;
}

.dy-topbar a {
    color: var(--text-secondary);
    transition: var(--transition);
}

.dy-topbar a:hover {
    color: var(--accent);
}

.dy-topbar .dy-welcome {
    font-weight: 600;
    color: var(--text-primary);
}

.dy-topbar .dy-welcome i {
    color: var(--accent);
    margin-right: 4px;
}

.dy-topbar .dy-divider {
    color: var(--border-strong);
}

/* ===== 主导航 / Logo + 统计区 ===== */
.dy-header {
    background: var(--bg-card);
    border-bottom: 1px solid var(--border);
    padding: 24px 0;
}

.dy-header-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
}

.dy-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.dy-logo {
    display: flex;
    align-items: center;
    gap: 14px;
}

.dy-logo-icon {
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, var(--accent), var(--violet));
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.dy-logo-icon svg {
    display: none;
}

.dy-logo-icon::before {
    content: '\f11b';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    color: #fff;
    font-size: 22px;
}

.dy-logo-img {
    height: 44px;
    width: auto;
    max-width: 160px;
    object-fit: contain;
}

.dy-logo-text {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.dy-logo-name {
    font-size: 22px;
    font-weight: 800;
    color: var(--text-primary);
    letter-spacing: -0.03em;
}

.dy-logo-slogan {
    font-size: 12px;
    color: var(--text-muted);
    margin-top: 3px;
}

/* 吉祥物隐藏 */
.dy-brand-mascot,
.dy-header-mascot {
    display: none;
}

/* 统计卡片区 */
.dy-stats-bar {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    flex: 1;
    max-width: 680px;
}

.dy-stat-card {
    background: var(--bg-soft);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: 14px 14px;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: var(--transition);
}

.dy-stat-card:hover {
    background: var(--bg-muted);
}

.dy-stat-icon {
    width: 34px;
    height: 34px;
    border-radius: var(--radius-sm);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    flex-shrink: 0;
    background: var(--ink);
    color: #fff;
}

.dy-stat-icon.pink {
    background: linear-gradient(135deg, #6366F1, #818CF8);
}
.dy-stat-icon.orange {
    background: linear-gradient(135deg, #8B5CF6, #A78BFA);
}
.dy-stat-icon.purple {
    background: linear-gradient(135deg, #7C3AED, #A78BFA);
}
.dy-stat-icon.blue {
    background: linear-gradient(135deg, #4F46E5, #6366F1);
}

.dy-stat-value {
    font-size: 17px;
    font-weight: 800;
    color: var(--text-primary);
    line-height: 1.2;
}

.dy-stat-label {
    font-size: 12px;
    color: var(--text-secondary);
    white-space: nowrap;
}

/* ===== 主导航 ===== */
.dy-main-nav {
    background: var(--bg-card);
    border-bottom: 1px solid var(--border);
    margin-bottom: 28px;
}

.dy-main-nav-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 32px;
}

.dy-main-nav-bar {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 10px 0;
}

.dy-main-nav-bar > a,
.dy-nav-dropdown > a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 18px;
    border-radius: var(--radius-md);
    font-size: 14px;
    font-weight: 700;
    color: var(--text-secondary);
    transition: var(--transition);
    white-space: nowrap;
}

.dy-main-nav-bar > a:hover,
.dy-nav-dropdown:hover > a {
    background: var(--bg-soft);
    color: var(--text-primary);
}

.dy-main-nav-bar > a.active {
    background: linear-gradient(135deg, var(--accent), var(--violet));
    color: #fff;
}

/* 导航下拉 */
.dy-nav-dropdown {
    position: relative;
}

.dy-nav-dropdown > a i {
    font-size: 10px;
    transition: transform 0.2s;
}

.dy-nav-dropdown:hover > a i {
    transform: rotate(180deg);
}

.dy-dropdown-menu {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    min-width: 180px;
    background: var(--bg-card);
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-lg);
    padding: 4px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: var(--transition);
    z-index: 200;
}

.dy-nav-dropdown:hover .dy-dropdown-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.dy-dropdown-menu a {
    display: block;
    padding: 9px 14px;
    border-radius: var(--radius-sm);
    font-size: 13px;
    color: var(--text-secondary);
    transition: var(--transition);
}

.dy-dropdown-menu a:hover {
    background: var(--bg-soft);
    color: var(--accent);
}

/* ===== 主体容器 ===== */
.dy-main {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 32px 60px;
}

/* ===== 轮播 Banner ===== */
.dy-banner-section {
    margin-bottom: 28px;
}

.dy-banner {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    box-shadow: var(--shadow-sm);
}

.dy-banner-carousel {
    position: relative;
    width: 100%;
    height: 320px;
}

.dy-banner-carousel img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transition: opacity 0.5s ease;
}

.dy-banner-carousel img.active {
    opacity: 1;
}

.dy-banner-default {
    width: 100%;
    height: 320px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-soft);
    color: var(--text-secondary);
    font-size: 15px;
    text-align: center;
}

.dy-banner-default i {
    color: var(--accent);
}

.dy-banner-dots {
    position: absolute;
    bottom: 16px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 8px;
    z-index: 2;
}

.dy-banner-dots span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--border-strong);
    cursor: pointer;
    transition: var(--transition);
}

.dy-banner-dots span.active {
    background: var(--accent);
    width: 20px;
    border-radius: 4px;
}

.dy-banner-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.35);
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 3;
    transition: all .25s ease;
    color: rgba(255, 255, 255, 0.85);
    font-size: 12px;
    backdrop-filter: blur(4px);
}

.dy-banner-arrow:hover {
    background: rgba(0, 0, 0, 0.65);
    color: #fff;
    transform: translateY(-50%) scale(1.1);
}

.dy-banner-arrow.prev { left: 8px; }
.dy-banner-arrow.next { right: 8px; }

/* ===== 筛选工具栏 ===== */
.dy-filter-toolbar {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    margin-bottom: 24px;
    overflow: visible;
    box-shadow: var(--shadow-sm);
}

.dy-filter-toolbar-row {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 14px 20px;
    border-bottom: 1px solid var(--border);
    position: relative;
}

.dy-filter-toolbar-row:last-child {
    border-bottom: none;
}

.dy-filter-group {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 1;
    flex-wrap: wrap;
}

.dy-filter-label {
    font-size: 12px;
    font-weight: 800;
    color: var(--text-primary);
    white-space: nowrap;
    min-width: 60px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.dy-filter-options {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.dy-filter-options a,
.dy-filter-select {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 12px;
    border-radius: var(--radius-sm);
    font-size: 13px;
    font-weight: 500;
    color: var(--text-secondary);
    background: var(--bg-soft);
    border: 1px solid transparent;
    transition: var(--transition);
    white-space: nowrap;
}

.dy-filter-options a:hover,
.dy-filter-select:hover {
    background: var(--bg-muted);
    color: var(--text-primary);
}

.dy-filter-options a.active {
    background: linear-gradient(135deg, var(--accent), var(--violet));
    color: #fff;
    font-weight: 600;
}

.dy-filter-price-inputs {
    display: flex;
    align-items: center;
    gap: 8px;
}

.dy-filter-price-inputs input {
    width: 90px;
    padding: 7px 10px;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    font-size: 13px;
    color: var(--text-primary);
    background: var(--bg-card);
    outline: none;
    transition: var(--transition);
}

.dy-filter-price-inputs input:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(99,102,241,.12);
}

.dy-filter-price-inputs span {
    color: var(--text-muted);
}

.dy-filter-price-btn {
    padding: 7px 14px;
    background: linear-gradient(135deg, var(--accent), var(--violet));
    color: #fff;
    border-radius: var(--radius-sm);
    font-size: 13px;
    font-weight: 700;
    transition: var(--transition);
    box-shadow: 0 2px 6px rgba(79,70,229,.20);
}

.dy-filter-price-btn:hover {
    background: var(--accent-hover);
    box-shadow: 0 4px 10px rgba(79,70,229,.30);
}

/* 高级筛选下拉按钮 */
.dy-filter-select {
    cursor: pointer;
    color: var(--text-secondary);
    min-width: 260px;
    background: var(--bg-soft);
}

.dy-filter-select i {
    font-size: 11px;
    transition: transform 0.2s;
}

.dy-filter-advanced-group.active .dy-filter-select i {
    transform: rotate(180deg);
}

/* 高级筛选面板 */
.dy-advanced-filter-panel {
    position: absolute;
    top: calc(100% + 8px);
    right: 20px;
    min-width: 340px;
    max-width: 90vw;
    background: var(--bg-card);
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    padding: 18px;
    z-index: 150;
    display: none;
}

.dy-advanced-filter-panel.show {
    display: block;
}

.dy-advanced-filter-panel h4 {
    font-size: 14px;
    font-weight: 800;
    color: var(--text-primary);
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.dy-advanced-filter-panel h4 i {
    color: var(--accent);
}

.dy-filter-field {
    margin-bottom: 12px;
}

.dy-filter-field label {
    display: block;
    font-size: 12px;
    color: var(--text-secondary);
    margin-bottom: 5px;
    font-weight: 700;
}

.dy-filter-field input,
.dy-filter-field select {
    width: 100%;
    padding: 8px 11px;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    font-size: 13px;
    color: var(--text-primary);
    background: var(--bg-card);
    outline: none;
    transition: var(--transition);
}

.dy-filter-field input:focus,
.dy-filter-field select:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(99,102,241,.12);
}

.dy-advanced-filter-panel .dy-apply-row {
    margin-top: 16px;
}

.dy-btn-apply {
    width: 100%;
    padding: 10px;
    background: linear-gradient(135deg, var(--accent), var(--violet));
    color: #fff;
    border-radius: var(--radius-sm);
    font-size: 14px;
    font-weight: 700;
    transition: var(--transition);
    box-shadow: 0 2px 6px rgba(79,70,229,.20);
}

.dy-btn-apply:hover {
    background: var(--accent-hover);
    box-shadow: 0 4px 10px rgba(79,70,229,.30);
}

/* ===== 排序视图栏 ===== */
.dy-sort-bar {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 8px 12px;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: nowrap;
    box-shadow: var(--shadow-sm);
}

.dy-sort-tags {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: nowrap;
    overflow-x: auto;
    flex: 1 1 auto;
    min-width: 0;
}

.dy-sort-tags::-webkit-scrollbar {
    height: 3px;
}
.dy-sort-tags::-webkit-scrollbar-thumb {
    background: var(--border);
    border-radius: 2px;
}

.dy-sort-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: var(--radius-sm);
    font-size: 12px;
    font-weight: 500;
    color: var(--text-secondary);
    background: var(--bg-soft);
    border: 1px solid transparent;
    transition: var(--transition);
    white-space: nowrap;
    flex-shrink: 0;
}

.dy-sort-tag:hover {
    background: var(--bg-muted);
    color: var(--text-primary);
}

.dy-sort-tag.active {
    background: linear-gradient(135deg, var(--accent), var(--violet));
    color: #fff;
    font-weight: 600;
}

/* 三态排序按钮 */
.dy-sort-toggle {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 4px 8px;
    border-radius: var(--radius-sm);
    font-size: 12px;
    font-weight: 500;
    color: var(--text-secondary);
    background: var(--bg-soft);
    border: 1px solid transparent;
    transition: var(--transition);
    white-space: nowrap;
    cursor: pointer;
    font-family: inherit;
    line-height: 1.3;
    flex-shrink: 0;
}

.dy-sort-toggle:hover {
    background: var(--bg-muted);
    color: var(--text-primary);
    border-color: var(--border);
}

.dy-sort-toggle.active {
    background: var(--bg-muted);
    color: var(--accent);
    border-color: rgba(79, 70, 229, 0.3);
}

.dy-sort-label {
    font-weight: 500;
}

.dy-sort-arrows {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    margin-left: 2px;
}

.dy-sort-arrows i {
    font-size: 6px;
    line-height: 1;
    color: var(--ink-4);
    transition: all 0.15s ease;
}

.dy-sort-arrows i.filled {
    color: var(--accent);
}

.dy-sort-toggle:hover .dy-sort-arrows i {
    color: var(--ink-3);
}

.dy-sort-toggle:hover .dy-sort-arrows i.filled {
    color: var(--accent);
}

.dy-sort-toggle.active .dy-sort-arrows i {
    color: var(--ink-4);
}

.dy-sort-toggle.active .dy-sort-arrows i.filled {
    color: var(--accent);
}

.dy-sort-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.dy-total-count {
    font-size: 12px;
    color: var(--text-muted);
    margin-right: 6px;
}

.dy-total-count strong {
    color: var(--text-primary);
    font-weight: 800;
}

.dy-filter-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 6px 11px;
    background: var(--bg-soft);
    border: 1px solid transparent;
    border-radius: var(--radius-sm);
    color: var(--text-secondary);
    font-size: 13px;
    font-weight: 500;
    transition: var(--transition);
    white-space: nowrap;
}

.dy-filter-btn:hover {
    background: var(--bg-muted);
    color: var(--text-primary);
}

.dy-filter-btn.view-toggle.active {
    background: linear-gradient(135deg, var(--accent), var(--violet));
    color: #fff;
    font-weight: 600;
}

/* ===== 账号卡片网格 ===== */
.dy-card-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 40px;
}

.dy-card {
    background: var(--bg-card);
    border: 1px solid #E2E8F0;
    border-radius: var(--radius-lg);
    overflow: hidden;
    transition: all 0.2s cubic-bezier(.4,0,.2,1);
    display: flex;
    flex-direction: column;
    position: relative;
    box-shadow: 0 1px 3px rgba(15,23,42,.04);
}

.dy-card:hover {
    border-color: #C7D2FE;
    box-shadow: 0 8px 24px rgba(99,102,241,.10);
    transform: translateY(-2px);
}

.dy-card-image-wrap {
    position: relative;
    width: 100%;
    height: 150px;
    overflow: hidden;
    background: #F8FAFC;
    border-bottom: 1px solid #E2E8F0;
}

.dy-card-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.dy-card:hover .dy-card-image {
    transform: scale(1.03);
}

.dy-card-image-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94A3B8;
    font-size: 13px;
    gap: 8px;
    background: #F8FAFC;
}

/* 卡片左上角标签 */
.dy-card-badges {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.dy-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 3px 7px;
    border-radius: var(--radius-sm);
    font-size: 10.5px;
    font-weight: 700;
    color: #fff;
    border: 1px solid rgba(255,255,255,0.15);
}

.dy-badge--self { background: #334155; }
.dy-badge--seller { background: #64748B; }
.dy-badge--hot { background: #EF4444; }
.dy-badge--new { background: #8B5CF6; }
/* 免押特权徽章 - 翠绿渐变 */
.dy-badge--free {
    background: linear-gradient(135deg, #10B981, #059669);
    box-shadow: 0 1px 4px rgba(16, 185, 129, 0.35);
}
/* 押金折扣徽章 - 琥珀渐变 */
.dy-badge--deposit-off {
    background: linear-gradient(135deg, #F59E0B, #D97706);
    box-shadow: 0 1px 4px rgba(245, 158, 11, 0.35);
}
/* 等级优惠徽章 - 靛蓝渐变 */
.dy-badge--discount {
    background: linear-gradient(135deg, #6366F1, #4F46E5);
    box-shadow: 0 1px 4px rgba(99, 102, 241, 0.35);
}

/* 价格优惠小标签（租金/押金旁） */
.dy-price-off-tag {
    display: inline-block;
    font-size: 10px;
    font-weight: 600;
    color: #D97706;
    margin-left: 2px;
    white-space: nowrap;
    line-height: 1;
    vertical-align: middle;
}

/* 免押文字样式（押金数值位置显示） */
.dy-deposit-free {
    color: #10B981 !important;
    font-weight: 700;
}

/* 卡片主体 */
.dy-card-body {
    padding: 12px 14px;
    flex: 1;
    display: flex;
    flex-direction: column;
    background: #fff;
}

.dy-card-title {
    font-size: 13.5px;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 4px;
}

.dy-card-meta {
    font-size: 11.5px;
    color: var(--text-muted);
    margin-bottom: 10px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 字段网格 4 列 - 融入卡片版 */
.dy-card-fields-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    background: linear-gradient(135deg, #FDFCFF 0%, #FAF9FF 100%);
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid #F3F0FF;
    margin-top: 10px;
    padding: 4px;
}

.dy-field-cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 8px 4px;
    min-height: 44px;
    position: relative;
    transition: background 0.18s;
    border-bottom: 1px solid #E2E8F0;
}

.dy-field-cell:not(:nth-child(4n+1))::before {
    content: '';
    position: absolute;
    left: 0;
    top: 16%;
    bottom: 16%;
    width: 1px;
    background: #F3F0FF;
}

.dy-field-cell:hover {
    background: rgba(99,102,241,.04);
}

.dy-field-cell-value {
    font-size: 12px;
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.2;
    text-align: center;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    word-break: break-all;
}

.dy-field-cell-label {
    font-size: 9px;
    color: #6366F1;
    margin-top: 2px;
    text-align: center;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    font-weight: 600;
}

/* 卡片底部 */
.dy-card-footer {
    padding: 10px 14px;
    background: #fff;
    display: flex;
    flex-direction: column;
    gap: 6px;
    border-top: 1px solid #E2E8F0;
}

/* 价格行：价格 + 按钮横向排列 */
.dy-card-price-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.dy-card-price {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    min-width: 0;
}

/* 主价格（合计数值，无"合计"文字） */
.dy-price-main {
    font-size: 22px;
    font-weight: 800;
    color: var(--accent);
    line-height: 1;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
}

.dy-price-main .currency {
    font-size: 13px;
    margin-right: 1px;
    color: var(--accent);
    font-weight: 700;
    vertical-align: 1px;
}

/* 租金 / 押金 次要明细 */
.dy-price-detail {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding-bottom: 1px;
    border-left: 1px solid var(--border);
    padding-left: 10px;
    line-height: 1.3;
}

.dy-price-rent {
    font-size: 11.5px;
    color: var(--ink-3);
}

/* 租金数值 - 浅红色 */
.dy-price-rent span {
    color: #F87171;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.dy-price-deposit {
    font-size: 11px;
    color: var(--text-muted);
}

/* 押金数值 - 纯黑 */
.dy-price-deposit .amount {
    color: #000;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

/* 比例和换算行 */
.dy-card-ratio-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.dy-ratio-left {
    display: flex;
    align-items: center;
    gap: 8px;
}

.dy-ratio-right {
    display: flex;
    align-items: center;
    gap: 8px;
}

.dy-ratio-tag {
    font-size: 11px;
    color: var(--accent);
    font-weight: 600;
    background: var(--bg-muted);
    padding: 2px 8px;
    border-radius: 3px;
    white-space: nowrap;
}

.dy-perunit-tag {
    font-size: 11px;
    color: #DC2626;
    font-weight: 600;
    background: #FEE2E2;
    padding: 2px 8px;
    border-radius: 3px;
    white-space: nowrap;
}

/* 按钮操作区 - 价格行右侧，略微下移 */
.dy-card-actions {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 5px;
    flex-shrink: 0;
    align-self: flex-end;
    margin-bottom: 2px;
}

/* 复制编号按钮 - 精致美化 */
.dy-btn-copy {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 6px 12px;
    background: linear-gradient(135deg, #fff 0%, #F8FAFC 100%);
    color: var(--ink-2);
    border: 1px solid #E2E8F0;
    border-radius: var(--radius-md);
    font-size: 12px;
    font-weight: 600;
    transition: all 0.2s ease;
    white-space: nowrap;
    cursor: pointer;
    font-family: inherit;
    line-height: 1.3;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.dy-copy-main {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

/* 图标块 - 靛紫色小方块 */
.dy-copy-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: linear-gradient(135deg, #EEF2FF 0%, #E0E7FF 100%);
    border-radius: 4px;
    color: var(--accent);
    transition: all 0.2s ease;
}

.dy-copy-icon i {
    font-size: 11px;
    line-height: 1;
}

.dy-btn-copy:hover {
    border-color: var(--accent);
    color: var(--accent);
    background: linear-gradient(135deg, #EEF2FF 0%, #EDE9FE 100%);
    box-shadow: 0 2px 6px rgba(79, 70, 229, 0.12);
    transform: translateY(-1px);
}

.dy-btn-copy:hover .dy-copy-icon {
    background: linear-gradient(135deg, var(--accent) 0%, var(--violet) 100%);
    color: #fff;
}

.dy-btn-copy:hover .dy-copy-num {
    color: var(--accent);
}

.dy-btn-copy.is-copied {
    border-color: #10B981;
    color: #059669;
    background: linear-gradient(135deg, #ECFDF5 0%, #D1FAE5 100%);
    box-shadow: 0 2px 6px rgba(16, 185, 129, 0.15);
}

.dy-btn-copy.is-copied .dy-copy-icon {
    background: linear-gradient(135deg, #10B981 0%, #059669 100%);
    color: #fff;
}

.dy-btn-copy.is-copied .dy-copy-num {
    color: #059669;
}

/* 编号小字 */
.dy-btn-copy .dy-copy-num {
    font-size: 10px;
    color: var(--ink-4);
    font-weight: 500;
    opacity: 0.9;
    line-height: 1;
    font-family: 'Menlo', 'Monaco', 'Courier New', monospace;
    letter-spacing: 0.5px;
}

/* 立即下单主按钮 - 缩小，靛紫渐变 */
.dy-btn-buy {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 6px 12px;
    background: linear-gradient(135deg, var(--accent), var(--violet));
    color: #fff;
    border-radius: var(--radius-sm);
    font-size: 12px;
    font-weight: 700;
    transition: var(--transition);
    white-space: nowrap;
    box-shadow: 0 2px 6px rgba(79,70,229,.18);
}

.dy-btn-buy i {
    font-size: 12px;
}

.dy-btn-buy:hover {
    background: var(--accent-hover);
    box-shadow: 0 3px 10px rgba(79,70,229,.30);
}

.dy-btn-buy:active {
    background: var(--accent-pressed);
}

/* ===== 列表视图 ===== */
.dy-list-view {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 40px;
}

.dy-list-view .dy-card {
    flex-direction: row;
    max-height: none;
}

.dy-list-view .dy-card-image-wrap {
    width: 240px;
    min-width: 240px;
    height: auto;
}

.dy-list-view .dy-card-body {
    padding: 18px 22px;
    flex-direction: row;
    align-items: center;
    gap: 22px;
    flex: 1;
}

.dy-list-view .dy-card-info {
    flex: 1;
    min-width: 0;
}

.dy-list-view .dy-card-footer {
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    min-width: 180px;
    border-top: none;
    background: transparent;
    gap: 8px;
}

.dy-list-view .dy-card-price-row {
    align-items: center;
    justify-content: flex-end;
}

.dy-list-view .dy-card-price {
    align-items: center;
    justify-content: flex-end;
}

.dy-list-view .dy-card-ratio-row {
    justify-content: space-between;
}

.dy-list-view .dy-card-actions {
    flex-direction: column;
    align-items: stretch;
    gap: 5px;
    width: auto;
    min-width: 96px;
    align-self: flex-end;
    justify-content: center;
    margin-bottom: 2px;
}

.dy-list-view .dy-btn-buy {
    width: 100%;
    justify-content: center;
}

.dy-list-view .dy-btn-copy {
    width: 100%;
    justify-content: center;
}

/* ===== 表格视图 ===== */
.dy-table-view {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    overflow-x: auto;
    margin-bottom: 40px;
    box-shadow: var(--shadow-sm);
    -webkit-overflow-scrolling: touch;
}

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

.dy-table-view thead {
    background: var(--bg-soft);
}

.dy-table-view th,
.dy-table-view td {
    padding: 13px 15px;
    text-align: left;
    font-size: 13px;
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}

.dy-table-view th {
    font-weight: 800;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    font-size: 11px;
}

.dy-table-view td {
    color: var(--text-primary);
}

.dy-table-view tbody tr:hover {
    background: var(--bg-soft);
}

.dy-table-view tbody tr:last-child td {
    border-bottom: none;
}

.dy-table-price {
    color: var(--accent);
    font-weight: 800;
    font-size: 15px;
}

/* 操作列固定悬浮在右侧 */
.dy-table-view th:last-child,
.dy-table-view td.dy-table-actions {
    position: sticky;
    right: 0;
    z-index: 2;
    background: var(--bg-card);
    box-shadow: -2px 0 6px rgba(0,0,0,.04);
    backdrop-filter: blur(4px);
}
.dy-table-view thead th:last-child {
    background: var(--bg-soft);
    z-index: 3;
}
.dy-table-view tbody tr:hover td.dy-table-actions {
    background: var(--bg-soft);
}

.dy-table-actions {
    text-align: right;
    min-width: 90px;
}

.dy-table-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 12px;
    background: linear-gradient(135deg, var(--accent), var(--violet));
    color: #fff;
    border-radius: var(--radius-sm);
    font-size: 12px;
    font-weight: 700;
    transition: var(--transition);
    box-shadow: 0 2px 6px rgba(79,70,229,.20);
}

.dy-table-btn:hover {
    background: var(--accent-hover);
}

/* ===== 分页 ===== */
.dy-pagination {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    margin: 32px 0 40px;
}

.dy-page-info {
    font-size: 12.5px;
    color: var(--text-muted);
    line-height: 1.5;
}
.dy-page-info strong {
    color: var(--text-primary);
    font-weight: 700;
}

.dy-page-buttons {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    justify-content: center;
}

.dy-page-btn {
    min-width: 36px;
    height: 36px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    color: var(--text-secondary);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: var(--transition);
    cursor: pointer;
    user-select: none;
}

.dy-page-btn:hover {
    background: var(--bg-soft);
    color: var(--text-primary);
    border-color: var(--border-strong);
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0,0,0,0.06);
}

.dy-page-btn.active {
    background: linear-gradient(135deg, var(--accent), var(--violet));
    color: #fff;
    border-color: transparent;
    font-weight: 700;
    box-shadow: 0 3px 10px rgba(79,70,229,.30);
}
.dy-page-btn.active:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(79,70,229,.38);
}

.dy-page-btn.dy-page-edge {
    padding: 0 10px;
    font-size: 13px;
}

.dy-page-btn.disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
}

.dy-page-ellipsis {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 36px;
    color: var(--text-muted);
    font-size: 14px;
    user-select: none;
}

/* ===== 页脚 ===== */
.dy-footer {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(1100px 520px at 0% -10%, rgba(167, 139, 250, 0.16) 0%, transparent 60%),
        radial-gradient(900px 520px at 100% 0%, rgba(45, 212, 191, 0.10) 0%, transparent 55%),
        linear-gradient(180deg, #FDFCFF 0%, #F7F5FF 60%, #F3F8FF 100%);
    border-top: 1px solid rgba(139, 92, 246, 0.10);
    padding: 48px 0 20px;
    margin-top: 48px;
    isolation: isolate;
}

/* 两团微微浮动的光点装饰（保持微动态，不干扰点击） */
.dy-footer::before,
.dy-footer::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    opacity: 0.45;
    z-index: -1;
    pointer-events: none;
    animation: dyFooterGlow 11s ease-in-out infinite;
}
.dy-footer::before {
    width: 300px; height: 300px;
    left: -90px; top: 42%;
    background: radial-gradient(circle, rgba(167,139,250,0.7) 0%, transparent 70%);
}
.dy-footer::after {
    width: 340px; height: 340px;
    right: -100px; top: 8%;
    background: radial-gradient(circle, rgba(45,212,191,0.55) 0%, transparent 70%);
    animation-delay: -4.5s;
}
@keyframes dyFooterGlow {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); opacity: 0.36; }
    50%      { transform: translate3d(0, -12px, 0) scale(1.08); opacity: 0.58; }
}

.dy-footer-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 32px;
}

.dy-footer-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 36px 32px;
    margin-bottom: 32px;
}

.dy-footer-col {
    min-width: 0;
}

.dy-footer-col h4 {
    font-size: 14px;
    font-weight: 800;
    color: var(--text-primary);
    margin: 0 0 14px;
    padding-bottom: 10px;
    letter-spacing: 0.15px;
    position: relative;
}
.dy-footer-col h4::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 30px;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, #8B5CF6, #2DD4BF);
    transform-origin: left;
    transform: scaleX(1);
    transition: transform .5s cubic-bezier(.16,1,.3,1), width .45s ease;
    opacity: 0.9;
}
.dy-footer-col:hover h4::after {
    width: 52px;
}

.dy-footer-col p {
    font-size: 13px;
    color: var(--text-secondary);
    line-height: 1.85;
    margin: 0 0 10px;
    display: flex;
    align-items: flex-start;
    gap: 8px;
}
.dy-footer-col p i {
    color: var(--accent);
    margin-top: 5px;
    width: 14px;
    text-align: center;
    flex-shrink: 0;
    font-size: 11px;
}

/* 链接保持原一行一个的整齐垂直排列 */
.dy-footer-col a {
    font-size: 13px;
    color: var(--text-secondary);
    display: block;
    width: fit-content;
    max-width: 100%;
    padding: 4px 0 4px 10px;
    margin: 0 0 3px;
    position: relative;
    transition: all .24s ease;
    text-decoration: none;
    line-height: 1.6;
    border-radius: 8px;
}
.dy-footer-col a::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px; height: 4px;
    border-radius: 50%;
    background: linear-gradient(135deg, #A78BFA, #2DD4BF);
    transition: transform .24s ease, box-shadow .24s ease;
}
.dy-footer-col a:hover {
    color: var(--accent);
    padding-left: 14px;
    background: rgba(139, 92, 246, 0.06);
}
.dy-footer-col a:hover::before {
    transform: translateY(-50%) scale(1.4);
    box-shadow: 0 0 0 4px rgba(45, 212, 191, 0.12);
}

.dy-footer-bottom {
    border-top: 1px solid rgba(124, 58, 237, 0.10);
    padding-top: 18px;
    margin-top: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px 18px;
    font-size: 12px;
    color: var(--text-muted);
}

/* ===== 浮动客服 ===== */
.dy-cs-float {
    position: fixed;
    right: 24px;
    bottom: 24px;
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, var(--accent), var(--violet));
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 20px;
    box-shadow: 0 4px 16px rgba(79,70,229,.30);
    transition: var(--transition);
    z-index: 999;
}

.dy-cs-float:hover {
    background: var(--accent-hover);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(79,70,229,.40);
}

/* ===== 左侧悬浮快捷业务板块 ===== */
.dy-side-nav {
    position: fixed;
    left: 22px;
    top: 50%;
    transform: translateY(-50%);
    width: 220px;
    z-index: 998;
    pointer-events: none; /* 子项单独开启，避免透明区域挡主内容点击 */
    animation: dySideIn .85s cubic-bezier(.16, 1, .3, 1) both;
    animation-delay: .15s;
}
@keyframes dySideIn {
    from { opacity: 0; transform: translate3d(-30px, -50%, 0); }
    to   { opacity: 1; transform: translate3d(0, -50%, 0); }
}

.dy-side-card {
    pointer-events: auto;
    padding: 14px 14px 12px;
    background: rgba(255, 255, 255, 0.86);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    position: relative;
    overflow: hidden;
}

.dy-side-head {
    position: relative;
    padding: 2px 4px 10px;
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    border-bottom: 1px solid var(--border);
}
.dy-side-title {
    margin: 0;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.2px;
    color: var(--text-primary);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.dy-side-title::before {
    content: '';
    width: 3px; height: 13px;
    border-radius: var(--radius-sm);
    background: linear-gradient(180deg, #8B5CF6, #2DD4BF);
}
.dy-side-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: var(--radius-md);
    color: var(--accent);
    background: rgba(139, 92, 246, 0.08);
    border: 1px solid rgba(139, 92, 246, 0.14);
    letter-spacing: 0.3px;
}

.dy-side-list {
    position: relative;
    list-style: none;
    padding: 6px 2px 4px;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.dy-side-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 9px;
    border-radius: var(--radius-md);
    text-decoration: none;
    color: var(--text-primary);
    transition: all .22s ease;
    background: transparent;
    border: 1px solid transparent;
    position: relative;
}

.dy-side-item:hover {
    background: rgba(139, 92, 246, 0.07);
    border-color: rgba(139, 92, 246, 0.16);
}

.dy-side-icon {
    flex-shrink: 0;
    width: 30px; height: 30px;
    border-radius: var(--radius-md);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 13px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
    transition: transform .24s ease;
    position: relative;
    z-index: 1;
}
.dy-side-item:hover .dy-side-icon {
    transform: translateY(-1px) scale(1.03);
}

.dy-side-icon.is-boost { background: linear-gradient(135deg, #6366F1 0%, #8B5CF6 55%, #A855F7 100%); }
.dy-side-icon.is-equip { background: linear-gradient(135deg, #10B981 0%, #2DD4BF 55%, #06B6D4 100%); }
.dy-side-icon.is-play  { background: linear-gradient(135deg, #F97316 0%, #F43F5E 55%, #EC4899 100%); }

.dy-side-text {
    position: relative;
    z-index: 1;
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.dy-side-text .t {
    font-size: 13.5px;
    font-weight: 800;
    line-height: 1.25;
    color: var(--text-primary);
    letter-spacing: 0.15px;
}
.dy-side-text .s {
    font-size: 11px;
    line-height: 1.35;
    color: var(--text-secondary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

/* 平板：太窄时隐藏左侧悬浮，避免遮挡 */
@media (max-width: 1180px) {
    .dy-side-nav { display: none; }
}

/* ===== 响应式 ===== */
@media (max-width: 1200px) {
    .dy-card-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .dy-footer-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 992px) {
    .dy-header-container {
        flex-wrap: wrap;
        justify-content: center;
    }

    .dy-stats-bar {
        order: 3;
        max-width: 100%;
        width: 100%;
        grid-template-columns: repeat(2, 1fr);
    }

    .dy-card-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .dy-banner-carousel {
        height: 260px;
    }

    .dy-banner-default {
        height: 260px;
    }

    .dy-filter-toolbar-row {
        flex-wrap: wrap;
        gap: 12px;
    }

    .dy-list-view .dy-card {
        flex-direction: column;
    }

    .dy-list-view .dy-card-image-wrap {
        width: 100%;
        height: 200px;
    }

    .dy-list-view .dy-card-body {
        flex-direction: column;
        align-items: flex-start;
    }

    .dy-list-view .dy-card-footer {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
        min-width: auto;
    }

    .dy-list-view .dy-card-price-row {
        justify-content: space-between;
    }

    .dy-list-view .dy-card-ratio-row {
        justify-content: space-between;
    }

    .dy-list-view .dy-card-actions {
        flex-direction: row;
        width: auto;
        min-width: auto;
    }
}

@media (max-width: 768px) {
    .dy-topbar-container {
        padding: 0 16px;
        height: auto;
        flex-wrap: wrap;
        justify-content: center;
        gap: 6px;
        padding-top: 8px;
        padding-bottom: 8px;
    }

    .dy-topbar-left,
    .dy-topbar-right {
        gap: 10px;
        font-size: 11px;
    }

    .dy-header-container {
        padding: 0 16px;
    }

    .dy-brand {
        width: 100%;
        justify-content: center;
    }

    .dy-main {
        padding: 0 16px 40px;
    }

    .dy-main-nav-container {
        padding: 0 16px;
        overflow-x: auto;
    }

    .dy-main-nav-bar {
        width: 100%;
        justify-content: flex-start;
    }

    .dy-banner-carousel,
    .dy-banner-default {
        height: 200px;
    }

    .dy-filter-toolbar-row {
        flex-direction: column;
        align-items: flex-start;
    }

    .dy-filter-group {
        width: 100%;
    }

    .dy-filter-price-inputs {
        width: 100%;
        justify-content: flex-start;
    }

    .dy-sort-bar {
        flex-direction: row;
        flex-wrap: nowrap;
        overflow-x: auto;
    }

    .dy-sort-actions {
        width: auto;
        justify-content: flex-start;
        flex-wrap: nowrap;
        flex-shrink: 0;
    }

    .dy-card-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .dy-card-fields-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .dy-field-cell:not(:nth-child(4n+1))::before {
        display: none;
    }

    .dy-field-cell:not(:nth-child(2n+1))::before {
        content: '';
        position: absolute;
        left: 0;
        top: 18%;
        bottom: 18%;
        width: 1px;
        background: var(--border);
    }

    .dy-field-cell:nth-child(n+3)::after {
        content: '';
        position: absolute;
        top: 0;
        left: 12%;
        right: 12%;
        height: 1px;
        background: var(--border);
    }

    .dy-card-footer {
        gap: 6px;
    }

    .dy-price-main {
        font-size: 20px;
    }

    .dy-price-main .currency {
        font-size: 12px;
    }

    .dy-price-detail {
        padding-left: 8px;
    }

    .dy-price-rent {
        font-size: 11px;
    }

    .dy-price-deposit {
        font-size: 10.5px;
    }

    .dy-ratio-tag,
    .dy-perunit-tag {
        font-size: 10px;
        padding: 2px 6px;
    }

    .dy-btn-buy {
        padding: 5px 10px;
        font-size: 11px;
        justify-content: center;
    }

    .dy-btn-buy i {
        font-size: 9px;
    }

    .dy-btn-copy {
        padding: 5px 8px;
        font-size: 10.5px;
    }

    .dy-btn-copy i {
        font-size: 9px;
    }

    .dy-footer {
        padding: 36px 0 18px;
    }

    .dy-footer-container {
        padding: 0 16px;
    }

    .dy-footer-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .dy-footer-bottom {
        flex-direction: column;
        gap: 8px;
        text-align: center;
    }

    .dy-cs-float {
        right: 18px;
        bottom: 18px;
    }

    .dy-table-view {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .dy-table-view table {
        min-width: 700px;
    }

    .dy-table-actions {
        min-width: 80px;
    }
}

/* ===== 购买/支付弹窗（契合首页靛蓝紫主题） ===== */
.dy-modal-mask {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(8px);
    z-index: 10003;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    animation: dyModalFadeIn .2s ease-out;
}
@keyframes dyModalFadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes dyModalSlideUp {
    from { opacity: 0; transform: translateY(16px) scale(0.97); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}
.dy-modal-box {
    background: #FFFFFF;
    border-radius: 18px;
    max-width: 400px;
    width: 100%;
    padding: 0;
    position: relative;
    box-shadow: 0 24px 64px rgba(79, 70, 229, 0.15), 0 4px 12px rgba(0, 0, 0, 0.06);
    animation: dyModalSlideUp .28s cubic-bezier(0.34, 1.56, 0.64, 1);
    max-height: 90vh;
    overflow-y: auto;
    overflow-x: hidden;
}
.dy-modal-box::-webkit-scrollbar { width: 4px; }
.dy-modal-box::-webkit-scrollbar-thumb { background: #E2E8F0; border-radius: 2px; }
.dy-modal-close-btn {
    position: absolute;
    top: 14px;
    right: 14px;
    background: rgba(241, 245, 249, 0.7);
    border: none;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    cursor: pointer;
    color: #64748B;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .2s;
    z-index: 10;
}
.dy-modal-close-btn:hover {
    background: #4F46E5;
    color: #fff;
    transform: rotate(90deg);
}
.dy-modal-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 22px 24px 16px;
    border-bottom: 1px solid #F1F5F9;
}
.dy-modal-header i { color: #4F46E5; font-size: 18px; }
.dy-modal-header span { font-size: 17px; font-weight: 700; color: #1E293B; }
.dy-modal-tip {
    margin: 16px 24px 0;
    color: #475569;
    font-size: 13px;
    line-height: 1.6;
    padding: 10px 12px;
    background: linear-gradient(135deg, #F8FAFC 0%, #FAF9FF 100%);
    border-radius: 8px;
    border: 1px solid #F3F0FF;
}
.dy-modal-number-card {
    margin: 16px 24px 0;
    background: linear-gradient(135deg, #4F46E5 0%, #7C3AED 100%);
    color: #fff;
    padding: 14px 16px;
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 4px 14px rgba(79, 70, 229, 0.25);
}
.dy-modal-number-label { font-size: 12px; opacity: 0.9; margin-bottom: 6px; }
.dy-modal-number-value {
    font-size: 20px; font-weight: 800; cursor: pointer;
    letter-spacing: 1px; word-break: break-all; transition: opacity .2s;
}
.dy-modal-number-value:hover { opacity: 0.85; }
.dy-modal-notice {
    margin: 12px 24px 0;
    background: linear-gradient(135deg, #FFFBEB 0%, #FEF3C7 100%);
    border: 1px solid #FDE68A;
    color: #92400E;
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1.5;
}
.dy-modal-notice i { margin-right: 5px; }
.dy-modal-qr {
    margin: 16px 24px;
    text-align: center;
    cursor: zoom-in;
}
.dy-modal-qr img {
    max-width: 170px; width: 100%; height: auto;
    border-radius: 10px; box-shadow: 0 4px 15px rgba(0,0,0,.08);
    border: 1px solid #F3F0FF;
}
.dy-modal-qr-hint { display: block; margin-top: 6px; font-size: 11px; color: #94A3B8; }
.dy-modal-warn {
    margin: 0 24px;
    color: #DC2626; font-size: 12.5px; line-height: 1.5; font-weight: 600;
    padding: 8px 10px; background: rgba(239,68,68,.04); border-radius: 6px;
}
.dy-modal-confirm-btn {
    margin: 16px 24px 20px;
    width: calc(100% - 48px);
    padding: 12px;
    border: 1px solid #E2E8F0;
    background: #F8FAFC;
    color: #475569;
    border-radius: 10px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    transition: all .2s;
}
.dy-modal-confirm-btn:hover { background: #F1F5F9; border-color: #CBD5E1; }

/* ===== 客服购买弹窗（美化版） ===== */
.dy-cs-box {
    max-width: 420px;
    padding: 0 !important;
    overflow: hidden !important;
}
.dy-cs-hero {
    background: linear-gradient(135deg, #4F46E5 0%, #7C3AED 100%);
    padding: 28px 24px 24px;
    text-align: center;
    color: #fff;
    position: relative;
}
.dy-cs-hero::before {
    content: '';
    position: absolute;
    top: -30px; right: -30px;
    width: 100px; height: 100px;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 50%;
}
.dy-cs-hero::after {
    content: '';
    position: absolute;
    bottom: -40px; left: -20px;
    width: 80px; height: 80px;
    background: rgba(255, 255, 255, 0.06);
    border-radius: 50%;
}
.dy-cs-hero-icon {
    width: 52px; height: 52px;
    margin: 0 auto 12px;
    background: rgba(255, 255, 255, 0.2);
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    position: relative;
    z-index: 1;
}
.dy-cs-hero-title {
    font-size: 18px;
    font-weight: 800;
    letter-spacing: .02em;
    position: relative;
    z-index: 1;
}
.dy-cs-hero-sub {
    font-size: 12.5px;
    opacity: 0.85;
    margin-top: 4px;
    position: relative;
    z-index: 1;
}
.dy-cs-body {
    padding: 20px 24px 16px;
}
.dy-cs-tip {
    color: #475569;
    font-size: 13px;
    line-height: 1.6;
    padding: 10px 12px;
    background: linear-gradient(135deg, #F8FAFC 0%, #FAF9FF 100%);
    border-radius: 10px;
    border: 1px solid #F3F0FF;
    margin-bottom: 14px;
}
.dy-cs-number-card {
    background: linear-gradient(135deg, #F5F3FF 0%, #EEF2FF 100%);
    border: 1px solid #E0E7FF;
    border-radius: 12px;
    padding: 14px 16px;
    text-align: center;
    margin-bottom: 18px;
    transition: all .25s;
}
.dy-cs-number-card:hover {
    box-shadow: 0 4px 14px rgba(79, 70, 229, 0.1);
    transform: translateY(-1px);
}
.dy-cs-number-label {
    font-size: 11.5px;
    color: #6366F1;
    font-weight: 600;
    margin-bottom: 6px;
    letter-spacing: .03em;
}
.dy-cs-number-label i { margin-right: 3px; }
.dy-cs-number-value {
    font-size: 19px;
    font-weight: 800;
    color: #4F46E5;
    cursor: pointer;
    letter-spacing: 1px;
    word-break: break-all;
    transition: opacity .2s;
}
.dy-cs-number-value:hover { opacity: 0.75; }
.dy-cs-qr-wrap {
    text-align: center;
    margin-bottom: 16px;
}
.dy-cs-qr-card {
    display: inline-block;
    padding: 8px;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    border: 1px solid #F3F0FF;
    cursor: zoom-in;
    transition: all .25s;
    position: relative;
}
.dy-cs-qr-card::before {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: 16px;
    background: linear-gradient(135deg, #4F46E5, #7C3AED);
    z-index: -1;
    opacity: 0;
    transition: opacity .25s;
}
.dy-cs-qr-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(79, 70, 229, 0.15);
}
.dy-cs-qr-card:hover::before { opacity: 1; }
.dy-cs-qr-card img {
    display: block;
    width: 180px;
    height: 180px;
    object-fit: contain;
    border-radius: 8px;
}
.dy-cs-qr-hint {
    margin-top: 10px;
    font-size: 11.5px;
    color: #94A3B8;
}
.dy-cs-qr-hint i { margin-right: 3px; }
.dy-cs-notice {
    color: #DC2626;
    font-size: 12.5px;
    line-height: 1.5;
    font-weight: 600;
    padding: 10px 12px;
    background: rgba(239, 68, 68, 0.04);
    border: 1px solid rgba(239, 68, 68, 0.1);
    border-radius: 8px;
    text-align: center;
}
.dy-cs-footer {
    display: flex;
    gap: 10px;
    padding: 0 24px 22px;
}
.dy-cs-btn-secondary {
    flex: 0 0 90px;
    padding: 12px;
    border: 1px solid #E2E8F0;
    background: #F8FAFC;
    color: #64748B;
    border-radius: 10px;
    cursor: pointer;
    font-size: 13.5px;
    font-weight: 600;
    transition: all .2s;
}
.dy-cs-btn-secondary:hover {
    background: #F1F5F9;
    border-color: #CBD5E1;
}
.dy-cs-btn-primary {
    flex: 1;
    padding: 12px;
    border: none;
    background: linear-gradient(135deg, #4F46E5 0%, #7C3AED 100%);
    color: #fff;
    border-radius: 10px;
    cursor: pointer;
    font-size: 13.5px;
    font-weight: 600;
    transition: all .25s;
    box-shadow: 0 2px 8px rgba(79, 70, 229, 0.25);
    white-space: nowrap;
}
.dy-cs-btn-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(79, 70, 229, 0.35);
}
.dy-cs-btn-primary i { margin-right: 5px; }

/* ===== 统一支付弹窗 ===== */
.dy-pay-modal-box { padding-bottom: 24px; }
.dy-pay-modal-header {
    display: flex; align-items: center; gap: 8px;
    padding: 22px 24px 14px; border-bottom: 1px solid #F1F5F9;
}
.dy-pay-modal-header i { color: #4F46E5; font-size: 18px; }
.dy-pay-modal-header span { font-size: 17px; font-weight: 700; color: #1E293B; }
.dy-pay-modal-amount {
    display: flex; align-items: baseline; justify-content: center; gap: 8px;
    padding: 18px 24px;
}
.dy-pay-modal-amount .label { font-size: 13px; color: #64748B; }
.dy-pay-modal-amount .value { font-size: 28px; color: #4F46E5; font-weight: 800; }
.dy-pay-channels { padding: 0 16px; }
.dy-pay-channel {
    display: flex; align-items: center; gap: 12px;
    padding: 14px 12px;
    border-radius: 12px;
    cursor: pointer;
    transition: all .2s;
    margin-bottom: 6px;
}
.dy-pay-channel:hover { background: linear-gradient(135deg, #F8FAFC 0%, #FAF9FF 100%); }
.dy-pay-channel-icon {
    width: 42px; height: 42px;
    border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    font-size: 20px;
    flex-shrink: 0;
}
.dy-pay-channel-icon-balance {
    background: linear-gradient(135deg, #4F46E5 0%, #7C3AED 100%);
    color: #fff;
}
.dy-pay-channel-icon-alipay {
    background: linear-gradient(135deg, #1677FF 0%, #00A0E9 100%);
    color: #fff;
}
.dy-pay-channel-info { flex: 1; min-width: 0; }
.dy-pay-channel-name { font-size: 15px; font-weight: 600; color: #1E293B; }
.dy-pay-channel-desc { font-size: 12px; color: #94A3B8; margin-top: 2px; }
.dy-pay-channel-arrow { color: #CBD5E1; font-size: 12px; }
.dy-pay-panel { padding: 0 24px; }
.dy-pay-panel-back {
    display: inline-flex; align-items: center; gap: 4px;
    color: #4F46E5; font-size: 13px; font-weight: 500;
    cursor: pointer; padding: 8px 0; margin-bottom: 8px;
}
.dy-pay-panel-back:hover { opacity: 0.7; }
/* 余额支付面板 */
.dy-pay-balance-confirm { text-align: center; padding: 20px 0 8px; }
.dy-pay-balance-icon {
    width: 56px; height: 56px; margin: 0 auto 12px;
    border-radius: 16px;
    background: linear-gradient(135deg, #4F46E5 0%, #7C3AED 100%);
    display: flex; align-items: center; justify-content: center;
    color: #fff; font-size: 24px;
    box-shadow: 0 8px 20px rgba(79,70,229,.3);
}
.dy-pay-balance-title { font-size: 16px; font-weight: 700; color: #1E293B; margin-bottom: 8px; }
.dy-pay-balance-amount { font-size: 32px; font-weight: 800; color: #4F46E5; margin-bottom: 6px; }
.dy-pay-balance-info { font-size: 13px; color: #64748B; margin-bottom: 20px; }
/* 支付宝面板 */
.dy-pay-alipay-wrap { text-align: center; padding: 12px 0 8px; }
.dy-pay-alipay-amount { font-size: 28px; font-weight: 800; color: #1677FF; margin-bottom: 16px; }
.dy-pay-qr-area {
    width: 180px; height: 180px; margin: 0 auto 12px;
    display: flex; align-items: center; justify-content: center; flex-direction: column;
    background: #fff; border: 1px solid #F3F0FF; border-radius: 12px; padding: 8px;
    box-shadow: 0 4px 14px rgba(0,0,0,.06);
}
.dy-pay-qr-area img, .dy-pay-qr-area canvas { border-radius: 6px; }
.dy-pay-qr-tip { font-size: 12.5px; color: #475569; margin-bottom: 16px; }
.dy-pay-qr-tip i { margin-right: 4px; }
/* 提交按钮 */
.dy-pay-submit-btn {
    width: 100%; padding: 13px;
    border: none;
    background: linear-gradient(135deg, #4F46E5 0%, #7C3AED 100%);
    color: #fff;
    border-radius: 12px;
    cursor: pointer;
    font-size: 15px; font-weight: 700;
    transition: all .25s;
    display: flex; align-items: center; justify-content: center; gap: 6px;
    box-shadow: 0 4px 14px rgba(79,70,229,.3);
}
.dy-pay-submit-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(79,70,229,.4); }
.dy-pay-submit-btn:disabled { background: #E2E8F0; color: #94A3B8; cursor: not-allowed; box-shadow: none; transform: none; }
/* 支付成功弹窗 */
.dy-pay-success-box { text-align: center; padding: 40px 24px 24px; }
.dy-pay-success-icon {
    width: 64px; height: 64px; margin: 0 auto 16px;
    border-radius: 50%;
    background: linear-gradient(135deg, #10B981 0%, #34D399 100%);
    display: flex; align-items: center; justify-content: center;
    color: #fff; font-size: 30px;
    box-shadow: 0 8px 24px rgba(16,185,129,.3);
    animation: dySuccessPop .4s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes dySuccessPop {
    from { transform: scale(0); }
    to { transform: scale(1); }
}
.dy-pay-success-title { font-size: 18px; font-weight: 700; color: #1E293B; margin-bottom: 6px; }
.dy-pay-success-desc { font-size: 13px; color: #64748B; margin-bottom: 24px; }

/* ===== 滚动条 ===== */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: var(--bg-soft);
}

::-webkit-scrollbar-thumb {
    background: var(--border-strong);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--ink-3);
}

::selection {
    background: rgba(99, 102, 241, 0.15);
    color: var(--text-primary);
}

/* ===== 专区图片卡片导航 ===== */
.dy-zone-cards {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 12px;
    margin-bottom: 20px;
    width: 100%;
}
.dy-zone-card {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    height: 110px;
    position: relative;
    border-radius: 0;
    overflow: visible;
    text-decoration: none;
    display: block !important;
    box-shadow: none;
    transition: all .2s cubic-bezier(.4,0,.2,1);
    border: none;
    background: transparent;
}
.dy-zone-card:hover {
    transform: translateY(-2px);
    box-shadow: none;
    border-color: transparent;
}
.dy-zone-card.active {
    border-color: transparent;
    box-shadow: none;
}
.dy-zone-card-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}
.dy-zone-card-placeholder-bg {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #EEF2FF, #E0E7FF);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 0;
}
.dy-zone-card-placeholder-bg i {
    font-size: 32px;
    color: #818CF8;
}
.dy-zone-card-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    padding: 10px 14px;
    background: linear-gradient(to top, rgba(15,23,42,.75) 0%, rgba(15,23,42,.30) 50%, rgba(15,23,42,.0) 100%);
}
.dy-zone-card-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    z-index: 2;
}
.dy-zone-card-title {
    font-size: 15px;
    font-weight: 800;
    color: #fff;
    text-shadow: 0 1px 3px rgba(0,0,0,.50);
    line-height: 1.2;
}
.dy-zone-card-desc {
    font-size: 11.5px;
    font-weight: 500;
    color: rgba(255,255,255,.85);
    text-shadow: 0 1px 2px rgba(0,0,0,.40);
    line-height: 1.2;
}
.dy-zone-card-go {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 26px;
    padding: 0 10px;
    background: linear-gradient(135deg, #6366F1, #8B5CF6);
    color: #fff;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 2px 6px rgba(99,102,241,.40);
    transition: all .18s ease;
    flex-shrink: 0;
}
.dy-zone-card:hover .dy-zone-card-go {
    box-shadow: 0 4px 12px rgba(99,102,241,.55);
    transform: translateY(-1px);
}

/* 响应式：图片卡片导航 */
@media (max-width: 1100px) {
    .dy-zone-card { height: 100px; }
    .dy-zone-card-title { font-size: 13px; }
}
@media (max-width: 768px) {
    .dy-zone-cards {
        flex-wrap: wrap;
    }
    .dy-zone-card {
        flex: 1 1 calc(33.333% - 12px);
        min-width: calc(33.333% - 12px);
        height: 90px;
    }
    .dy-zone-card:nth-child(4) { flex: 1 1 calc(50% - 6px); min-width: calc(50% - 6px); }
    .dy-zone-card:nth-child(5) { flex: 1 1 calc(50% - 6px); min-width: calc(50% - 6px); }
}
@media (max-width: 480px) {
    .dy-zone-card {
        flex: 1 1 calc(50% - 6px);
        min-width: calc(50% - 6px);
        height: 80px;
    }
    .dy-zone-card-title { font-size: 12px; }
    .dy-zone-card-desc { display: none; }
    .dy-zone-card-go { min-width: 30px; height: 22px; font-size: 10px; padding: 0 8px; }
}

/* ===== 筛选排序工具栏（一排一行） ===== */
.dy-sort-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: 6px;
    padding: 6px 10px;
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    margin-bottom: 16px;
    box-shadow: var(--shadow-sm);
}
.dy-sort-tags {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: nowrap;
    overflow-x: auto;
    flex: 1 1 auto;
    min-width: 0;
}
.dy-sort-tags::-webkit-scrollbar {
    height: 3px;
}
.dy-sort-tags::-webkit-scrollbar-thumb {
    background: var(--border);
    border-radius: 2px;
}

/* 动态筛选 */
.dy-dyn-filter {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 6px;
    padding-left: 6px;
    border-left: 1px solid var(--border);
    flex-shrink: 0;
    max-width: 180px;
}

.dy-dyn-filter-label {
    font-size: 11px;
    font-weight: 500;
    color: var(--text-muted);
    white-space: nowrap;
    max-width: 56px;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-shrink: 0;
}

.dy-dyn-filter-options {
    display: inline-flex;
    gap: 2px;
    flex-wrap: nowrap;
}

.dy-dyn-opt {
    display: inline-flex;
    align-items: center;
    padding: 2px 7px;
    border-radius: 3px;
    font-size: 11px;
    font-weight: 500;
    color: var(--text-secondary);
    background: var(--bg-soft);
    border: 1px solid transparent;
    cursor: pointer;
    transition: var(--transition);
    white-space: nowrap;
    font-family: inherit;
    flex-shrink: 0;
}

.dy-dyn-opt:hover {
    background: var(--bg-muted);
    color: var(--accent);
    border-color: rgba(79, 70, 229, 0.2);
}

.dy-dyn-opt.active {
    background: var(--accent);
    color: #fff;
    border-color: var(--accent);
    font-weight: 600;
}

.dy-dyn-select {
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 11px;
    color: var(--text-secondary);
    background: var(--bg-soft);
    border: 1px solid var(--border);
    cursor: pointer;
    font-family: inherit;
    transition: var(--transition);
    max-width: 96px;
}

.dy-dyn-select:hover {
    border-color: var(--accent);
    color: var(--text-primary);
}

.dy-dyn-select:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15);
}

.dy-dyn-range {
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.dy-dyn-range-input {
    width: 48px;
    padding: 2px 4px;
    border-radius: 3px;
    font-size: 11px;
    color: var(--text-secondary);
    background: var(--bg-soft);
    border: 1px solid var(--border);
    text-align: center;
    font-family: inherit;
    transition: var(--transition);
}

.dy-dyn-range-input:hover {
    border-color: var(--accent);
}

.dy-dyn-range-input:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15);
    color: var(--text-primary);
}

.dy-dyn-range-sep {
    font-size: 11px;
    color: var(--text-muted);
}

/* 动态筛选 - 多选下拉（复选框/下拉多选字段） */
.dy-multi-select {
    position: relative;
    display: inline-flex;
    flex-direction: column;
}

.dy-multi-select-trigger {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 11px;
    font-weight: 500;
    color: var(--text-secondary);
    background: var(--bg-soft);
    border: 1px solid var(--border);
    cursor: pointer;
    font-family: inherit;
    transition: var(--transition);
    white-space: nowrap;
    max-width: 96px;
}

.dy-multi-select-trigger:hover {
    border-color: var(--accent);
    color: var(--text-primary);
}

.dy-multi-select-trigger:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.15);
}

.dy-multi-select-text {
    font-size: 11px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dy-multi-select-arrow {
    font-size: 9px;
    color: var(--text-muted);
    transition: transform 0.2s ease;
}

.dy-multi-select.open .dy-multi-select-arrow {
    transform: rotate(180deg);
}

/* 多选面板使用 fixed 定位，由 JS 计算坐标，彻底脱离父容器 overflow 裁切 */
.dy-multi-select-panel {
    display: none;
    position: fixed;
    min-width: 160px;
    max-width: 280px;
    max-height: 240px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 6px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    z-index: 9999;
    padding: 4px 0;
}

.dy-multi-select-panel.show {
    display: block;
}

.dy-multi-select-list {
    display: flex;
    flex-direction: column;
}

.dy-multi-select-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    font-size: 12px;
    color: var(--text-secondary);
    cursor: pointer;
    transition: background 0.15s ease;
    white-space: nowrap;
}

.dy-multi-select-item:hover {
    background: var(--bg-soft);
    color: var(--text-primary);
}

.dy-multi-select-item input[type="checkbox"] {
    width: 14px;
    height: 14px;
    margin: 0;
    accent-color: var(--accent);
    cursor: pointer;
    flex-shrink: 0;
}

.dy-multi-select-item span {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dy-sort-tag {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 3px 10px;
    border-radius: var(--radius-sm);
    font-size: 11.5px;
    font-weight: 600;
    color: var(--text-secondary);
    background: var(--bg-soft);
    border: 1px solid transparent;
    transition: var(--transition);
    white-space: nowrap;
    flex-shrink: 0;
}
.dy-sort-tag:hover {
    background: var(--bg-muted);
    color: var(--accent);
}
.dy-sort-tag.active {
    background: linear-gradient(135deg, var(--accent), var(--violet));
    color: #fff;
    box-shadow: 0 2px 8px rgba(79,70,229,.20);
}
.dy-sort-tag i { font-size: 9px; }

.dy-sort-actions {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}
.dy-sort-actions button,
.dy-sort-actions .btn {
    padding: 3px 10px;
    font-size: 11px;
    line-height: 1.3;
}
.dy-filter-btn-accent {
    background: linear-gradient(135deg, #6366F1, #8B5CF6) !important;
    color: #fff !important;
    border: none !important;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(79,70,229,.20);
}
.dy-filter-btn-accent:hover {
    box-shadow: 0 4px 12px rgba(79,70,229,.35);
}
.dy-total-count {
    font-size: 11px;
    color: var(--text-muted);
    margin: 0 3px;
}
.dy-total-count strong {
    color: var(--accent);
    font-weight: 800;
}

/* ===== 高级筛选面板（弹出式 Modal） ===== */
.dy-advanced-filter-panel {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(15, 23, 42, 0.50);
    backdrop-filter: blur(4px);
    z-index: 2000;
    align-items: center;
    justify-content: center;
    padding: 24px;
}
.dy-advanced-filter-panel.show {
    display: flex;
}
.dy-advanced-filter-panel-inner {
    background: var(--bg-card);
    border-radius: var(--radius-xl);
    box-shadow: 0 8px 32px rgba(15, 23, 42, 0.20);
    max-width: 640px;
    width: 100%;
    max-height: 80vh;
    overflow-y: auto;
    border: 1px solid var(--border);
}
.dy-advanced-filter-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--border);
    background: linear-gradient(135deg, #EEF2FF, #F8FAFC);
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
}
.dy-advanced-filter-header h4 {
    font-size: 15px;
    font-weight: 800;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
}
.dy-advanced-filter-header h4 i { color: var(--accent); }
.dy-advanced-filter-close {
    width: 32px; height: 32px;
    border: none; background: var(--bg-soft);
    border-radius: var(--radius-sm);
    color: var(--text-secondary);
    font-size: 14px;
    cursor: pointer;
    transition: var(--transition);
    display: flex; align-items: center; justify-content: center;
}
.dy-advanced-filter-close:hover {
    background: #FEE2E2; color: #DC2626;
}
.dy-advanced-filter-grid {
    padding: 20px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
}
.dy-advanced-filter-grid .dy-filter-field {
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.dy-advanced-filter-grid .dy-filter-field label {
    font-size: 12px;
    font-weight: 600;
    color: var(--text-secondary);
}
.dy-advanced-filter-grid .dy-filter-field input {
    padding: 8px 12px;
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-md);
    font-size: 13px;
    outline: none;
    transition: var(--transition);
    background: var(--bg-card);
    color: var(--text-primary);
}
.dy-advanced-filter-grid .dy-filter-field input:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(99,102,241,.12);
}
.dy-advanced-filter-grid .dy-apply-row {
    grid-column: 1 / -1;
}
.dy-apply-row {
    padding: 0 20px 20px;
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

/* 高级筛选弹窗 - 新增控件样式 */
.dy-advanced-filter-grid .dy-filter-field select.dy-af-select {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-md);
    font-size: 13px;
    background: var(--bg-card);
    color: var(--text-primary);
    cursor: pointer;
    outline: none;
    transition: var(--transition);
}
.dy-advanced-filter-grid .dy-filter-field select.dy-af-select:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(99,102,241,.12);
}

/* 高级筛选 - 多选下拉 */
.dy-af-multi {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    width: 100%;
}
.dy-af-multi-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    padding: 8px 12px;
    border-radius: var(--radius-md);
    font-size: 13px;
    color: var(--text-secondary);
    background: var(--bg-card);
    border: 1px solid var(--border-strong);
    cursor: pointer;
    font-family: inherit;
    transition: var(--transition);
    width: 100%;
}
.dy-af-multi-trigger:hover {
    border-color: var(--accent);
    color: var(--text-primary);
}
.dy-af-multi-text {
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
    text-align: left;
}
.dy-af-multi-arrow {
    font-size: 10px;
    color: var(--text-muted);
    transition: transform 0.2s ease;
    flex-shrink: 0;
}
.dy-af-multi.open .dy-af-multi-arrow {
    transform: rotate(180deg);
}
.dy-af-multi-panel {
    display: none;
    position: fixed;
    min-width: 160px;
    max-width: 260px;
    max-height: 220px;
    overflow-y: auto;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 6px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    z-index: 9999;
    padding: 4px 0;
}
.dy-af-multi-panel.show {
    display: block;
}
.dy-af-multi-list {
    display: flex;
    flex-direction: column;
}
.dy-af-multi-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    font-size: 13px;
    color: var(--text-secondary);
    cursor: pointer;
    transition: background 0.15s ease;
    white-space: nowrap;
}
.dy-af-multi-item:hover {
    background: var(--bg-soft);
    color: var(--text-primary);
}
.dy-af-multi-item input[type="checkbox"] {
    width: 14px;
    height: 14px;
    margin: 0;
    accent-color: var(--accent);
    cursor: pointer;
    flex-shrink: 0;
}
.dy-af-multi-item span {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 高级筛选 - 范围输入 */
.dy-af-range {
    display: flex;
    align-items: center;
    gap: 6px;
}
.dy-af-range-min,
.dy-af-range-max {
    flex: 1;
    padding: 8px 10px;
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-md);
    font-size: 13px;
    color: var(--text-primary);
    background: var(--bg-card);
    outline: none;
    transition: var(--transition);
    min-width: 0;
}
.dy-af-range-min:focus,
.dy-af-range-max:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(99,102,241,.12);
}
.dy-af-range-sep {
    font-size: 13px;
    color: var(--text-muted);
    flex-shrink: 0;
}

/* 高级筛选 - 普通文本 */
.dy-af-text {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-md);
    font-size: 13px;
    color: var(--text-primary);
    background: var(--bg-card);
    outline: none;
    transition: var(--transition);
}
.dy-af-text:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(99,102,241,.12);
}

/* 清空按钮 */
.dy-btn-reset {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 18px;
    border-radius: var(--radius-md);
    font-size: 13px;
    font-weight: 600;
    color: var(--text-secondary);
    background: var(--bg-soft);
    border: 1px solid var(--border);
    cursor: pointer;
    font-family: inherit;
    transition: var(--transition);
}
.dy-btn-reset:hover {
    background: var(--bg-muted);
    border-color: var(--text-muted);
    color: var(--text-primary);
}

/* ===== 游戏分类弹窗 ===== */
.dy-game-cat-panel {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(15, 23, 42, 0.50);
    backdrop-filter: blur(4px);
    z-index: 2000;
    align-items: center;
    justify-content: center;
    padding: 24px;
}
.dy-game-cat-panel.show {
    display: flex;
}
.dy-game-cat-panel-inner {
    background: var(--bg-card);
    border-radius: var(--radius-lg);
    width: 100%;
    max-width: 560px;
    max-height: 80vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}
.dy-game-cat-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--border);
}
.dy-game-cat-header h4 {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    gap: 8px;
}
.dy-game-cat-header h4 i {
    color: var(--accent);
    font-size: 14px;
}
.dy-game-cat-close {
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: 18px;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    transition: var(--transition);
}
.dy-game-cat-close:hover {
    background: var(--bg-soft);
    color: var(--text-primary);
}
.dy-game-cat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 12px;
    padding: 20px;
}
.dy-game-cat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 14px 8px;
    border-radius: var(--radius-md);
    text-align: center;
    text-decoration: none;
    color: var(--text-secondary);
    background: var(--bg-soft);
    border: 2px solid transparent;
    transition: var(--transition);
}
.dy-game-cat-item:hover {
    background: var(--bg-muted);
    border-color: rgba(79, 70, 229, 0.3);
    color: var(--accent);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
.dy-game-cat-item.active {
    border-color: var(--accent);
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.08), rgba(139, 92, 246, 0.08));
    color: var(--accent);
}
.dy-game-cat-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-card);
    border-radius: 50%;
    border: 1px solid var(--border);
    overflow: hidden;
}
.dy-game-cat-icon img {
    width: 32px;
    height: 32px;
    object-fit: contain;
}
.dy-game-cat-icon i {
    font-size: 20px;
    color: var(--accent);
}
.dy-game-cat-name {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
}

/* ======================================================
   登录 / 注册 弹窗
   ====================================================== */
.dy-auth-modal {
    position: fixed; inset: 0;
    display: none;
    align-items: center; justify-content: center;
    z-index: 9999;
    padding: 20px;
}
.dy-auth-modal.open { display: flex; }

.dy-auth-backdrop {
    position: absolute; inset: 0;
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    animation: dy-auth-fadeIn .25s ease both;
}

.dy-auth-card {
    position: relative;
    width: 100%;
    max-width: 920px;
    min-height: 540px;
    display: grid;
    grid-template-columns: 1.1fr 1.3fr;
    background: #ffffff;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.25), 0 0 0 1px rgba(255,255,255,.08) inset;
    animation: dy-auth-pop .3s cubic-bezier(.22,1.2,.36,1) both;
}
@keyframes dy-auth-fadeIn { from { opacity: 0 } to { opacity: 1 } }
@keyframes dy-auth-pop {
    from { opacity: 0; transform: translateY(16px) scale(.97); }
    to   { opacity: 1; transform: translateY(0)    scale(1); }
}

.dy-auth-close {
    position: absolute;
    top: 14px; right: 14px;
    width: 34px; height: 34px;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(255,255,255,.5);
    color: #475569;
    border: 1px solid rgba(71,85,105,.1);
    border-radius: 10px;
    z-index: 5;
    cursor: pointer;
    transition: all .2s;
}
.dy-auth-close:hover {
    background: #fff;
    color: #EF4444;
    transform: rotate(90deg);
    box-shadow: 0 4px 10px rgba(0,0,0,.08);
}

/* ---------- 左侧品牌区 ---------- */
.dy-auth-brand {
    position: relative;
    overflow: hidden;
    padding: 44px 36px;
    display: flex; align-items: center; justify-content: center;
    background: #F8F7FF;
    color: #fff;
}
.dy-auth-brand-bg {
    position: absolute; inset: 0;
    background:
        radial-gradient(120% 80% at 20% 10%, rgba(139,92,246,.55) 0%, rgba(139,92,246,0) 60%),
        radial-gradient(120% 90% at 90% 90%, rgba(99,102,241,.65) 0%, rgba(59,130,246,0) 55%),
        linear-gradient(135deg, #4F46E5 0%, #7C3AED 45%, #8B5CF6 100%);
}
.dy-auth-brand-bg::before {
    content: '';
    position: absolute; inset: 0;
    background-image:
        radial-gradient(circle at 15% 75%, rgba(255,255,255,.22) 0, rgba(255,255,255,.22) 6px, transparent 7px),
        radial-gradient(circle at 85% 20%, rgba(255,255,255,.16) 0, rgba(255,255,255,.16) 10px, transparent 11px),
        radial-gradient(circle at 60% 92%, rgba(255,255,255,.12) 0, rgba(255,255,255,.12) 14px, transparent 15px);
    background-size: 100% 100%;
    opacity: .7;
}
.dy-auth-brand-inner {
    position: relative;
    display: flex; flex-direction: column;
    align-items: center; text-align: center;
    z-index: 2;
}
.dy-auth-logo {
    width: 128px; height: 128px;
    border-radius: 30px;
    background:
        radial-gradient(circle at 30% 20%, rgba(255,255,255,.32), rgba(255,255,255,.08) 55%, rgba(255,255,255,0) 80%),
        rgba(255,255,255,.18);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    display: flex; align-items: center; justify-content: center;
    overflow: hidden;
    border: 2.5px solid rgba(255,255,255,.55);
    box-shadow:
        0 10px 28px rgba(0,0,0,.16),
        0 0 0 1px rgba(255,255,255,.22) inset;
    margin-bottom: 22px;
    transition:
        transform .5s cubic-bezier(.22,1.2,.36,1),
        box-shadow .45s ease,
        border-color .35s ease,
        background .4s ease;
    transform: translateZ(0);
    position: relative;
    will-change: transform, box-shadow;
}
.dy-auth-logo::before {
    /* 纯白高光描边层：保持高清不糊 */
    content: '';
    position: absolute;
    inset: 3px;
    border-radius: 24px;
    border: 1px solid rgba(255,255,255,.28);
    pointer-events: none;
}
.dy-auth-logo::after {
    /* 扫光层：只显示视觉光斑，不影响图像清晰度 */
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background:
        radial-gradient(120% 60% at 50% -20%, rgba(255,255,255,.55), rgba(255,255,255,0) 60%);
    opacity: 0;
    transition: opacity .4s ease, transform .5s ease;
    pointer-events: none;
    transform: translateY(-20px);
}
.dy-auth-brand:hover .dy-auth-logo {
    transform: translateY(-5px) translateZ(0);
    box-shadow:
        0 22px 44px rgba(79,70,229,.38),
        0 0 0 2px rgba(255,255,255,.68) inset,
        0 0 42px rgba(167,139,250,.42);
    border-color: rgba(255,255,255,.82);
    background:
        radial-gradient(circle at 30% 20%, rgba(255,255,255,.42), rgba(255,255,255,.12) 55%, rgba(255,255,255,0) 80%),
        rgba(255,255,255,.24);
}
.dy-auth-brand:hover .dy-auth-logo::after {
    opacity: 1;
    transform: translateY(-6px);
}
.dy-auth-logo img {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    object-position: center;
    display: block;
    background: transparent;
    /* 默认高质量双线性/双三次插值（浏览器默认），避免 -webkit-optimize-contrast 的最近邻锯齿 */
    image-rendering: auto;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: high-quality;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    transform-origin: center center;
    box-sizing: border-box;
    /* 高 DPI 屏额外增益（空 padding 让浏览器以原尺寸渲染） */
    padding: 0;
    transition: filter .45s ease;
}
.dy-auth-brand:hover .dy-auth-logo img {
    /* 注意：绝不 scale 放大位图！只加发光，避免放大后插值模糊 */
    filter:
        drop-shadow(0 10px 16px rgba(0,0,0,.22))
        drop-shadow(0 0 8px rgba(255,255,255,.18));
}
.dy-auth-logo-fallback {
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    color: #fff; font-size: 56px;
    background:
        radial-gradient(circle at 30% 30%, rgba(255,255,255,.3), transparent 60%),
        linear-gradient(135deg, rgba(255,255,255,.22), rgba(255,255,255,.06));
    transition: transform .6s cubic-bezier(.22,1.2,.36,1), filter .4s ease;
}
.dy-auth-brand:hover .dy-auth-logo-fallback {
    transform: rotate(-4deg) translateZ(0);
    filter: drop-shadow(0 8px 14px rgba(0,0,0,.28));
}
.dy-auth-brand-name {
    font-family: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
    font-weight: 900;
    font-size: 30px;
    letter-spacing: .02em;
    margin: 0 0 10px;
    color: #fff;
    text-shadow: 0 2px 8px rgba(0,0,0,.12);
}
.dy-auth-brand-slogan {
    margin: 0 0 28px;
    font-size: 13px;
    opacity: .88;
    line-height: 1.8;
    color: rgba(255,255,255,.92);
}
.dy-auth-brand-points {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    max-width: 260px;
}
.dy-auth-brand-points li {
    display: flex;
    align-items: center;
    gap: 10px;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.2);
    padding: 10px 14px;
    border-radius: 10px;
    font-size: 13px;
    color: rgba(255,255,255,.95);
    backdrop-filter: blur(6px);
    transition: transform .35s ease, background .3s ease, border-color .3s ease, box-shadow .35s ease;
}
.dy-auth-brand-points li i {
    width: 26px; height: 26px;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(255,255,255,.25);
    border-radius: 7px;
    color: #fff;
    font-size: 12px;
    flex-shrink: 0;
    transition: transform .4s ease, background .3s ease;
}
.dy-auth-brand:hover .dy-auth-brand-points li {
    background: rgba(255,255,255,.16);
    border-color: rgba(255,255,255,.32);
    transform: translateX(4px);
    box-shadow: 0 6px 14px rgba(0,0,0,.1);
}
.dy-auth-brand:hover .dy-auth-brand-points li:nth-child(1) { transition-delay: .04s; }
.dy-auth-brand:hover .dy-auth-brand-points li:nth-child(2) { transition-delay: .08s; }
.dy-auth-brand:hover .dy-auth-brand-points li:nth-child(3) { transition-delay: .12s; }
.dy-auth-brand:hover .dy-auth-brand-points li i {
    transform: rotate(-8deg) scale(1.12);
    background: rgba(255,255,255,.38);
}

/* ---------- 右侧表单区 ---------- */
.dy-auth-form-wrap {
    padding: 40px 44px 32px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    background: #fff;
}

.dy-auth-tabs {
    display: flex;
    align-items: center;
    gap: 4px;
    border-bottom: 2px solid #E2E8F0;
    margin-bottom: 4px;
}
.dy-auth-tab {
    position: relative;
    flex: 1;
    padding: 10px 0 12px;
    background: transparent;
    border: 0;
    font-size: 15px;
    font-weight: 600;
    color: #94A3B8;
    cursor: pointer;
    transition: color .2s;
}
.dy-auth-tab.active { color: #4F46E5; }
.dy-auth-tab.active::after {
    content: '';
    position: absolute;
    left: 20%; right: 20%; bottom: -2px;
    height: 2.5px;
    border-radius: 2px;
    background: linear-gradient(90deg, #4F46E5, #8B5CF6);
}

.dy-auth-alert {
    padding: 10px 14px;
    border-radius: 10px;
    font-size: 13px;
    line-height: 1.6;
    border: 1px solid transparent;
}
.dy-auth-alert.error {
    background: rgba(239, 68, 68, 0.08);
    color: #DC2626;
    border-color: rgba(239, 68, 68, 0.2);
}
.dy-auth-alert.success {
    background: rgba(16, 185, 129, 0.1);
    color: #059669;
    border-color: rgba(16, 185, 129, 0.22);
}

.dy-auth-form { display: none; flex-direction: column; gap: 16px; }
.dy-auth-form.active { display: flex; }

.dy-auth-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.dy-auth-field label {
    font-size: 12.5px;
    color: #475569;
    font-weight: 600;
    padding-left: 2px;
}

.dy-auth-input {
    position: relative;
    display: flex;
    align-items: center;
    background: #F8FAFC;
    border: 1.5px solid #E2E8F0;
    border-radius: 10px;
    transition: all .2s;
}
.dy-auth-input:focus-within {
    border-color: #6366F1;
    background: #fff;
    box-shadow: 0 0 0 4px rgba(99,102,241,.12);
}
.dy-auth-input > i {
    padding: 0 12px 0 14px;
    color: #94A3B8;
    font-size: 13px;
    flex-shrink: 0;
}
.dy-auth-input:focus-within > i { color: #6366F1; }
.dy-auth-input input {
    flex: 1;
    padding: 11px 12px 11px 0;
    background: transparent;
    border: 0;
    outline: none;
    font-size: 14px;
    color: #0F172A;
    width: 100%;
}
.dy-auth-input input::placeholder { color: #CBD5E1; }

.dy-auth-eye {
    border: 0;
    background: transparent;
    color: #94A3B8;
    width: 38px; height: 100%;
    min-height: 40px;
    cursor: pointer;
    font-size: 13px;
    transition: color .2s;
}
.dy-auth-eye:hover { color: #4F46E5; }

/* 图形验证码 */
.dy-auth-captcha-row {
    display: flex;
    gap: 10px;
    align-items: stretch;
}
.dy-auth-captcha-input { flex: 1; }
.dy-auth-captcha-img {
    position: relative;
    width: 160px; flex-shrink: 0;
    height: 46px;
    border-radius: 10px;
    overflow: hidden;
    background: #F1F5F9;
    border: 1.5px solid #E2E8F0;
    cursor: pointer;
    transition: border-color .2s, box-shadow .2s;
}
.dy-auth-captcha-img:hover {
    border-color: #6366F1;
    box-shadow: 0 0 0 4px rgba(99,102,241,.1);
}
.dy-auth-captcha-img img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    image-rendering: -webkit-optimize-contrast;
    image-rendering: crisp-edges;
}
.dy-auth-captcha-refresh {
    position: absolute;
    top: 4px; right: 4px;
    width: 24px; height: 24px;
    border: 0;
    border-radius: 6px;
    background: rgba(255,255,255,.9);
    color: #4F46E5;
    display: inline-flex; align-items: center; justify-content: center;
    cursor: pointer;
    font-size: 11px;
    transition: all .2s;
}
.dy-auth-captcha-refresh:hover {
    background: #4F46E5;
    color: #fff;
    transform: rotate(180deg);
}

/* 协议勾选 */
.dy-auth-extra-row { margin-top: -2px; }
.dy-auth-check {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 12.5px;
    color: #475569;
    cursor: pointer;
    user-select: none;
    line-height: 1.7;
}
.dy-auth-check input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
    width: 0; height: 0;
}
.dy-auth-checkmark {
    margin-top: 3px;
    width: 15px; height: 15px;
    border: 1.5px solid #CBD5E1;
    border-radius: 4px;
    position: relative;
    flex-shrink: 0;
    background: #fff;
    transition: all .2s;
}
.dy-auth-check input[type="checkbox"]:checked + .dy-auth-checkmark {
    background: linear-gradient(135deg, #4F46E5, #8B5CF6);
    border-color: transparent;
}
.dy-auth-check input[type="checkbox"]:checked + .dy-auth-checkmark::after {
    content: '';
    position: absolute;
    left: 4px; top: 1px;
    width: 4px; height: 8px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.dy-auth-agree-text a {
    color: #4F46E5;
    text-decoration: none;
    font-weight: 500;
}
.dy-auth-agree-text a:hover {
    color: #7C3AED;
    text-decoration: underline;
}

/* 提交按钮 */
.dy-auth-submit-btn {
    margin-top: 4px;
    width: 100%;
    padding: 12px 16px;
    background: linear-gradient(135deg, #4F46E5 0%, #7C3AED 55%, #8B5CF6 100%);
    color: #fff;
    border: 0;
    border-radius: 11px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .05em;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    box-shadow: 0 6px 16px rgba(79,70,229,.32);
    transition: all .22s;
}
.dy-auth-submit-btn:hover:not(:disabled) {
    transform: translateY(-1.5px);
    box-shadow: 0 10px 22px rgba(79,70,229,.42);
    filter: brightness(1.04);
}
.dy-auth-submit-btn:active:not(:disabled) { transform: translateY(0); }
.dy-auth-submit-btn.loading,
.dy-auth-submit-btn:disabled {
    opacity: .7;
    cursor: not-allowed;
}
.dy-auth-submit-btn.loading span {
    position: relative;
    padding-left: 22px;
}
.dy-auth-submit-btn.loading span::before {
    content: '';
    position: absolute;
    left: 0; top: 50%;
    width: 14px; height: 14px;
    margin-top: -7px;
    border: 2px solid rgba(255,255,255,.45);
    border-top-color: #fff;
    border-radius: 50%;
    animation: dy-auth-spin .8s linear infinite;
}
@keyframes dy-auth-spin { to { transform: rotate(360deg); } }

/* ======================================================
   协议阅读弹窗
   ====================================================== */
.dy-protocol-reader {
    position: fixed; inset: 0;
    display: none;
    align-items: center; justify-content: center;
    z-index: 10000;
    padding: 24px;
}
.dy-protocol-reader.open { display: flex; }
.dy-protocol-backdrop {
    position: absolute; inset: 0;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(5px);
    animation: dy-auth-fadeIn .2s ease both;
}
.dy-protocol-card {
    position: relative;
    width: 100%; max-width: 680px;
    max-height: 82vh;
    display: flex; flex-direction: column;
    background: #fff;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 24px 70px rgba(0,0,0,.3);
    animation: dy-auth-pop .28s cubic-bezier(.22,1.2,.36,1) both;
}
.dy-protocol-header {
    display: flex; align-items: center; gap: 10px;
    padding: 14px 18px;
    background: linear-gradient(90deg, rgba(79,70,229,.08), rgba(139,92,246,.08));
    color: #1E293B;
    font-weight: 600;
    font-size: 15px;
    border-bottom: 1px solid #E2E8F0;
}
.dy-protocol-header > i {
    color: #4F46E5;
    width: 30px; height: 30px;
    display: inline-flex; align-items: center; justify-content: center;
    background: rgba(79,70,229,.14);
    border-radius: 8px;
    font-size: 13px;
    flex-shrink: 0;
}
.dy-protocol-header > span { flex: 1; }
.dy-protocol-close {
    width: 32px; height: 32px;
    background: transparent;
    border: 0;
    color: #64748B;
    border-radius: 8px;
    cursor: pointer;
    transition: all .2s;
}
.dy-protocol-close:hover {
    background: rgba(239,68,68,.1);
    color: #EF4444;
}
.dy-protocol-body {
    flex: 1;
    overflow-y: auto;
    padding: 18px 22px 8px;
    color: #334155;
}
.dy-protocol-body::-webkit-scrollbar { width: 8px; }
.dy-protocol-body::-webkit-scrollbar-thumb {
    background: #CBD5E1;
    border-radius: 4px;
}
.dy-protocol-body::-webkit-scrollbar-thumb:hover { background: #94A3B8; }
.dy-protocol-body h1,
.dy-protocol-body h2,
.dy-protocol-body h3 { color: #1E293B; }

.dy-protocol-footer {
    padding: 14px 22px;
    border-top: 1px solid #E2E8F0;
    background: #F8FAFC;
    display: flex; justify-content: center;
}
.dy-protocol-btn {
    padding: 9px 22px;
    background: linear-gradient(135deg, #4F46E5, #8B5CF6);
    color: #fff;
    border: 0;
    border-radius: 9px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all .2s;
    box-shadow: 0 4px 12px rgba(79,70,229,.28);
}
.dy-protocol-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 7px 18px rgba(79,70,229,.38);
}

/* 弹窗响应式 */
@media (max-width: 820px) {
    .dy-auth-card {
        grid-template-columns: 1fr;
        min-height: auto;
    }
    .dy-auth-brand {
        padding: 28px 22px;
    }
    .dy-auth-brand-points { display: none; }
    .dy-auth-brand-name { font-size: 22px; }
    .dy-auth-logo { width: 88px; height: 88px; margin-bottom: 12px; border-radius: 22px; }
    .dy-auth-logo-fallback { font-size: 38px; }
    .dy-auth-form-wrap { padding: 24px 20px 20px; }
}
@media (max-width: 576px) {
    .dy-page-info { font-size: 11px; }
    .dy-page-btn { min-width: 32px; height: 32px; padding: 0 8px; font-size: 12px; }
    .dy-page-ellipsis { height: 32px; min-width: 20px; }
    .dy-sort-bar {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding: 6px 8px;
        gap: 4px;
    }
    .dy-sort-tags {
        flex: 0 0 auto;
        overflow-x: auto;
    }
    .dy-sort-actions {
        flex-shrink: 0;
    }
    .dy-multi-select { width: auto; }
    .dy-multi-select-trigger { width: auto; }
    .dy-multi-select-panel {
        min-width: 140px;
        max-width: 260px;
        max-height: 200px;
    }
    /* 移动端分页适配 */
    .dy-page-info { font-size: 11px; }
    .dy-page-btn { min-width: 32px; height: 32px; padding: 0 8px; font-size: 12px; }
    .dy-page-ellipsis { height: 32px; min-width: 20px; }
}

/* ============================================================
   深色顶部导航 Header
   ============================================================ */
.dy-header-dark {
    background: linear-gradient(180deg, #1a1d29 0%, #232636 100%);
    border-bottom: 1px solid rgba(255,255,255,.06);
    position: sticky;
    top: 0;
    z-index: 1000;
}
/* 导航与内容之间无间隙（内容紧贴导航） */
.dy-header-dark-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 32px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}
.dy-header-dark .dy-brand { flex-shrink: 0; }
.dy-header-dark .dy-logo { display: flex; align-items: center; gap: 10px; }
.dy-header-dark .dy-logo-icon {
    width: 34px; height: 34px;
    background: linear-gradient(135deg, #6366F1, #8B5CF6);
    border-radius: 4px;
    display: flex; align-items: center; justify-content: center;
    color: #fff; font-size: 15px; flex-shrink: 0;
    box-shadow: 0 2px 6px rgba(99,102,241,.35);
}
.dy-header-dark .dy-logo-img { height: 32px; width: auto; }
.dy-header-dark .dy-logo-name {
    font-family: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
    font-size: 24px; font-weight: 900; color: #F8FAFC; letter-spacing: .02em;
}
.dy-header-dark .dy-logo-slogan {
    font-size: 10.5px; color: #64748B; margin-top: 1px;
}
/* 主导航 */
.dy-header-dark .dy-main-nav-bar {
    display: flex; align-items: center; gap: 4px;
    padding: 0; margin: 0;
}
.dy-header-dark .dy-main-nav-bar > a {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 6px 12px; font-size: 13px; font-weight: 500;
    color: #94A3B8; border-radius: 3px;
    transition: all .15s ease; white-space: nowrap;
    position: relative;
}
.dy-header-dark .dy-main-nav-bar > a:hover {
    color: #E2E8F0;
    background: rgba(255,255,255,.04);
}
.dy-header-dark .dy-main-nav-bar > a.active {
    color: #fff;
    font-weight: 600;
}
.dy-header-dark .dy-main-nav-bar > a.active::after {
    content: '';
    position: absolute;
    bottom: -18px;
    left: 50%;
    transform: translateX(-50%);
    width: 20px;
    height: 2px;
    background: linear-gradient(90deg, #6366F1, #8B5CF6);
    border-radius: 1px;
}
.dy-header-dark .dy-main-nav-bar > a i {
    font-size: 12px;
    opacity: .7;
}
.dy-header-dark .dy-main-nav-bar > a.active i {
    opacity: 1;
}
/* 顶部导航：所有入口的图标都使用不同渐变（与三大业务按钮同风格） */
.dy-header-dark .dy-main-nav-bar > a > i {
    opacity: 1;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

/* 原有 5 个导航项：各不相同的配色 */
.dy-header-dark .dy-main-nav-bar > a.dy-nav-item-home > i {
    background-image: linear-gradient(135deg, #60A5FA, #22D3EE); /* 首页：晴空蓝 */
}
.dy-header-dark .dy-main-nav-bar > a.dy-nav-item-articles > i {
    background-image: linear-gradient(135deg, #FBBF24, #F472B6); /* 消息：琥珀→粉 */
}
.dy-header-dark .dy-main-nav-bar > a.dy-nav-item-user > i {
    background-image: linear-gradient(135deg, #A78BFA, #6366F1); /* 个人：紫 */
}
.dy-header-dark .dy-main-nav-bar > a.dy-nav-item-publish > i {
    background-image: linear-gradient(135deg, #34D399, #14B8A6); /* 发布：翠绿 */
}
.dy-header-dark .dy-main-nav-bar > a.dy-nav-item-service > i {
    background-image: linear-gradient(135deg, #93C5FD, #22D3EE); /* 客服：天蓝→薄荷 */
}

/* 三大业务入口配色（沿用原有视觉） */
.dy-header-dark .dy-main-nav-bar > a.dy-nav-business--boost > i {
    background-image: linear-gradient(135deg, #818CF8, #A78BFA); /* 紫蓝 */
}
.dy-header-dark .dy-main-nav-bar > a.dy-nav-business--equip > i {
    background-image: linear-gradient(135deg, #34D399, #2DD4BF); /* 翡翠 */
}
.dy-header-dark .dy-main-nav-bar > a.dy-nav-business--play > i {
    background-image: linear-gradient(135deg, #FB923C, #F472B6); /* 橙粉 */
}

.dy-header-dark .dy-main-nav-bar > a.dy-nav-business:hover,
.dy-header-dark .dy-main-nav-bar > a.dy-nav-item-home:hover,
.dy-header-dark .dy-main-nav-bar > a.dy-nav-item-articles:hover,
.dy-header-dark .dy-main-nav-bar > a.dy-nav-item-user:hover,
.dy-header-dark .dy-main-nav-bar > a.dy-nav-item-publish:hover,
.dy-header-dark .dy-main-nav-bar > a.dy-nav-item-service:hover {
    color: #fff;
}

/* active 时图标保持同色（active 条已经足够表达选中态，不做强冲突） */
.dy-header-dark .dy-main-nav-bar > a.active > i {
    background-image: linear-gradient(135deg, rgba(255,255,255,.95), rgba(226,232,240,.95));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    opacity: 1;
}

/* 中屏隐藏业务入口，避免导航溢出 */
@media (max-width: 1280px) {
    .dy-header-dark .dy-main-nav-bar > a.dy-nav-business { display: none; }
}
.dy-header-right {
    display: flex; align-items: center; gap: 8px; flex-shrink: 0;
}
.dy-search-box {
    display: flex; align-items: center; gap: 0;
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 4px;
    overflow: hidden;
    transition: all .15s ease;
}
.dy-search-box:focus-within {
    background: rgba(255,255,255,.08);
    border-color: rgba(99,102,241,.50);
    box-shadow: 0 0 0 2px rgba(99,102,241,.12);
}
.dy-search-box input {
    width: 140px; padding: 6px 10px;
    border: none; background: transparent;
    color: #E2E8F0; font-size: 12.5px; outline: none;
}
.dy-search-box input::placeholder { color: #475569; }
.dy-search-box button {
    padding: 6px 10px; background: rgba(255,255,255,.06);
    color: #94A3B8; font-size: 12px; border: none; cursor: pointer;
    transition: all .15s;
}
.dy-search-box button:hover {
    background: rgba(99,102,241,.25);
    color: #C7D2FE;
}
.dy-user-chip {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 5px 10px; border-radius: 4px;
    background: rgba(255,255,255,.05); color: #CBD5E1;
    font-size: 12px; font-weight: 500;
}
.dy-user-chip:hover { background: rgba(255,255,255,.08); color: #E2E8F0; }
.dy-auth-btn {
    padding: 6px 14px; border-radius: 4px;
    font-size: 12px; font-weight: 600; transition: all .15s ease;
    white-space: nowrap;
}
.dy-auth-btn-ghost {
    border: 1px solid rgba(255,255,255,.12); color: #94A3B8;
    background: transparent;
}
.dy-auth-btn-ghost:hover {
    color: #E2E8F0;
    border-color: rgba(255,255,255,.25);
    background: rgba(255,255,255,.04);
}
.dy-auth-btn-primary {
    background: linear-gradient(135deg, #6366F1, #8B5CF6);
    color: #fff; border: none;
    box-shadow: 0 2px 6px rgba(99,102,241,.30);
}
.dy-auth-btn-primary:hover {
    box-shadow: 0 3px 10px rgba(99,102,241,.45);
    transform: translateY(-1px);
}

/* ============================================================
   商品详情页 (duoysu/product_detail.php)
   ============================================================ */
.dy-detail-page { background: var(--bg); }

/* 面包屑 */
.dy-breadcrumb {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px 0 12px;
    font-size: 13px;
    color: var(--text-muted);
    flex-wrap: wrap;
}
.dy-breadcrumb-link {
    display: inline-flex; align-items: center; gap: 6px;
    color: var(--text-muted);
    text-decoration: none;
    padding: 4px 10px;
    border-radius: 8px;
    transition: all .25s ease;
}
.dy-breadcrumb-link:hover {
    background: var(--bg-card);
    color: var(--primary);
    box-shadow: 0 0 0 1px var(--border);
}
.dy-breadcrumb-link img { width: 18px; height: 18px; border-radius: 4px; object-fit: contain; }
.dy-breadcrumb-sep { font-size: 10px; color: #CBD5E1; opacity: .7; }
.dy-breadcrumb-current { color: var(--primary); font-weight: 600; }

/* 详情主卡片 */
.dy-detail-card {
    background: #fff;
    border-radius: 18px;
    box-shadow: 0 2px 14px rgba(15,23,42,.04), 0 0 0 1px rgba(15,23,42,.03) inset;
    padding: 22px 26px 26px;
    margin-bottom: 20px;
}

/* 元信息条 */
.dy-detail-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 16px;
    margin-bottom: 18px;
    border-bottom: 1px dashed var(--border);
    flex-wrap: wrap;
}
.dy-detail-meta-left, .dy-detail-meta-right {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
.dy-detail-number {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 13px; color: var(--text-muted);
    padding: 5px 12px;
    border-radius: 10px;
    background: #F8FAFC;
    border: 1px solid var(--border);
}
.dy-detail-number strong { color: var(--text); font-weight: 700; letter-spacing: .03em; }
.dy-copy-btn-sm {
    display: inline-flex; align-items: center;
    padding: 4px 10px;
    background: linear-gradient(135deg, #fff, #F1F5F9);
    border: 1px solid #E2E8F0;
    border-radius: 6px;
    cursor: pointer;
    font-size: 12px;
    color: #475569;
    font-weight: 500;
    transition: all .3s ease;
    margin-left: 4px;
}
.dy-copy-btn-sm:hover {
    background: linear-gradient(135deg, #6366F1, #8B5CF6);
    color: #fff;
    border-color: transparent;
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgba(99,102,241,.35);
}
.dy-copy-btn-sm.copy-ok {
    background: linear-gradient(135deg, #10B981, #059669);
    color: #fff;
    border-color: transparent;
    box-shadow: 0 3px 8px rgba(16,185,129,.35);
}
.dy-detail-date {
    font-size: 12.5px;
    color: var(--text-muted);
    display: inline-flex; align-items: center; gap: 5px;
}
.dy-detail-date i { color: #94A3B8; }

/* 主布局：左图右信息 */
.dy-detail-grid {
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 36px;
    align-items: start;
}
@media (max-width: 980px) {
    .dy-detail-grid { grid-template-columns: 1fr; gap: 28px; }
}

/* ============== 图片 ============== */
.dy-detail-gallery { position: relative; }
.dy-detail-mainimg {
    position: relative;
    aspect-ratio: 4/3;
    width: 100%;
    border-radius: 16px;
    overflow: hidden;
    background: linear-gradient(135deg, #F1F5F9, #EEF2FF);
    cursor: zoom-in;
    box-shadow: 0 8px 26px rgba(15,23,42,.08), 0 0 0 1px rgba(15,23,42,.04);
}
.dy-detail-mainimg img {
    width: 100%; height: 100%;
    object-fit: contain;
    display: block;
    background: #fff;
    transition: transform .5s ease;
    image-rendering: auto;
}
.dy-detail-mainimg:hover img { transform: scale(1.02); }

.dy-img-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px; height: 40px;
    border-radius: 50%;
    background: rgba(255,255,255,.85);
    border: none;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    color: #4F46E5;
    box-shadow: 0 6px 18px rgba(0,0,0,.14);
    opacity: .6;
    transition: all .25s ease;
    z-index: 2;
}
.dy-img-prev { left: 14px; }
.dy-img-next { right: 14px; }
.dy-detail-mainimg:hover .dy-img-nav,
.dy-thumbs:hover + .dy-detail-mainimg .dy-img-nav { opacity: 1; }
.dy-img-nav:hover { background: linear-gradient(135deg,#6366F1,#8B5CF6); color: #fff; opacity: 1; transform: translateY(-50%) scale(1.05); }
.dy-img-counter {
    position: absolute; right: 12px; bottom: 12px;
    padding: 4px 10px; border-radius: 999px;
    background: rgba(15,23,42,.55);
    color: #fff;
    font-size: 12px;
    backdrop-filter: blur(4px);
}

.dy-thumbs {
    margin-top: 14px;
    display: grid;
    grid-template-columns: repeat(auto-fill, 82px);
    gap: 10px;
}
.dy-thumb {
    width: 82px; height: 62px;
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
    background: #F1F5F9;
    border: 2px solid transparent;
    transition: all .25s ease;
    box-sizing: border-box;
}
.dy-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.dy-thumb:hover { transform: translateY(-2px); border-color: var(--primary-light); }
.dy-thumb.active {
    border-color: var(--primary);
    box-shadow: 0 4px 12px rgba(99,102,241,.3);
}

.dy-no-image {
    aspect-ratio: 4/3;
    border-radius: 16px;
    background: linear-gradient(135deg, #F1F5F9, #EEF2FF);
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 12px; color: #94A3B8;
}
.dy-no-image i { font-size: 48px; }

/* ============== 右侧信息 ============== */
.dy-detail-info { display: flex; flex-direction: column; gap: 16px; }
.dy-detail-title {
    font-size: 26px;
    font-weight: 800;
    line-height: 1.35;
    margin: 0;
    color: var(--text);
    letter-spacing: .01em;
}
.dy-detail-subtitle {
    font-size: 14px;
    line-height: 1.7;
    color: var(--text-muted);
    margin: -6px 0 0;
    padding: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 价格区块 */
.dy-detail-price {
    background:
        linear-gradient(135deg, rgba(224,231,255,.55), rgba(237,233,254,.5));
    border-radius: 16px;
    padding: 18px 20px 20px;
    border: 1px solid rgba(99,102,241,.12);
    position: relative;
    overflow: hidden;
}
.dy-detail-price::before {
    content: '';
    position: absolute; top: -80px; right: -60px;
    width: 220px; height: 220px;
    background: radial-gradient(circle, rgba(139,92,246,.18), transparent 70%);
    border-radius: 50%;
}
.dy-detail-total { position: relative; z-index: 1; }
.dy-detail-total-row {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 8px;
}
.dy-detail-total-label {
    font-size: 14px; color: var(--text-muted); font-weight: 500;
}
.dy-detail-saved {
    display: inline-flex; align-items: center;
    padding: 3px 10px; border-radius: 999px;
    background: linear-gradient(135deg,#D1FAE5,#ECFDF5);
    color: #047857;
    font-size: 12px; font-weight: 700;
    border: 1px solid rgba(16,185,129,.3);
}
.dy-detail-total-amount {
    display: flex; align-items: flex-end; gap: 4px;
}
.dy-detail-total-amount .dy-total-yuan {
    font-size: 22px;
    color: var(--primary);
    font-weight: 800;
    line-height: 1;
    padding-bottom: 4px;
}
.dy-detail-total-amount .dy-total-num {
    font-size: 40px;
    line-height: 1;
    background: linear-gradient(135deg,#4F46E5,#8B5CF6);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 900;
    letter-spacing: -.02em;
}
.dy-detail-orig-line {
    margin-top: 4px;
    font-size: 12.5px;
    color: #94A3B8;
    text-decoration: line-through;
}

/* 费用明细 */
.dy-detail-fees {
    margin-top: 16px;
    background: rgba(255,255,255,.7);
    backdrop-filter: blur(4px);
    border-radius: 12px;
    padding: 4px 2px;
    overflow: hidden;
    position: relative; z-index: 1;
}
.dy-detail-fees-head {
    font-size: 13px; font-weight: 700; color: #334155;
    padding: 10px 14px 6px;
    letter-spacing: .03em;
}
.dy-detail-fee-row {
    display: flex; justify-content: space-between; align-items: center;
    padding: 8px 14px;
    border-top: 1px dashed rgba(148,163,184,.25);
}
.dy-detail-fee-left { display: flex; align-items: center; gap: 8px; }
.dy-detail-fee-label {
    font-size: 13px; color: var(--text-muted);
}
.dy-detail-fee-tag {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 999px;
    background: rgba(251,146,60,.12);
    color: #C2410C;
    font-size: 11px;
    font-weight: 700;
}
.dy-detail-fee-tag.green {
    background: rgba(16,185,129,.12);
    color: #047857;
}
.dy-detail-fee-right { display: flex; align-items: center; gap: 8px; }
.dy-detail-fee-original {
    color: #94A3B8;
    text-decoration: line-through;
    font-size: 12.5px;
}
.dy-detail-fee-price {
    font-weight: 700;
    color: var(--text);
    font-size: 14px;
}
.dy-detail-fee-price.rent { color: #E11D48; }
.dy-detail-fee-price.deposit { color: var(--text); }

/* 主操作按钮 */
.dy-detail-actions {
    display: grid;
    grid-template-columns: 1fr 180px;
    gap: 12px;
    margin-top: 4px;
}
@media (max-width: 640px) {
    .dy-detail-actions { grid-template-columns: 1fr; }
}
.dy-btn-order-lg {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    height: 54px;
    border-radius: 14px;
    background: linear-gradient(135deg, #4F46E5, #8B5CF6);
    color: #fff;
    font-size: 16px;
    font-weight: 800;
    border: none;
    cursor: pointer;
    letter-spacing: .04em;
    box-shadow: 0 8px 24px rgba(99,102,241,.32), 0 0 0 1px rgba(99,102,241,.15) inset;
    transition: all .3s ease;
    padding: 0 20px;
}
.dy-btn-order-lg:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 30px rgba(99,102,241,.45), 0 0 0 1px rgba(99,102,241,.25) inset;
    filter: brightness(1.03);
}
.dy-btn-order-lg:active { transform: translateY(-1px); }
.dy-btn-order-lg i { font-size: 14px; }
.dy-btn-amt {
    margin-left: 2px;
    padding: 2px 10px;
    border-radius: 8px;
    background: rgba(255,255,255,.18);
    font-size: 14px;
    font-weight: 700;
}

.dy-btn-copy-lg {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 54px;
    padding: 0 14px;
    border-radius: 14px;
    background: linear-gradient(135deg, #fff, #F1F5F9);
    border: 1.5px solid #E2E8F0;
    cursor: pointer;
    color: #475569;
    transition: all .3s ease;
}
.dy-btn-copy-lg:hover {
    background: linear-gradient(135deg, #fff, #EEF2FF);
    border-color: var(--primary-light);
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(99,102,241,.18);
    color: var(--primary);
}
.dy-btn-copy-lg .dy-copy-icon {
    width: 32px; height: 32px; flex-shrink: 0;
    border-radius: 9px;
    background: linear-gradient(135deg, #6366F1, #8B5CF6);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 13px;
    transition: all .3s ease;
}
.dy-btn-copy-lg:hover .dy-copy-icon {
    transform: translateY(-1px) rotate(-6deg);
    box-shadow: 0 4px 10px rgba(99,102,241,.35);
}
.dy-btn-copy-lg .dy-copy-text {
    display: flex; flex-direction: column; line-height: 1.2;
    min-width: 0;
}
.dy-btn-copy-lg .dy-copy-tip {
    font-size: 11px; color: #94A3B8; font-weight: 500;
}
.dy-btn-copy-lg .dy-copy-val {
    font-size: 13.5px; font-weight: 700; color: #1E293B;
    margin-top: 2px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    max-width: 110px;
}
.dy-btn-copy-lg:hover .dy-copy-tip { color: var(--primary); }
.dy-btn-copy-lg:hover .dy-copy-val { color: var(--primary-dark); }

/* 服务承诺 */
.dy-detail-services {
    display: flex; flex-wrap: wrap; gap: 14px;
    padding: 14px 18px;
    border-radius: 12px;
    background: linear-gradient(135deg, #F8FAFC, #EEF2FF);
    border: 1px solid rgba(99,102,241,.08);
}
.dy-svc-item {
    display: inline-flex; align-items: center; gap: 8px;
    font-size: 12.5px; color: #475569; font-weight: 500;
}
.dy-svc-item i {
    width: 22px; height: 22px;
    border-radius: 7px;
    display: inline-flex; align-items: center; justify-content: center;
    background: #fff;
    color: var(--primary);
    font-size: 11px;
    box-shadow: 0 2px 6px rgba(99,102,241,.12);
}

/* 协议提示 */
.dy-detail-protocol {
    display: flex; align-items: flex-start; gap: 6px;
    font-size: 12px;
    color: var(--text-muted);
    padding: 0 4px;
    line-height: 1.7;
}
.dy-detail-protocol i { color: #94A3B8; margin-top: 3px; flex-shrink: 0; }
.dy-detail-protocol a {
    color: var(--primary);
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px dashed rgba(99,102,241,.4);
    transition: color .2s ease;
}
.dy-detail-protocol a:hover { color: var(--primary-dark); }

/* ============== Tab 卡 ============== */
.dy-detail-tabs {
    background: #fff;
    border-radius: 18px;
    overflow: hidden;
    margin-bottom: 24px;
    box-shadow: 0 2px 12px rgba(15,23,42,.035), 0 0 0 1px rgba(15,23,42,.025) inset;
}
.dy-tabs-header {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 14px 20px 0;
    border-bottom: 1px solid var(--border);
    position: relative;
    background: linear-gradient(180deg, #FAFBFF, #fff);
}
.dy-tab-btn {
    display: inline-flex; align-items: center; gap: 7px;
    padding: 12px 20px;
    border: none;
    background: transparent;
    color: var(--text-muted);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    position: relative;
    transition: all .25s ease;
    border-radius: 10px 10px 0 0;
}
.dy-tab-btn i { font-size: 12.5px; color: #94A3B8; }
.dy-tab-btn:hover { color: var(--primary); }
.dy-tab-btn:hover i { color: var(--primary); }
.dy-tab-btn.active {
    color: var(--primary);
    background: linear-gradient(180deg, rgba(224,231,255,.55), transparent);
}
.dy-tab-btn.active i { color: var(--primary); }
.dy-tab-btn.active::after {
    content: '';
    position: absolute;
    left: 14px; right: 14px; bottom: -1px;
    height: 3px;
    border-radius: 3px 3px 0 0;
    background: linear-gradient(135deg, #4F46E5, #8B5CF6);
    box-shadow: 0 0 10px rgba(99,102,241,.3);
}

.dy-tabs-body { padding: 22px 26px 28px; }
.dy-tab-panel { display: none; animation: dyFadeIn .35s ease; }
.dy-tab-panel.active { display: block; }
@keyframes dyFadeIn {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* 赠送条 */
.dy-gift-row {
    display: flex; align-items: flex-start; gap: 6px;
    padding: 12px 16px;
    border-radius: 12px;
    background: linear-gradient(135deg, #FFFBEB, #FEF3C7);
    border: 1px solid rgba(245,158,11,.3);
    margin-bottom: 18px;
    font-size: 13px;
    line-height: 1.7;
    color: #92400E;
}
.dy-gift-tag {
    flex-shrink: 0;
    display: inline-flex; align-items: center; gap: 6px;
    color: #B45309;
    font-weight: 800;
    letter-spacing: .02em;
}
.dy-gift-tag i { color: #F59E0B; }
.dy-gift-list { color: #7C2D12; }

/* 字段网格 */
.dy-field-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px 22px;
}
@media (max-width: 720px) {
    .dy-field-grid { grid-template-columns: 1fr; }
}
.dy-field-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 10px 14px;
    border-radius: 10px;
    background: linear-gradient(135deg, #FDFCFF 0%, #FAF9FF 100%);
    border: 1px solid #F3F0FF;
    transition: all .25s ease;
}
.dy-field-item:hover {
    background: linear-gradient(135deg, #FAF9FF 0%, #F3F0FF 100%);
    border-color: var(--primary-light);
    box-shadow: 0 3px 10px rgba(99,102,241,.08);
}
.dy-field-label {
    flex-shrink: 0;
    min-width: 90px;
    font-size: 12.5px;
    color: var(--text-muted);
    font-weight: 600;
    padding-top: 1px;
}
.dy-field-value {
    font-size: 13.5px;
    color: var(--text);
    font-weight: 500;
    line-height: 1.6;
    word-break: break-all;
}
.dy-field-empty {
    grid-column: 1/-1;
    text-align: center;
    padding: 40px 0;
    color: #94A3B8;
    font-size: 13px;
    display: flex; flex-direction: column; align-items: center; gap: 10px;
}
.dy-field-empty i { font-size: 38px; color: #CBD5E1; }

/* 图片 tab */
.dy-images-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}
@media (max-width: 900px) { .dy-images-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .dy-images-grid { grid-template-columns: 1fr; } }
.dy-images-item {
    position: relative;
    aspect-ratio: 4/3;
    border-radius: 14px;
    overflow: hidden;
    cursor: zoom-in;
    background: linear-gradient(135deg,#F1F5F9,#EEF2FF);
    box-shadow: 0 3px 12px rgba(15,23,42,.06);
    transition: transform .35s ease, box-shadow .35s ease;
}
.dy-images-item img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.dy-images-item:hover { transform: translateY(-4px); box-shadow: 0 10px 24px rgba(15,23,42,.12); }
.dy-images-item:hover img { transform: scale(1.06); }
.dy-images-overlay {
    position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0) 55%, rgba(15,23,42,.75) 100%);
    display: flex; align-items: flex-end; justify-content: center;
    padding-bottom: 14px;
    gap: 6px;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    opacity: 0;
    transition: opacity .3s ease;
}
.dy-images-item:hover .dy-images-overlay { opacity: 1; }
.dy-images-overlay i { font-size: 12px; }

/* 平台声明 */
.dy-statement-body {
    font-size: 14px;
    line-height: 1.8;
    color: #334155;
    padding: 6px 4px;
}
.dy-statement-body h1, .dy-statement-body h2, .dy-statement-body h3,
.dy-statement-body h4 { color: #1E293B; margin: 18px 0 10px; font-weight: 800; }
.dy-statement-body p { margin: 0 0 12px; }
.dy-statement-body img { max-width: 100%; border-radius: 10px; }
.dy-statement-body a { color: var(--primary); }

/* ============== 图片查看器 ============== */
.dy-img-viewer {
    position: fixed; inset: 0;
    background: rgba(2,6,23,.86);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    display: none;
    align-items: center; justify-content: center;
    z-index: 9999;
    padding: 40px;
    box-sizing: border-box;
}
.dy-img-viewer.show { display: flex; }
.dy-viewer-close {
    position: absolute; top: 20px; right: 20px;
    width: 44px; height: 44px;
    border-radius: 50%;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.25);
    color: #fff;
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: all .3s ease;
}
.dy-viewer-close:hover { background: #EF4444; transform: rotate(90deg); }
.dy-viewer-nav {
    position: absolute; top: 50%; transform: translateY(-50%);
    width: 50px; height: 50px; border-radius: 50%;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.25);
    color: #fff;
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: all .3s ease;
    z-index: 2;
}
.dy-viewer-prev { left: 30px; }
.dy-viewer-next { right: 30px; }
.dy-viewer-nav:hover {
    background: linear-gradient(135deg,#6366F1,#8B5CF6);
    transform: translateY(-50%) scale(1.08);
}
.dy-viewer-content {
    position: relative;
    max-width: 96vw;
    max-height: 92vh;
    display: flex; align-items: center; justify-content: center;
}
.dy-viewer-content img {
    max-width: 96vw;
    max-height: 86vh;
    object-fit: contain;
    border-radius: 16px;
    box-shadow: 0 30px 80px rgba(0,0,0,.55);
}
.dy-viewer-counter {
    position: absolute; bottom: -46px; left: 50%; transform: translateX(-50%);
    padding: 6px 16px; border-radius: 999px;
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.22);
    color: #fff;
    font-size: 13px; font-weight: 600;
}
.dy-viewer-hint {
    position: absolute; bottom: 24px; left: 50%; transform: translateX(-50%);
    display: flex; gap: 16px;
    color: rgba(255,255,255,.65);
    font-size: 12px;
}
.dy-viewer-hint kbd {
    display: inline-block;
    padding: 2px 7px;
    border-radius: 5px;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.22);
    margin: 0 2px;
    font-size: 11px;
    font-family: monospace;
}

/* ============== 协议弹窗（与首页同结构） ============== */
.dy-protocol-card {
    background: #fff;
    border-radius: 18px;
    max-width: 720px;
    width: 92vw;
    max-height: 86vh;
    display: flex; flex-direction: column;
    overflow: hidden;
    position: relative;
    box-shadow: 0 30px 70px rgba(0,0,0,.35);
    animation: dyModalIn .3s ease;
}
.dy-protocol-head {
    display: flex; align-items: center; gap: 12px;
    padding: 18px 22px;
    background: linear-gradient(135deg, rgba(224,231,255,.6), rgba(237,233,254,.55));
    border-bottom: 1px solid rgba(99,102,241,.12);
}
.dy-protocol-head i {
    width: 34px; height: 34px;
    border-radius: 10px;
    background: linear-gradient(135deg,#6366F1,#8B5CF6);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-size: 14px;
}
.dy-protocol-title {
    font-size: 16px; font-weight: 800; color: #1E293B;
}
.dy-protocol-body {
    padding: 22px 26px;
    overflow-y: auto;
    font-size: 14px; line-height: 1.85;
    color: #334155;
    flex: 1;
}
.dy-protocol-body h1, .dy-protocol-body h2, .dy-protocol-body h3 {
    color: #1E293B; margin: 16px 0 8px; font-weight: 800;
}
.dy-protocol-foot {
    padding: 14px 22px;
    border-top: 1px solid var(--border);
    background: #FAFBFF;
    display: flex; justify-content: flex-end;
}
.dy-protocol-foot .dy-btn-primary {
    height: 42px; padding: 0 20px; border-radius: 11px;
}
.dy-loading {
    display: flex; align-items: center; justify-content: center;
    gap: 10px; padding: 30px 0; color: var(--text-muted); font-size: 13px;
}
.dy-loading i { color: var(--primary); }

/* ============== 底部悬浮下单栏 ============== */
.dy-detail-sticky-bar {
    position: fixed; left: 0; right: 0; bottom: 0;
    background: rgba(255,255,255,.88);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-top: 1px solid rgba(99,102,241,.12);
    padding: 10px 0 calc(10px + env(safe-area-inset-bottom, 0px));
    z-index: 80;
    transform: translateY(105%);
    transition: transform .35s cubic-bezier(.22,1,.36,1);
    box-shadow: 0 -8px 28px rgba(15,23,42,.08);
}
.dy-detail-sticky-bar.show { transform: translateY(0); }
.dy-sticky-inner {
    display: flex; align-items: center; justify-content: space-between;
    gap: 16px;
}
.dy-sticky-total {
    display: flex; align-items: baseline; gap: 8px;
}
.dy-sticky-total-label {
    font-size: 13px; color: var(--text-muted);
}
.dy-sticky-total-amt {
    display: flex; align-items: baseline; gap: 2px;
}
.dy-sticky-total-amt .dy-total-yuan {
    font-size: 15px; color: var(--primary); font-weight: 800;
}
.dy-sticky-total-amt .dy-total-num {
    font-size: 26px;
    font-weight: 900;
    background: linear-gradient(135deg,#4F46E5,#8B5CF6);
    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
    line-height: 1;
}
.dy-btn-order-sticky {
    height: 48px; padding: 0 28px; border-radius: 12px;
    background: linear-gradient(135deg,#4F46E5,#8B5CF6);
    color: #fff; font-size: 15px; font-weight: 800;
    border: none; cursor: pointer;
    display: inline-flex; align-items: center; gap: 8px;
    letter-spacing: .04em;
    box-shadow: 0 8px 22px rgba(99,102,241,.4);
    transition: all .3s ease;
}
.dy-btn-order-sticky:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(99,102,241,.55); }
@media (min-width: 981px) {
    /* PC 宽屏减少悬浮条出现频率（桌面端右侧已可操作），但仍可显示 */
}
@media (max-width: 640px) {
    .dy-detail-sticky-bar .dy-btn-order-sticky { height: 44px; padding: 0 18px; font-size: 14px; }
    .dy-sticky-total-amt .dy-total-num { font-size: 22px; }
}

/* ============================================================
   统计卡片条
   ============================================================ */
.dy-stats-strip {
    background: var(--bg-card);
    border-bottom: 1px solid var(--border);
    padding: 14px 0;
}
.dy-stats-strip-container {
    max-width: 1400px; margin: 0 auto; padding: 0 32px;
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px;
}

/* ============================================================
   Banner 三栏布局
   ============================================================ */
.dy-banner-row {
    display: flex; gap: 14px; margin-bottom: 20px;
    min-height: 360px;
}
.dy-banner-left {
    flex: 0 0 200px; display: flex; flex-direction: column; gap: 14px;
}
.dy-banner-side-card {
    flex: 1; border-radius: 8px; overflow: hidden;
    border: 1px solid var(--border); box-shadow: var(--shadow-sm);
    position: relative; transition: all .2s ease;
    display: block;
}
.dy-banner-side-card:hover {
    border-color: #C7D2FE; box-shadow: 0 6px 16px rgba(99,102,241,.12);
    transform: translateY(-1px);
}
.dy-banner-side-card img {
    width: 100%; height: 100%; object-fit: cover; display: block;
}
.dy-banner-side-placeholder {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    background: var(--bg-soft); color: var(--text-muted); font-size: 12px; text-align: center;
    gap: 6px;
}
.dy-banner-side-placeholder i { font-size: 28px; color: var(--ink-4); }

.dy-banner-center {
    flex: 1; min-width: 0;
    border-radius: 8px; overflow: hidden;
    border: 1px solid var(--border); box-shadow: var(--shadow-sm);
    position: relative; background: var(--bg-soft);
}
.dy-banner-center .dy-banner-carousel {
    height: 100%; min-height: 360px;
}
.dy-banner-center .dy-banner-default {
    height: 100%; min-height: 360px;
}

.dy-banner-right {
    flex: 0 0 240px;
}
.dy-notice-panel {
    background: #fff;
    border: 1px solid #E2E8F0;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(15,23,42,.04);
    height: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.dy-notice-header {
    padding: 14px 16px;
    font-size: 14px;
    font-weight: 800;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 10px;
    background: linear-gradient(135deg, #4F46E5, #8B5CF6);
    position: relative;
    overflow: hidden;
}
.dy-notice-header::after {
    content: '';
    position: absolute;
    top: -30px;
    right: -20px;
    width: 80px;
    height: 80px;
    background: rgba(255,255,255,.15);
    border-radius: 50%;
}
.dy-notice-header::before {
    content: '';
    position: absolute;
    bottom: -20px;
    right: 30px;
    width: 40px;
    height: 40px;
    background: rgba(255,255,255,.1);
    border-radius: 50%;
}
.dy-notice-header i {
    font-size: 16px;
    position: relative;
    z-index: 1;
}
.dy-notice-header span {
    position: relative;
    z-index: 1;
}
.dy-notice-list {
    flex: 1;
    overflow-y: auto;
    padding: 8px;
}
.dy-notice-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    transition: all .18s ease;
    border-radius: 3px;
    margin-bottom: 2px;
    position: relative;
}
.dy-notice-item:hover {
    background: linear-gradient(90deg, #F5F3FF, #fff);
    transform: translateX(2px);
}
.dy-notice-item:hover .dy-notice-dot {
    background: #8B5CF6;
    box-shadow: 0 0 0 3px rgba(139,92,246,.15);
}
.dy-notice-item:hover .dy-notice-text {
    color: #4F46E5;
}
.dy-notice-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #CBD5E1;
    flex-shrink: 0;
    transition: all .18s;
}
.dy-notice-item:first-child .dy-notice-dot {
    background: #EF4444;
    box-shadow: 0 0 0 3px rgba(239,68,68,.12);
}
.dy-notice-item:nth-child(2) .dy-notice-dot {
    background: #F59E0B;
    box-shadow: 0 0 0 3px rgba(245,158,11,.12);
}
.dy-notice-text {
    flex: 1;
    font-size: 12.5px;
    color: #334155;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 500;
}
.dy-notice-item:hover .dy-notice-text {
    font-weight: 600;
}
.dy-notice-date {
    font-size: 11px;
    color: #94A3B8;
    flex-shrink: 0;
    padding: 2px 6px;
    background: #F1F5F9;
    border-radius: 2px;
}

/* "查看更多"链接 */
.dy-notice-more {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 8px 12px;
    border-top: 1px solid #F1F5F9;
    font-size: 12px;
    color: #6366F1;
    text-decoration: none;
    transition: all .18s;
}
.dy-notice-more:hover {
    background: #EEF2FF;
    color: #4F46E5;
}
.dy-notice-more i {
    font-size: 9px;
    transition: transform .18s;
}
.dy-notice-more:hover i {
    transform: translateX(2px);
}

/* 快捷功能按钮区 */
.dy-quick-actions {
    display: flex;
    gap: 4px;
    padding: 8px;
    border-top: 1px solid #F1F5F9;
}
.dy-quick-btn {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    padding: 8px 2px;
    background: transparent;
    border: none;
    border-radius: 6px;
    text-decoration: none;
    transition: all .2s ease;
    min-width: 0;
}
.dy-quick-icon {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .2s ease;
}
.dy-quick-icon svg {
    width: 16px;
    height: 16px;
    color: #fff;
}
.dy-quick-label {
    font-size: 10.5px;
    color: #64748B;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 500;
    transition: color .2s;
}
.dy-quick-btn:hover {
    background: #F8FAFC;
}
.dy-quick-btn:hover .dy-quick-icon {
    transform: scale(1.1) rotate(-3deg);
    box-shadow: 0 4px 10px rgba(0,0,0,.12);
}
.dy-quick-btn:hover .dy-quick-label {
    color: #4F46E5;
}
/* 登录/注册主按钮 */
.dy-quick-btn-primary {
    border-radius: 6px;
}
.dy-quick-btn-primary .dy-quick-label {
    color: #4F46E5;
}
.dy-quick-btn-primary:hover {
    background: #F8FAFC;
}
.dy-quick-btn-primary:hover .dy-quick-label {
    color: #4338CA;
}
.dy-quick-btn-primary:hover .dy-quick-icon {
    box-shadow: none;
}

/* ============================================================
   专区快捷入口（分类导航）
   ============================================================ */
.dy-category-nav {
    display: flex; gap: 10px; overflow-x: auto;
    padding: 12px 0; margin-bottom: 16px;
    scrollbar-width: thin;
}
.dy-cat-nav-item {
    display: flex; flex-direction: column; align-items: center; gap: 6px;
    padding: 10px 16px; border-radius: var(--radius-lg);
    background: var(--bg-card); border: 1px solid var(--border);
    transition: all .18s ease; min-width: 80px; flex-shrink: 0;
}
.dy-cat-nav-item:hover {
    border-color: #C7D2FE; background: var(--bg-muted);
    transform: translateY(-2px); box-shadow: 0 4px 12px rgba(99,102,241,.08);
}
.dy-cat-nav-item.active {
    border-color: var(--accent); background: var(--bg-muted);
    box-shadow: 0 4px 14px rgba(99,102,241,.15);
}
.dy-cat-nav-icon {
    width: 42px; height: 42px; border-radius: var(--radius-md);
    background: linear-gradient(135deg, #1E1B4B, #4C1D95);
    display: flex; align-items: center; justify-content: center;
    overflow: hidden; flex-shrink: 0;
}
.dy-cat-nav-item.active .dy-cat-nav-icon {
    background: linear-gradient(135deg, #6366F1, #8B5CF6);
    box-shadow: 0 2px 8px rgba(99,102,241,.30);
}
.dy-cat-nav-icon img { width: 100%; height: 100%; object-fit: cover; }
.dy-cat-nav-icon i { color: #fff; font-size: 18px; }
.dy-cat-nav-name {
    font-size: 12px; font-weight: 600; color: var(--text-secondary);
    white-space: nowrap;
}
.dy-cat-nav-item.active .dy-cat-nav-name { color: var(--accent); }

/* ============================================================
   响应式：Header + Banner + 分类导航
   ============================================================ */
@media (max-width: 1200px) {
    .dy-banner-row { flex-direction: row; }
    .dy-banner-left { flex: 0 0 160px; }
    .dy-banner-right { flex: 0 0 200px; }
}
@media (max-width: 992px) {
    .dy-header-dark-container {
        flex-wrap: wrap; height: auto; padding: 10px 16px; gap: 10px;
    }
    .dy-header-dark .dy-main-nav-bar {
        order: 3; width: 100%; overflow-x: auto; justify-content: flex-start;
    }
    .dy-header-dark .dy-main-nav-bar > a { padding: 6px 10px; font-size: 12.5px; }
    .dy-search-box input { width: 120px; }
    .dy-stats-strip-container { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .dy-banner-row { flex-direction: column; min-height: auto; }
    .dy-banner-left { flex-direction: row; flex: none; }
    .dy-banner-side-card { flex: 1; min-height: 120px; }
    .dy-banner-right { flex: none; }
    .dy-notice-panel { min-height: 200px; }
    .dy-banner-center .dy-banner-carousel,
    .dy-banner-center .dy-banner-default { min-height: 240px; }
}
@media (max-width: 768px) {
    .dy-header-dark-container { padding: 8px 12px; }
    .dy-header-dark .dy-logo-text { display: none; }
    .dy-header-right { gap: 6px; }
    .dy-search-box input { width: 90px; font-size: 12px; }
    .dy-auth-btn { padding: 6px 10px; font-size: 11px; }
    .dy-stats-strip-container { padding: 0 12px; grid-template-columns: repeat(2, 1fr); }
    .dy-banner-left { flex-direction: column; }
    .dy-banner-side-card { min-height: 100px; }
    .dy-cat-nav-item { min-width: 70px; padding: 8px 12px; }
    .dy-cat-nav-icon { width: 36px; height: 36px; }
    .dy-cat-nav-name { font-size: 11px; }
}