/* =====================================================================
   NOVA STORE — Design System
   仿 NOVA STORE 风格的现代化电商主题（白色编辑风格 / 减少 AI 感）
   ===================================================================== */

/* ============= 1. Design Tokens ============= */
:root {
    /* Color Palette — 黑白主导，强调高级感 */
    --nova-bg: #ffffff;
    --nova-bg-soft: #f7f7f5;
    --nova-bg-card: #fafafa;
    --nova-bg-dark: #0a0a0a;
    --nova-fg: #0a0a0a;
    --nova-fg-soft: #4a4a4a;
    --nova-fg-muted: #8a8a8a;
    --nova-fg-faint: #b0b0b0;
    --nova-border: #ececec;
    --nova-border-strong: #d4d4d4;
    --nova-accent: #0a0a0a;
    --nova-success: #2d7a4f;
    --nova-warning: #b88338;
    --nova-error: #c14545;
    --nova-info: #2563eb;

    /* Typography */
    --nova-font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI",
        "PingFang SC", "Microsoft YaHei", sans-serif;
    --nova-font-display: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI",
        "PingFang SC", "Microsoft YaHei", sans-serif;

    /* Spacing */
    --nova-1: 4px;
    --nova-2: 8px;
    --nova-3: 12px;
    --nova-4: 16px;
    --nova-5: 20px;
    --nova-6: 24px;
    --nova-8: 32px;
    --nova-10: 40px;
    --nova-12: 48px;
    --nova-16: 64px;
    --nova-20: 80px;
    --nova-24: 96px;
    --nova-32: 128px;

    /* Radius */
    --nova-radius-sm: 4px;
    --nova-radius: 8px;
    --nova-radius-lg: 12px;
    --nova-radius-xl: 16px;
    --nova-radius-2xl: 24px;
    --nova-radius-full: 9999px;

    /* Shadows */
    --nova-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
    --nova-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    --nova-shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.08);
    --nova-shadow-card: 0 1px 3px rgba(0, 0, 0, 0.04), 0 8px 24px rgba(0, 0, 0, 0.04);

    /* Transitions */
    --nova-ease: cubic-bezier(0.4, 0, 0.2, 1);
    --nova-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --nova-transition: 220ms var(--nova-ease);
    --nova-transition-slow: 480ms var(--nova-ease-out);

    /* Container */
    --nova-container: 1280px;
    --nova-container-narrow: 960px;
}

/* ============= 2. Reset & Base ============= */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family: var(--nova-font-sans);
    font-size: 15px;
    line-height: 1.6;
    color: var(--nova-fg);
    background: var(--nova-bg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
}

body.nova-page {
    background: var(--nova-bg);
    background-image: none !important;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

body.nova-page > .bg-content {
    background: transparent !important;
    height: auto !important;
    overflow: visible !important;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    flex: 1;
}

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

a {
    color: inherit;
    text-decoration: none;
    transition: color var(--nova-transition);
}

a:hover {
    color: var(--nova-fg);
}

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

input,
select,
textarea {
    font-family: inherit;
    font-size: inherit;
}

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

h1, h2, h3, h4, h5, h6 {
    margin: 0;
    font-weight: 600;
    line-height: 1.2;
    color: var(--nova-fg);
}

/* ============= 3. Typography ============= */
.nova-h1 {
    font-size: clamp(36px, 5vw, 64px);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.05;
}

.nova-h2 {
    font-size: clamp(28px, 3.5vw, 44px);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.1;
}

.nova-h3 {
    font-size: clamp(22px, 2.5vw, 32px);
    font-weight: 600;
    letter-spacing: -0.015em;
    line-height: 1.2;
}

.nova-h4 {
    font-size: 20px;
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: 1.3;
}

.nova-eyebrow {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--nova-fg-soft);
}

.nova-text {
    color: var(--nova-fg-soft);
    line-height: 1.7;
}

.nova-text-muted {
    color: var(--nova-fg-muted);
}

.nova-text-sm {
    font-size: 13px;
}

.nova-text-xs {
    font-size: 12px;
}

.nova-text-lg {
    font-size: 17px;
}

/* ============= 4. Layout ============= */
.nova-container {
    width: 100%;
    max-width: var(--nova-container);
    margin: 0 auto;
    padding: 0 var(--nova-6);
    min-width: 0;
    overflow-x: clip;
}

.nova-container-narrow {
    width: 100%;
    max-width: var(--nova-container-narrow);
    margin: 0 auto;
    padding: 0 var(--nova-6);
    min-width: 0;
    overflow-x: clip;
}

.nova-section {
    padding: var(--nova-20) 0;
}

.nova-section-sm {
    padding: var(--nova-12) 0;
}

.nova-section-lg {
    padding: var(--nova-24) 0;
}

.nova-grid {
    display: grid;
    gap: var(--nova-6);
}

.nova-grid-2 { grid-template-columns: repeat(2, 1fr); }
.nova-grid-3 { grid-template-columns: repeat(3, 1fr); }
.nova-grid-4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 1024px) {
    .nova-grid-4 { grid-template-columns: repeat(2, 1fr); }
    .nova-grid-3 { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
    .nova-grid-2,
    .nova-grid-3,
    .nova-grid-4 { grid-template-columns: 1fr; }
    .nova-section { padding: var(--nova-12) 0; }
}

.nova-flex { display: flex; }
.nova-flex-col { display: flex; flex-direction: column; }
.nova-items-center { align-items: center; }
.nova-justify-between { justify-content: space-between; }
.nova-justify-center { justify-content: center; }
.nova-gap-2 { gap: var(--nova-2); }
.nova-gap-3 { gap: var(--nova-3); }
.nova-gap-4 { gap: var(--nova-4); }
.nova-gap-6 { gap: var(--nova-6); }
.nova-gap-8 { gap: var(--nova-8); }

/* ============= 5. Top Bar ============= */
.nova-topbar {
    background: var(--nova-bg);
    border-bottom: 1px solid var(--nova-border);
    font-size: 13px;
    color: var(--nova-fg-soft);
}

.nova-topbar-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 36px;
}

.nova-topbar-left,
.nova-topbar-right {
    display: flex;
    align-items: center;
    gap: var(--nova-6);
}

.nova-topbar a {
    color: var(--nova-fg-soft);
    transition: color var(--nova-transition);
}

.nova-topbar a:hover {
    color: var(--nova-fg);
}

.nova-topbar-icon {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

/* ============= 6. Header / Navbar ============= */
.nova-header {
    background: var(--nova-bg);
    border-bottom: 1px solid var(--nova-border);
    position: sticky;
    top: 0;
    z-index: 100;
    backdrop-filter: saturate(180%) blur(12px);
    -webkit-backdrop-filter: saturate(180%) blur(12px);
    background: rgba(255, 255, 255, 0.92);
}

.nova-header-inner {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: var(--nova-8);
    height: 72px;
}

.nova-logo {
    display: inline-flex;
    align-items: center;
    gap: var(--nova-2);
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--nova-fg);
    white-space: nowrap;
}

.nova-logo img {
    width: 28px;
    height: 28px;
    object-fit: contain;
}

.nova-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--nova-8);
    list-style: none;
    margin: 0;
    padding: 0;
}

.nova-nav a {
    font-size: 14px;
    font-weight: 500;
    color: var(--nova-fg);
    position: relative;
    padding: 8px 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: color var(--nova-transition);
}

.nova-nav a:hover {
    color: var(--nova-fg-soft);
}

.nova-nav a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1.5px;
    background: var(--nova-fg);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform var(--nova-transition);
}

.nova-nav a:hover::after,
.nova-nav a.is-active::after {
    transform: scaleX(1);
}

/* ============= Nav Dropdown (hover) ============= */
.nova-nav-has-dropdown {
    position: relative;
}
.nova-nav-dropdown {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(8px);
    min-width: 220px;
    max-width: 320px;
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: 14px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.08), 0 2px 8px rgba(0,0,0,0.04);
    padding: 8px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
    z-index: 100;
    max-height: 70vh;
    overflow-y: auto;
}
.nova-nav-has-dropdown:hover .nova-nav-dropdown,
.nova-nav-has-dropdown:focus-within .nova-nav-dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
}
.nova-nav-dropdown::before {
    content: "";
    position: absolute;
    top: -6px;
    left: 0;
    right: 0;
    height: 6px;
}
.nova-nav-dropdown-item {
    display: flex !important;
    align-items: center;
    gap: 10px;
    padding: 9px 12px !important;
    border-radius: 8px;
    font-size: 13px !important;
    font-weight: 500;
    color: var(--nova-fg-soft) !important;
    transition: background var(--nova-transition), color var(--nova-transition);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.nova-nav-dropdown-item::after { display: none !important; }
.nova-nav-dropdown-item:hover {
    background: var(--nova-bg-soft);
    color: var(--nova-fg) !important;
}
.nova-nav-dropdown-icon {
    width: 22px;
    height: 22px;
    border-radius: 5px;
    background-size: cover !important;
    background-position: center !important;
    flex-shrink: 0;
    border: 1px solid var(--nova-border);
}
.nova-nav-dropdown-name {
    overflow: hidden;
    text-overflow: ellipsis;
}

.nova-header-actions {
    display: flex;
    align-items: center;
    gap: var(--nova-2);
    justify-self: end;
}

.nova-icon-btn {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--nova-radius-full);
    color: var(--nova-fg);
    transition: background var(--nova-transition);
    position: relative;
}

.nova-icon-btn:hover {
    background: var(--nova-bg-soft);
}

.nova-icon-btn svg {
    width: 20px;
    height: 20px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.6;
}

.nova-cart-badge {
    position: absolute;
    top: 6px;
    right: 6px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    background: var(--nova-fg);
    color: var(--nova-bg);
    border-radius: var(--nova-radius-full);
    font-size: 10px;
    font-weight: 600;
    line-height: 16px;
    text-align: center;
}

.nova-user-chip {
    display: inline-flex;
    align-items: center;
    gap: var(--nova-2);
    padding: 4px 12px 4px 4px;
    border-radius: var(--nova-radius-full);
    background: var(--nova-bg-soft);
    transition: background var(--nova-transition);
    position: relative;
}

.nova-user-chip:hover {
    background: #efefef;
}

.nova-user-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
}

.nova-user-name {
    font-size: 13px;
    font-weight: 500;
    color: var(--nova-fg);
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nova-user-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 200px;
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius-lg);
    box-shadow: var(--nova-shadow-lg);
    padding: var(--nova-2);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: all var(--nova-transition);
    z-index: 110;
}

.nova-user-chip:hover .nova-user-menu,
.nova-user-menu:hover {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.nova-user-menu a,
.nova-user-menu button {
    display: flex;
    align-items: center;
    gap: var(--nova-3);
    padding: 10px var(--nova-3);
    font-size: 14px;
    color: var(--nova-fg);
    border-radius: var(--nova-radius);
    width: 100%;
    text-align: left;
    transition: background var(--nova-transition);
}

.nova-user-menu a:hover,
.nova-user-menu button:hover {
    background: var(--nova-bg-soft);
}

.nova-user-menu hr {
    border: none;
    border-top: 1px solid var(--nova-border);
    margin: var(--nova-2) 0;
}

.nova-mobile-toggle {
    display: none;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    border-radius: var(--nova-radius);
}

.nova-mobile-toggle span {
    display: block;
    width: 20px;
    height: 1.5px;
    background: var(--nova-fg);
    position: relative;
}

.nova-mobile-toggle span::before,
.nova-mobile-toggle span::after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 1.5px;
    background: var(--nova-fg);
}

.nova-mobile-toggle span::before { top: -6px; }
.nova-mobile-toggle span::after { top: 6px; }

@media (max-width: 900px) {
    .nova-nav { display: none; }
    .nova-mobile-toggle { display: inline-flex; }
    .nova-header-inner { grid-template-columns: auto 1fr auto; }
}

@media (max-width: 640px) {
    .nova-topbar { display: none; }
    .nova-user-name { display: none; }
    .nova-header-inner { height: 60px; }
}

/* ============= 6.5 Mobile Drawer ============= */
.nova-drawer-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    opacity: 0;
    visibility: hidden;
    z-index: 199;
    transition: opacity 320ms var(--nova-ease), visibility 320ms;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}
.nova-drawer-overlay.is-open {
    opacity: 1;
    visibility: visible;
}

.nova-drawer {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: min(320px, 85vw);
    background: var(--nova-bg);
    z-index: 200;
    transform: translateX(-100%);
    transition: transform 320ms var(--nova-ease-out);
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 40px rgba(0, 0, 0, 0.12);
    overflow: hidden;
}
.nova-drawer.is-open {
    transform: translateX(0);
}

body.nova-drawer-open {
    overflow: hidden;
}

.nova-drawer-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--nova-border);
    flex-shrink: 0;
}

.nova-drawer-close {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--nova-radius);
    color: var(--nova-fg);
    transition: background var(--nova-transition);
}
.nova-drawer-close:hover {
    background: var(--nova-bg-soft);
}
.nova-drawer-close svg {
    width: 20px;
    height: 20px;
}

.nova-drawer-body {
    flex: 1;
    overflow-y: auto;
    padding: 12px 16px 32px;
    overscroll-behavior: contain;
}

.nova-drawer-user {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border-radius: var(--nova-radius-lg);
    background: var(--nova-bg-soft);
    margin-bottom: 16px;
    transition: background var(--nova-transition);
}
.nova-drawer-user:hover {
    background: #efefef;
}
.nova-drawer-user img {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}
.nova-drawer-user-info {
    flex: 1;
    min-width: 0;
}
.nova-drawer-user-name {
    font-size: 15px;
    font-weight: 600;
    color: var(--nova-fg);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.nova-drawer-user-level {
    font-size: 12px;
    color: var(--nova-fg-muted);
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 2px;
}
.nova-drawer-user-level img {
    width: 14px;
    height: 14px;
}

.nova-drawer-auth {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
}
.nova-drawer-auth .nova-btn {
    flex: 1;
    padding: 10px 16px;
    font-size: 14px;
}

.nova-drawer-section {
    margin-bottom: 8px;
}
.nova-drawer-section-title {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--nova-fg-muted);
    padding: 12px 12px 6px;
}

.nova-drawer-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 12px;
    font-size: 14px;
    font-weight: 500;
    color: var(--nova-fg-soft);
    border-radius: var(--nova-radius);
    transition: background var(--nova-transition), color var(--nova-transition);
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    cursor: pointer;
    font-family: inherit;
}
.nova-drawer-link:hover {
    background: var(--nova-bg-soft);
    color: var(--nova-fg);
}
.nova-drawer-link.is-active {
    background: var(--nova-fg);
    color: var(--nova-bg);
}
.nova-drawer-link svg {
    width: 18px;
    height: 18px;
    stroke: currentColor;
    fill: none;
    flex-shrink: 0;
}
.nova-drawer-link.logout {
    color: var(--nova-error);
}

.nova-drawer-sub {
    padding-left: 28px;
    font-size: 13px;
    font-weight: 400;
    color: var(--nova-fg-soft);
}
.nova-drawer-cat-icon {
    width: 20px;
    height: 20px;
    border-radius: 5px;
    background-size: cover !important;
    background-position: center !important;
    flex-shrink: 0;
    border: 1px solid var(--nova-border);
}

@media (min-width: 901px) {
    .nova-drawer,
    .nova-drawer-overlay {
        display: none;
    }
}

/* ============= 7. Buttons ============= */
.nova-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--nova-2);
    padding: 12px 24px;
    font-size: 14px;
    font-weight: 500;
    border-radius: var(--nova-radius);
    cursor: pointer;
    transition: all var(--nova-transition);
    text-decoration: none;
    border: 1px solid transparent;
    white-space: nowrap;
    line-height: 1.2;
}

.nova-btn-primary {
    background: var(--nova-fg);
    color: var(--nova-bg);
}

.nova-btn-primary:hover {
    background: #1f1f1f;
    color: var(--nova-bg);
    transform: translateY(-1px);
    box-shadow: var(--nova-shadow);
}

.nova-btn-secondary {
    background: transparent;
    color: var(--nova-fg);
    border-color: var(--nova-fg);
}

.nova-btn-secondary:hover {
    background: var(--nova-fg);
    color: var(--nova-bg);
}

.nova-btn-ghost {
    background: transparent;
    color: var(--nova-fg);
}

.nova-btn-ghost:hover {
    background: var(--nova-bg-soft);
    color: var(--nova-fg);
}

.nova-btn-lg {
    padding: 16px 32px;
    font-size: 15px;
}

.nova-btn-sm {
    padding: 8px 16px;
    font-size: 13px;
}

.nova-btn-block {
    width: 100%;
}

.nova-btn-arrow {
    display: inline-flex;
    align-items: center;
    gap: var(--nova-2);
    color: var(--nova-fg);
    font-size: 14px;
    font-weight: 500;
    transition: gap var(--nova-transition);
}

.nova-btn-arrow:hover {
    gap: var(--nova-3);
    color: var(--nova-fg);
}

.nova-btn-arrow svg {
    width: 16px;
    height: 16px;
    transition: transform var(--nova-transition);
}

.nova-btn-arrow:hover svg {
    transform: translateX(4px);
}

/* ============= 8. Hero ============= */
.nova-hero {
    padding: var(--nova-20) 0;
    background: var(--nova-bg);
}

.nova-hero-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--nova-12);
    align-items: center;
}

.nova-hero-content {
    max-width: 540px;
}

.nova-hero-eyebrow {
    margin-bottom: var(--nova-4);
}

.nova-hero-title {
    font-size: clamp(36px, 5vw, 60px);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.05;
    color: var(--nova-fg);
    margin-bottom: var(--nova-6);
}

.nova-hero-desc {
    font-size: 16px;
    color: var(--nova-fg-soft);
    line-height: 1.7;
    margin-bottom: var(--nova-8);
}

.nova-hero-actions {
    display: flex;
    align-items: center;
    gap: var(--nova-4);
    flex-wrap: wrap;
}

.nova-hero-image {
    position: relative;
    aspect-ratio: 1 / 1;
    border-radius: var(--nova-radius-2xl);
    overflow: hidden;
    background: var(--nova-bg-soft);
}

.nova-hero-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* ============= Hero 瀑布流滚动展示 ============= */
.nova-hero-showcase {
    position: absolute;
    inset: -8% -8%;
    transform: rotate(-6deg);
    background: linear-gradient(135deg, #fafafa 0%, #f0f0f2 100%);
    padding: 6%;
    box-sizing: border-box;
}

.nova-hero-showcase-cols {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 8px;
    height: 100%;
}

.nova-hero-col {
    overflow: hidden;
    position: relative;
}

.nova-hero-col-track {
    display: flex;
    flex-direction: column;
    gap: 8px;
    will-change: transform;
}

.nova-hero-card {
    display: block;
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05), 0 4px 12px rgba(0,0,0,0.04);
    text-decoration: none;
    transition: transform 0.2s ease;
}

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

.nova-hero-card-img {
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    display: block;
    background: var(--nova-bg-soft);
}

.nova-hero-card-body {
    padding: 7px 9px 8px;
}

.nova-hero-card-name {
    font-size: 11px;
    color: var(--nova-fg);
    font-weight: 500;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.nova-hero-card-price {
    font-size: 12px;
    color: var(--nova-fg);
    font-weight: 600;
    margin-top: 2px;
    letter-spacing: -0.01em;
}

.nova-hero-card-price small {
    font-size: 9px;
    font-weight: 500;
    margin-right: 1px;
    opacity: 0.7;
}

/* 上下渐隐遮罩 */
.nova-hero-showcase-mask {
    position: absolute;
    left: 0;
    right: 0;
    height: 14%;
    pointer-events: none;
    z-index: 2;
}

.nova-hero-showcase-mask-top {
    top: 0;
    background: linear-gradient(to bottom, #f4f4f6, rgba(244,244,246,0));
}

.nova-hero-showcase-mask-bottom {
    bottom: 0;
    background: linear-gradient(to top, #f4f4f6, rgba(244,244,246,0));
}

@media (max-width: 900px) {
    .nova-hero { padding: var(--nova-12) 0; }
    .nova-hero-inner {
        grid-template-columns: 1fr;
        gap: var(--nova-8);
    }
    .nova-hero-content { max-width: 100%; }
    .nova-hero-image { aspect-ratio: 4 / 3; }
}

/* ============= 9. Features Bar ============= */
.nova-features {
    border-top: 1px solid var(--nova-border);
    border-bottom: 1px solid var(--nova-border);
    padding: var(--nova-8) 0;
}

.nova-features-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--nova-6);
}

.nova-feature {
    display: flex;
    align-items: center;
    gap: var(--nova-3);
}

.nova-feature-icon {
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    color: var(--nova-fg);
}

.nova-feature-icon svg {
    width: 100%;
    height: 100%;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.5;
}

.nova-feature-text {
    line-height: 1.3;
}

.nova-feature-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--nova-fg);
}

.nova-feature-desc {
    font-size: 12px;
    color: var(--nova-fg-muted);
    margin-top: 2px;
}

@media (max-width: 900px) {
    .nova-features-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--nova-5);
    }
}

@media (max-width: 480px) {
    .nova-features-grid {
        grid-template-columns: 1fr;
    }
}

/* ============= 10. Section Header ============= */
.nova-section-header {
    text-align: center;
    margin-bottom: var(--nova-10);
}

.nova-section-header.left {
    text-align: left;
}

.nova-section-eyebrow {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--nova-fg-soft);
    margin-bottom: var(--nova-3);
}

.nova-section-title {
    font-size: clamp(24px, 3vw, 36px);
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--nova-fg);
    margin: 0;
}

/* ============= 11. Product Grid / Card ============= */
.nova-products {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--nova-6);
}

@media (max-width: 1024px) {
    .nova-products { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 768px) {
    .nova-products { grid-template-columns: repeat(2, 1fr); gap: var(--nova-4); }
}

@media (max-width: 480px) {
    .nova-products { grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .nova-product-badge { font-size: 10px; padding: 3px 6px; }
    .nova-product-add { width: 28px; height: 28px; }
    .nova-product-add svg { width: 13px; height: 13px; }
}

.nova-product {
    display: block;
    background: var(--nova-bg-card);
    border-radius: var(--nova-radius-xl);
    overflow: hidden;
    position: relative;
    transition: transform var(--nova-transition), box-shadow var(--nova-transition);
    text-decoration: none;
    color: inherit;
}

.nova-product:hover {
    transform: translateY(-4px);
    box-shadow: var(--nova-shadow-card);
    color: inherit;
}

.nova-product-image {
    position: relative;
    aspect-ratio: 1 / 1;
    background: #f0f0ee;
    overflow: hidden;
}

.nova-product-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--nova-transition-slow);
}

.nova-product:hover .nova-product-image img {
    transform: scale(1.05);
}

.nova-product-badge {
    position: absolute;
    top: var(--nova-3);
    left: var(--nova-3);
    background: var(--nova-bg);
    color: var(--nova-fg);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: var(--nova-radius-sm);
}

.nova-product-add {
    position: absolute;
    bottom: var(--nova-3);
    right: var(--nova-3);
    width: 36px;
    height: 36px;
    background: var(--nova-bg);
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--nova-fg);
    opacity: 0;
    transform: translateY(8px);
    transition: all var(--nova-transition);
    box-shadow: var(--nova-shadow);
}

.nova-product:hover .nova-product-add {
    opacity: 1;
    transform: translateY(0);
}

.nova-product-add:hover {
    background: var(--nova-fg);
    color: var(--nova-bg);
}

.nova-product-add svg {
    width: 16px;
    height: 16px;
}

.nova-product-info {
    padding: var(--nova-4) var(--nova-5) var(--nova-5);
}

.nova-product-name {
    font-size: 14px;
    font-weight: 500;
    color: var(--nova-fg);
    margin: 0 0 var(--nova-2);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.nova-product-price {
    font-size: 15px;
    font-weight: 600;
    color: var(--nova-fg);
    letter-spacing: -0.01em;
}

/* ============= 12. Category Chips ============= */
.nova-categories {
    display: flex;
    flex-wrap: wrap;
    gap: var(--nova-2);
    margin-bottom: var(--nova-8);
    justify-content: center;
}

.nova-chip {
    display: inline-flex;
    align-items: center;
    gap: var(--nova-2);
    padding: 8px 18px;
    background: var(--nova-bg-soft);
    border: 1px solid transparent;
    color: var(--nova-fg);
    font-size: 14px;
    font-weight: 500;
    border-radius: var(--nova-radius-full);
    cursor: pointer;
    transition: all var(--nova-transition);
    text-decoration: none;
}

.nova-chip:hover {
    background: #ebebe9;
    color: var(--nova-fg);
}

.nova-chip.is-primary {
    background: var(--nova-fg);
    color: var(--nova-bg);
}

.nova-chip.is-primary:hover {
    background: #1f1f1f;
    color: var(--nova-bg);
}

.nova-chip-icon {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
}

/* ============= 13. Promo Banner ============= */
.nova-promo {
    background: var(--nova-bg-soft);
    border-radius: var(--nova-radius-2xl);
    padding: var(--nova-12);
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: var(--nova-8);
    overflow: hidden;
    position: relative;
}

.nova-promo-eyebrow {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--nova-fg-soft);
    margin-bottom: var(--nova-3);
}

.nova-promo-title {
    font-size: clamp(24px, 3vw, 36px);
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--nova-fg);
    margin-bottom: var(--nova-3);
}

.nova-promo-desc {
    color: var(--nova-fg-soft);
    margin-bottom: var(--nova-2);
}

.nova-promo-meta {
    font-size: 12px;
    color: var(--nova-fg-muted);
    margin-bottom: var(--nova-6);
}

.nova-promo-image {
    aspect-ratio: 16 / 9;
    border-radius: var(--nova-radius-xl);
    overflow: hidden;
    background: #ececea;
}

.nova-promo-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (max-width: 768px) {
    .nova-promo {
        grid-template-columns: 1fr;
        padding: var(--nova-8);
    }
}

/* ============= 14. Card ============= */
.nova-card {
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius-xl);
    padding: var(--nova-6);
    transition: border-color var(--nova-transition);
}

.nova-card:hover {
    border-color: var(--nova-border-strong);
}

.nova-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--nova-6);
    padding-bottom: var(--nova-4);
    border-bottom: 1px solid var(--nova-border);
}

.nova-card-title {
    font-size: 18px;
    font-weight: 600;
    color: var(--nova-fg);
    margin: 0;
    display: flex;
    align-items: center;
    gap: var(--nova-2);
}

.nova-card-body {
    color: var(--nova-fg-soft);
    line-height: 1.7;
}

/* ============= 15. Notice ============= */
.nova-notice {
    background: var(--nova-bg-soft);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius-xl);
    padding: var(--nova-5) var(--nova-6);
    display: flex;
    align-items: flex-start;
    gap: var(--nova-3);
    margin-bottom: var(--nova-8);
}

.nova-notice-icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    color: var(--nova-fg);
}

.nova-notice-content {
    color: var(--nova-fg-soft);
    line-height: 1.7;
    font-size: 14px;
    flex: 1;
}

.nova-notice-title {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--nova-fg);
    margin-bottom: 4px;
}

/* ============= 16. Footer ============= */
.nova-footer {
    background: var(--nova-bg);
    border-top: 1px solid var(--nova-border);
    padding: var(--nova-16) 0 var(--nova-6);
    margin-top: auto;
}

.nova-footer-grid {
    display: grid;
    grid-template-columns: 1.4fr repeat(3, 1fr) 1.4fr;
    gap: var(--nova-8);
    margin-bottom: var(--nova-12);
}

.nova-footer-brand-desc {
    color: var(--nova-fg-soft);
    font-size: 14px;
    line-height: 1.7;
    margin: var(--nova-4) 0 var(--nova-5);
    max-width: 280px;
}

.nova-footer-socials {
    display: flex;
    gap: var(--nova-2);
}

.nova-social {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--nova-fg);
    transition: all var(--nova-transition);
}

.nova-social:hover {
    background: var(--nova-bg-soft);
    color: var(--nova-fg);
}

.nova-social svg {
    width: 18px;
    height: 18px;
    fill: currentColor;
}

.nova-footer-col h6 {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--nova-fg);
    margin: 0 0 var(--nova-4);
}

.nova-footer-col ul {
    display: flex;
    flex-direction: column;
    gap: var(--nova-3);
}

.nova-footer-col a {
    color: var(--nova-fg-soft);
    font-size: 14px;
    transition: color var(--nova-transition);
}

.nova-footer-col a:hover {
    color: var(--nova-fg);
}

.nova-newsletter {
    display: flex;
    margin-top: var(--nova-2);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius);
    overflow: hidden;
    background: var(--nova-bg);
    transition: border-color var(--nova-transition);
}

.nova-newsletter:focus-within {
    border-color: var(--nova-fg);
}

.nova-newsletter input {
    flex: 1;
    padding: 12px var(--nova-4);
    border: none;
    outline: none;
    background: transparent;
    font-size: 14px;
    color: var(--nova-fg);
}

.nova-newsletter input::placeholder {
    color: var(--nova-fg-muted);
}

.nova-newsletter button {
    padding: 0 var(--nova-4);
    background: var(--nova-fg);
    color: var(--nova-bg);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background var(--nova-transition);
}

.nova-newsletter button:hover {
    background: #1f1f1f;
}

.nova-newsletter button svg {
    width: 16px;
    height: 16px;
}

.nova-footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: var(--nova-6);
    border-top: 1px solid var(--nova-border);
    font-size: 13px;
    color: var(--nova-fg-muted);
    flex-wrap: wrap;
    gap: var(--nova-4);
}

.nova-footer-bottom-links {
    display: flex;
    gap: var(--nova-6);
}

.nova-footer-bottom-links a {
    color: var(--nova-fg-muted);
}

.nova-footer-bottom-links a:hover {
    color: var(--nova-fg);
}

@media (max-width: 1024px) {
    .nova-footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: var(--nova-8) var(--nova-6);
    }
    .nova-footer-brand { grid-column: 1 / -1; }
}

@media (max-width: 480px) {
    .nova-footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: var(--nova-6) var(--nova-4);
    }
    /* 品牌区与订阅通讯内容较多，跨满两列 */
    .nova-footer-brand,
    .nova-footer-col:last-child {
        grid-column: 1 / -1;
    }
    /* 手机端隐藏“关于”列（占位链接过多） */
    .nova-footer-grid > :nth-child(4) {
        display: none;
    }
    .nova-footer-bottom {
        flex-direction: column;
        text-align: center;
    }
    .nova-footer-bottom-links { flex-wrap: wrap; justify-content: center; }
}

/* ============= 17. Forms ============= */
.nova-input,
.nova-select,
.nova-textarea {
    width: 100%;
    padding: 12px var(--nova-4);
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius);
    color: var(--nova-fg);
    font-size: 14px;
    outline: none;
    transition: all var(--nova-transition);
    font-family: inherit;
}

.nova-input:focus,
.nova-select:focus,
.nova-textarea:focus {
    border-color: var(--nova-fg);
    box-shadow: 0 0 0 3px rgba(10, 10, 10, 0.06);
}

.nova-input::placeholder,
.nova-textarea::placeholder {
    color: var(--nova-fg-muted);
}

.nova-form-group {
    margin-bottom: var(--nova-5);
}

.nova-form-label {
    display: block;
    font-size: 13px;
    font-weight: 500;
    color: var(--nova-fg);
    margin-bottom: var(--nova-2);
}

.nova-form-help {
    font-size: 12px;
    color: var(--nova-fg-muted);
    margin-top: var(--nova-2);
}

.nova-input-group {
    display: flex;
    align-items: center;
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius);
    overflow: hidden;
    transition: border-color var(--nova-transition);
}

.nova-input-group:focus-within {
    border-color: var(--nova-fg);
}

.nova-input-group .nova-input {
    border: none;
    border-radius: 0;
    box-shadow: none;
}

.nova-input-group .nova-input:focus {
    box-shadow: none;
}

.nova-input-group-append {
    padding: 0 var(--nova-4);
    background: var(--nova-bg-soft);
    color: var(--nova-fg-soft);
    font-size: 13px;
    border-left: 1px solid var(--nova-border);
    height: 44px;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}

.nova-checkbox {
    display: inline-flex;
    align-items: center;
    gap: var(--nova-2);
    cursor: pointer;
    font-size: 14px;
    color: var(--nova-fg-soft);
}

.nova-checkbox input {
    width: 16px;
    height: 16px;
    accent-color: var(--nova-fg);
}

/* ============= 18. Auth Pages ============= */
.nova-auth {
    min-height: calc(100vh - 72px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--nova-12) var(--nova-6);
    background: var(--nova-bg);
}

.nova-auth-card {
    width: 100%;
    max-width: 440px;
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius-2xl);
    padding: var(--nova-10);
    box-shadow: var(--nova-shadow-card);
}

.nova-auth-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: var(--nova-6);
}

.nova-auth-logo img {
    width: 40px;
    height: 40px;
    object-fit: contain;
}

.nova-auth-title {
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -0.02em;
    text-align: center;
    color: var(--nova-fg);
    margin-bottom: var(--nova-2);
}

.nova-auth-subtitle {
    text-align: center;
    color: var(--nova-fg-soft);
    font-size: 14px;
    margin-bottom: var(--nova-8);
}

.nova-auth-subtitle a {
    color: var(--nova-fg);
    font-weight: 500;
    border-bottom: 1px solid var(--nova-fg);
}

.nova-auth-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: var(--nova-4) 0 var(--nova-6);
    font-size: 13px;
}

.nova-auth-actions a {
    color: var(--nova-fg);
    font-weight: 500;
}

.nova-auth-footer {
    text-align: center;
    margin-top: var(--nova-6);
    font-size: 14px;
    color: var(--nova-fg-soft);
}

.nova-auth-footer a {
    color: var(--nova-fg);
    font-weight: 500;
    border-bottom: 1px solid var(--nova-fg);
}

.nova-auth-divider {
    display: flex;
    align-items: center;
    gap: var(--nova-3);
    margin: var(--nova-6) 0;
    color: var(--nova-fg-muted);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.18em;
}

.nova-auth-divider::before,
.nova-auth-divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--nova-border);
}

/* ============= 19. Page Header ============= */
.nova-page-header {
    background: var(--nova-bg-soft);
    padding: var(--nova-12) 0 var(--nova-10);
    border-bottom: 1px solid var(--nova-border);
}

.nova-page-header h1 {
    font-size: clamp(28px, 3vw, 40px);
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--nova-fg);
    margin: 0 0 var(--nova-2);
}

.nova-page-header p {
    color: var(--nova-fg-soft);
    font-size: 15px;
    margin: 0;
}

.nova-breadcrumb {
    display: flex;
    align-items: center;
    gap: var(--nova-2);
    font-size: 13px;
    color: var(--nova-fg-muted);
    margin-bottom: var(--nova-3);
}

.nova-breadcrumb a {
    color: var(--nova-fg-soft);
}

.nova-breadcrumb a:hover {
    color: var(--nova-fg);
}

.nova-breadcrumb-sep {
    color: var(--nova-fg-faint);
}

/* ============= 20. User Center Layout ============= */
.nova-user-layout {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: var(--nova-8);
    padding: var(--nova-10) 0;
    align-items: start;
    min-width: 0;
}

@media (max-width: 900px) {
    .nova-user-layout {
        grid-template-columns: 1fr;
        gap: 0;
    }
    /* 手机端：内容卡片压缩内边距，给芯片 tab 留出更多可视宽度 */
    .nova-user-content {
        padding: 20px;
    }
    /* 手机端：侧边栏变为透明容器，仅其内的芯片条作为内容卡片顶部的 tab header */
    .nova-user-sidebar {
        background: transparent;
        border: none;
        border-radius: 0;
        padding: 0;
        position: static;
        overflow: visible;
    }
    .nova-user-profile {
        display: none;
    }
    .nova-user-nav {
        flex-direction: row;
        gap: 8px;
        overflow-x: auto;
        padding: 0 0 16px;
        margin: 0 0 20px;
        border-bottom: 1px solid var(--nova-border);
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    .nova-user-nav::-webkit-scrollbar {
        display: none;
    }
    .nova-user-nav a {
        flex-shrink: 0;
        padding: 8px 14px;
        font-size: 13px;
        background: transparent;
        border: none;
        border-radius: 9999px;
        white-space: nowrap;
        color: var(--nova-fg-muted);
        font-weight: 500;
    }
    .nova-user-nav a:hover {
        background: var(--nova-bg-soft);
        color: var(--nova-fg);
    }
    .nova-user-nav a.is-active {
        background: var(--nova-bg-soft);
        color: var(--nova-fg);
        font-weight: 600;
    }
    .nova-user-nav .nova-badge {
        margin-left: 4px;
        background: var(--nova-bg-soft);
        color: var(--nova-fg-soft);
    }
}

.nova-user-sidebar {
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius-xl);
    padding: var(--nova-4);
    position: sticky;
    top: 88px;
}

.nova-user-profile {
    padding: var(--nova-4);
    border-bottom: 1px solid var(--nova-border);
    margin-bottom: var(--nova-3);
    display: flex;
    align-items: center;
    gap: var(--nova-3);
}

.nova-user-profile img {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
}

.nova-user-profile-info {
    flex: 1;
    min-width: 0;
}

.nova-user-profile-name {
    font-size: 14px;
    font-weight: 600;
    color: var(--nova-fg);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nova-user-profile-level {
    font-size: 12px;
    color: var(--nova-fg-muted);
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 2px;
}

.nova-user-profile-level img {
    width: 14px;
    height: 14px;
}

.nova-user-nav {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.nova-user-nav a {
    display: flex;
    align-items: center;
    gap: var(--nova-3);
    padding: 10px var(--nova-3);
    font-size: 14px;
    color: var(--nova-fg-soft);
    border-radius: var(--nova-radius);
    transition: all var(--nova-transition);
    text-decoration: none;
}

.nova-user-nav a:hover {
    background: var(--nova-bg-soft);
    color: var(--nova-fg);
}

.nova-user-nav a.is-active {
    background: var(--nova-fg);
    color: var(--nova-bg);
}

.nova-user-nav svg {
    width: 18px;
    height: 18px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.6;
    flex-shrink: 0;
}

.nova-user-nav .nova-badge {
    margin-left: auto;
    background: var(--nova-bg-soft);
    color: var(--nova-fg-soft);
    font-size: 11px;
    font-weight: 500;
    padding: 2px 8px;
    border-radius: var(--nova-radius-full);
}

.nova-user-nav a.is-active .nova-badge {
    background: rgba(255, 255, 255, 0.2);
    color: var(--nova-bg);
}

.nova-user-content {
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius-xl);
    padding: var(--nova-8);
    min-height: 480px;
    min-width: 0;
}

.nova-user-content h2 {
    font-size: 22px;
    font-weight: 600;
    margin: 0 0 var(--nova-2);
    color: var(--nova-fg);
}

.nova-user-content .nova-content-desc {
    color: var(--nova-fg-soft);
    font-size: 14px;
    margin-bottom: var(--nova-6);
}

.nova-user-tabs {
    display: flex;
    gap: var(--nova-2);
    border-bottom: 1px solid var(--nova-border);
    margin-bottom: var(--nova-6);
    overflow-x: auto;
}

.nova-user-tabs a {
    padding: 10px var(--nova-4);
    color: var(--nova-fg-soft);
    font-size: 14px;
    font-weight: 500;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    transition: all var(--nova-transition);
    white-space: nowrap;
}

.nova-user-tabs a:hover {
    color: var(--nova-fg);
}

.nova-user-tabs a.is-active {
    color: var(--nova-fg);
    border-bottom-color: var(--nova-fg);
}

/* ============= 21. Stats Cards ============= */
.nova-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--nova-4);
    margin-bottom: var(--nova-6);
}

@media (max-width: 768px) {
    .nova-stats { grid-template-columns: repeat(2, 1fr); }
}

.nova-stat {
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius-lg);
    padding: var(--nova-5);
    transition: border-color var(--nova-transition);
}

.nova-stat:hover {
    border-color: var(--nova-border-strong);
}

.nova-stat-label {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--nova-fg-muted);
    margin-bottom: var(--nova-2);
}

.nova-stat-value {
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--nova-fg);
    line-height: 1.1;
}

.nova-stat-meta {
    font-size: 12px;
    color: var(--nova-fg-soft);
    margin-top: var(--nova-2);
}

/* ============= 22. Tables ============= */
.nova-table {
    width: 100%;
    border-collapse: collapse;
    background: var(--nova-bg);
}

.nova-table th {
    text-align: left;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--nova-fg-muted);
    padding: var(--nova-3) var(--nova-4);
    border-bottom: 1px solid var(--nova-border);
}

.nova-table td {
    padding: var(--nova-4);
    border-bottom: 1px solid var(--nova-border);
    color: var(--nova-fg);
    font-size: 14px;
}

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

.nova-table tr:hover td {
    background: var(--nova-bg-soft);
}

/* ============= 23. Badges & Tags ============= */
.nova-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    background: var(--nova-bg-soft);
    color: var(--nova-fg);
    font-size: 12px;
    font-weight: 500;
    border-radius: var(--nova-radius-full);
}

.nova-tag-primary {
    background: var(--nova-fg);
    color: var(--nova-bg);
}

.nova-tag-success {
    background: rgba(45, 122, 79, 0.1);
    color: var(--nova-success);
}

.nova-tag-warning {
    background: rgba(184, 131, 56, 0.1);
    color: var(--nova-warning);
}

.nova-tag-error {
    background: rgba(193, 69, 69, 0.1);
    color: var(--nova-error);
}

.nova-tag-info {
    background: rgba(37, 99, 235, 0.1);
    color: var(--nova-info);
}

/* ============= 24. Quantity Selector ============= */
.nova-qty {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius);
    overflow: hidden;
    width: fit-content;
}

.nova-qty button {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--nova-fg);
    background: var(--nova-bg);
    transition: background var(--nova-transition);
    font-size: 18px;
}

.nova-qty button:hover {
    background: var(--nova-bg-soft);
}

.nova-qty input {
    width: 60px;
    height: 40px;
    border: none;
    border-left: 1px solid var(--nova-border);
    border-right: 1px solid var(--nova-border);
    text-align: center;
    background: var(--nova-bg);
    color: var(--nova-fg);
    font-size: 14px;
    font-weight: 500;
    outline: none;
    -moz-appearance: textfield;
}

.nova-qty input::-webkit-outer-spin-button,
.nova-qty input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* ============= 25. SKU Selection ============= */
.nova-sku-group {
    margin-bottom: var(--nova-4);
}

.nova-sku-label {
    font-size: 13px;
    font-weight: 500;
    color: var(--nova-fg);
    margin-bottom: var(--nova-2);
}

.nova-sku-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--nova-2);
}

.nova-sku {
    display: inline-flex;
    align-items: center;
    gap: var(--nova-2);
    padding: 8px 16px;
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius);
    color: var(--nova-fg);
    font-size: 14px;
    cursor: pointer;
    transition: all var(--nova-transition);
}

.nova-sku:hover {
    border-color: var(--nova-fg);
}

.nova-sku.is-primary {
    background: var(--nova-fg);
    border-color: var(--nova-fg);
    color: var(--nova-bg);
}

.nova-sku-price {
    font-size: 12px;
    opacity: 0.7;
}

.nova-sku.is-primary .nova-sku-price {
    opacity: 0.85;
}

/* ============= 26. Item Detail ============= */
.nova-item-detail {
    display: grid;
    grid-template-columns: minmax(360px, 1.1fr) 1fr;
    gap: 56px;
    padding: 24px 0 0;
}

@media (max-width: 900px) {
    .nova-item-detail {
        grid-template-columns: 1fr;
        gap: 24px;
        padding: 16px 0 0;
    }
}

/* 商品详情页购买按钮行 / 分享按钮行 */
.nova-item-buy-row {
    display: flex;
    gap: 12px;
    margin-top: 12px;
    flex-wrap: wrap;
}
.nova-item-buy-row > .nova-btn {
    flex: 1;
    min-width: 180px;
}
.nova-item-share-row {
    display: flex;
    gap: 12px;
    margin-top: 12px;
}

/* 验证码组：桌面限宽 280px，窄屏自适应 */
.nova-captcha-group {
    width: 280px;
    max-width: 100%;
}

@media (max-width: 480px) {
    .nova-item-detail {
        gap: 16px;
        padding: 8px 0 0;
    }
    .nova-item-buy-row {
        flex-direction: column;
        gap: 10px;
    }
    .nova-item-buy-row > .nova-btn {
        min-width: 0;
        width: 100%;
    }
    .nova-captcha-group {
        width: 100%;
    }
    .nova-item-price {
        font-size: 28px;
    }
}

.nova-item-cover {
    aspect-ratio: 1 / 1;
    background: var(--nova-bg-soft);
    border-radius: var(--nova-radius-2xl);
    overflow: hidden;
}

.nova-item-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.nova-item-title {
    font-size: clamp(24px, 2.5vw, 32px);
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--nova-fg);
    margin-bottom: var(--nova-4);
}

.nova-item-meta {
    display: flex;
    flex-wrap: wrap;
    gap: var(--nova-2);
    margin-bottom: var(--nova-6);
}

.nova-item-price {
    font-size: 36px;
    font-weight: 700;
    letter-spacing: -0.03em;
    color: var(--nova-fg);
    margin-bottom: var(--nova-6);
}

.nova-item-price small {
    font-size: 16px;
    font-weight: 500;
    margin-right: 4px;
}

.nova-item-form {
    border-top: 1px solid var(--nova-border);
    padding-top: var(--nova-6);
}

.nova-item-actions {
    display: flex;
    gap: var(--nova-3);
    margin-top: var(--nova-8);
    flex-wrap: wrap;
}

.nova-item-detail-section {
    background: var(--nova-bg-soft);
    border-radius: var(--nova-radius-xl);
    padding: var(--nova-8);
    margin-top: var(--nova-8);
    margin-bottom: var(--nova-10);
}

.nova-item-detail-section h3 {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 var(--nova-4);
    color: var(--nova-fg);
    display: flex;
    align-items: center;
    gap: var(--nova-2);
}

.nova-item-detail-content {
    color: var(--nova-fg-soft);
    line-height: 1.8;
    font-size: 14px;
}

/* ============= 27. Order Query ============= */
.nova-query {
    padding: var(--nova-12) 0;
}

.nova-query-card {
    max-width: 640px;
    margin: 0 auto;
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius-2xl);
    padding: var(--nova-10);
    text-align: center;
}

.nova-query-title {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: var(--nova-2);
    color: var(--nova-fg);
}

.nova-query-desc {
    color: var(--nova-fg-soft);
    font-size: 14px;
    margin-bottom: var(--nova-8);
}

.nova-query-form {
    display: flex;
    gap: var(--nova-3);
    max-width: 480px;
    margin: 0 auto;
}

.nova-query-form input {
    flex: 1;
}

@media (max-width: 480px) {
    .nova-query-form {
        flex-direction: column;
    }
}

.nova-empty {
    text-align: center;
    padding: var(--nova-12) var(--nova-6);
    color: var(--nova-fg-muted);
}

.nova-empty-icon {
    width: 64px;
    height: 64px;
    margin: 0 auto var(--nova-4);
    color: var(--nova-fg-faint);
}

.nova-empty-icon svg {
    width: 100%;
    height: 100%;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.2;
}

/* ============= 28. Pay Methods ============= */
.nova-pay-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: var(--nova-3);
}

.nova-pay-item {
    display: flex;
    align-items: center;
    gap: var(--nova-3);
    padding: var(--nova-3) var(--nova-4);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius);
    cursor: pointer;
    transition: all var(--nova-transition);
    background: var(--nova-bg);
}

.nova-pay-item:hover {
    border-color: var(--nova-fg);
}

.nova-pay-item.is-primary {
    border-color: var(--nova-fg);
    background: var(--nova-bg-soft);
}

.nova-pay-item img {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.nova-pay-item span {
    font-size: 14px;
    font-weight: 500;
    color: var(--nova-fg);
}

/* ============= 29. Avatars ============= */
.nova-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.nova-avatar-lg {
    width: 96px;
    height: 96px;
    border-radius: 50%;
    object-fit: cover;
}

.nova-avatar-wrapper {
    position: relative;
    display: inline-block;
}

.nova-avatar-edit {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 32px;
    height: 32px;
    background: var(--nova-fg);
    color: var(--nova-bg);
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border: 3px solid var(--nova-bg);
    transition: background var(--nova-transition);
}

.nova-avatar-edit:hover {
    background: #1f1f1f;
}

.nova-avatar-edit svg {
    width: 14px;
    height: 14px;
    fill: currentColor;
}

/* ============= 29.5 Stepper (步进器) ============= */
.nova-stepper {
    display: flex;
    align-items: center;
    gap: var(--nova-2);
    font-size: 14px;
    color: var(--nova-fg-muted);
    margin-bottom: var(--nova-8);
    padding: var(--nova-4) 0;
    flex-wrap: wrap;
}

.nova-stepper-item {
    display: inline-flex;
    align-items: center;
    gap: var(--nova-2);
}

.nova-stepper-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--nova-bg-soft);
    color: var(--nova-fg-muted);
    font-size: 12px;
    font-weight: 600;
    transition: all var(--nova-transition);
}

.nova-stepper-item.is-active .nova-stepper-num {
    background: var(--nova-fg);
    color: var(--nova-bg);
}

.nova-stepper-item.is-active {
    color: var(--nova-fg);
    font-weight: 500;
}

.nova-stepper-sep {
    color: var(--nova-fg-faint);
    margin: 0 var(--nova-2);
}

/* ============= 29.6 Category / Listing Layout ============= */
.nova-listing {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: var(--nova-8);
    padding: var(--nova-10) 0;
}

@media (max-width: 900px) {
    .nova-listing { grid-template-columns: 1fr; gap: var(--nova-5); }
}

/* 筛选切换按钮：仅手机端显示 */
.nova-filter-toggle-btn {
    display: none;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: var(--nova-bg-soft);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius);
    font-size: 13px;
    color: var(--nova-fg);
    cursor: pointer;
    font-family: inherit;
}
.nova-filter-toggle-btn:hover {
    background: var(--nova-bg);
    border-color: var(--nova-border-strong);
}

.nova-listing-hero {
    background: var(--nova-bg-soft);
    border-radius: var(--nova-radius-2xl);
    padding: var(--nova-8);
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: var(--nova-6);
    margin-bottom: var(--nova-8);
    overflow: hidden;
}

.nova-listing-hero-image {
    aspect-ratio: 16 / 9;
    border-radius: var(--nova-radius-xl);
    overflow: hidden;
    background: #ececea;
}

.nova-listing-hero-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media (max-width: 700px) {
    .nova-listing-hero { grid-template-columns: 1fr; padding: var(--nova-6); }
}

.nova-filter {
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius-xl);
    padding: var(--nova-5);
    position: sticky;
    top: 88px;
    align-self: start;
    max-height: calc(100vh - 100px);
    overflow-y: auto;
}

/* 手机端：筛选区默认收起，点 toggle 按钮才展开 */
@media (max-width: 900px) {
    .nova-filter-toggle-btn {
        display: inline-flex;
    }
    .nova-filter {
        display: none;
        position: relative;
        top: auto;
        max-height: none;
        margin-bottom: var(--nova-4);
    }
    .nova-filter.is-open {
        display: block;
    }
}

.nova-filter-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: var(--nova-4);
    margin-bottom: var(--nova-4);
    border-bottom: 1px solid var(--nova-border);
    font-size: 14px;
    font-weight: 600;
    color: var(--nova-fg);
}

.nova-filter-group {
    border-bottom: 1px solid var(--nova-border);
    padding: var(--nova-4) 0;
}

.nova-filter-group:last-child {
    border-bottom: none;
}

.nova-filter-group-title {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--nova-fg);
    margin-bottom: var(--nova-3);
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}

.nova-filter-group-title::after {
    content: "−";
    color: var(--nova-fg-muted);
    font-size: 16px;
    line-height: 1;
}

.nova-filter-group.is-collapsed .nova-filter-group-title::after {
    content: "+";
}

.nova-filter-group.is-collapsed .nova-filter-options {
    display: none;
}

.nova-filter-options {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.nova-filter-radio {
    display: flex;
    align-items: center;
    gap: var(--nova-2);
    padding: 6px 0;
    font-size: 14px;
    color: var(--nova-fg-soft);
    cursor: pointer;
    transition: color var(--nova-transition);
}

.nova-filter-radio:hover {
    color: var(--nova-fg);
}

.nova-filter-radio input {
    width: 16px;
    height: 16px;
    accent-color: var(--nova-fg);
    cursor: pointer;
}

.nova-filter-radio-count {
    margin-left: auto;
    color: var(--nova-fg-muted);
    font-size: 12px;
}

.nova-filter-radio.is-active {
    color: var(--nova-fg);
    font-weight: 500;
}

.nova-filter-checkbox {
    display: flex;
    align-items: center;
    gap: var(--nova-2);
    padding: 6px 0;
    font-size: 14px;
    color: var(--nova-fg-soft);
    cursor: pointer;
    transition: color var(--nova-transition);
}

.nova-filter-checkbox:hover {
    color: var(--nova-fg);
}

.nova-filter-checkbox input {
    width: 16px;
    height: 16px;
    accent-color: var(--nova-fg);
    cursor: pointer;
}

.nova-filter-checkbox-count {
    margin-left: auto;
    color: var(--nova-fg-muted);
    font-size: 12px;
}

.nova-listing-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--nova-4);
    margin-bottom: var(--nova-6);
    padding: var(--nova-3) var(--nova-4);
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius-lg);
    flex-wrap: wrap;
}

.nova-listing-toolbar-left {
    display: flex;
    align-items: center;
    gap: var(--nova-3);
    font-size: 13px;
    color: var(--nova-fg-soft);
}

.nova-listing-toolbar-right {
    display: flex;
    align-items: center;
    gap: var(--nova-3);
}

.nova-select-pill {
    display: inline-flex;
    align-items: center;
    gap: var(--nova-2);
    padding: 6px 12px;
    background: var(--nova-bg-soft);
    border-radius: var(--nova-radius-full);
    font-size: 13px;
    color: var(--nova-fg);
    cursor: pointer;
    transition: background var(--nova-transition);
    border: 1px solid var(--nova-border);
}

.nova-select-pill:hover {
    background: #ebebe9;
}

.nova-select-pill select {
    appearance: none;
    background: transparent;
    border: none;
    outline: none;
    color: var(--nova-fg);
    font-size: 13px;
    font-weight: 500;
    padding: 0 var(--nova-3) 0 0;
    cursor: pointer;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%230a0a0a' stroke-width='2'><polyline points='6 9 12 15 18 9'/></svg>");
    background-repeat: no-repeat;
    background-position: right 0 center;
}

.nova-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--nova-2);
    margin-top: var(--nova-8);
}

.nova-pagination a,
.nova-pagination span {
    min-width: 36px;
    height: 36px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--nova-radius);
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    color: var(--nova-fg);
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    transition: all var(--nova-transition);
}

.nova-pagination a:hover {
    border-color: var(--nova-fg);
}

.nova-pagination .is-active {
    background: var(--nova-fg);
    color: var(--nova-bg);
    border-color: var(--nova-fg);
}

.nova-pagination .is-disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
}

/* ============= 29.7 Product Gallery ============= */
.nova-gallery {
    display: grid;
    grid-template-columns: 88px 1fr;
    gap: var(--nova-4);
}

@media (max-width: 700px) {
    .nova-gallery { grid-template-columns: 1fr; }
    .nova-gallery-thumbs { order: 2; flex-direction: row !important; overflow-x: auto; }
}

.nova-gallery-thumbs {
    display: flex;
    flex-direction: column;
    gap: var(--nova-3);
}

.nova-gallery-thumb {
    width: 88px;
    height: 88px;
    border-radius: var(--nova-radius);
    overflow: hidden;
    cursor: pointer;
    border: 2px solid transparent;
    background: var(--nova-bg-soft);
    transition: border-color var(--nova-transition);
    flex-shrink: 0;
}

.nova-gallery-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.nova-gallery-thumb.is-active {
    border-color: var(--nova-fg);
}

.nova-gallery-main {
    aspect-ratio: 1 / 1;
    background: var(--nova-bg-soft);
    border-radius: var(--nova-radius-2xl);
    overflow: hidden;
    position: relative;
}

.nova-gallery-main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity var(--nova-transition);
}

.nova-gallery-main .nova-gallery-badge {
    position: absolute;
    top: var(--nova-4);
    left: var(--nova-4);
    background: var(--nova-bg);
    color: var(--nova-fg);
    font-size: 11px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: var(--nova-radius-sm);
    letter-spacing: 0.05em;
}

/* ============= 29.8 Color Swatches ============= */
.nova-swatches {
    display: flex;
    gap: var(--nova-2);
    flex-wrap: wrap;
}

.nova-swatch {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    cursor: pointer;
    border: 2px solid var(--nova-border);
    background: #ddd;
    position: relative;
    transition: all var(--nova-transition);
    padding: 0;
    overflow: hidden;
}

.nova-swatch::after {
    content: "";
    position: absolute;
    inset: -4px;
    border-radius: 50%;
    border: 1.5px solid transparent;
    transition: border-color var(--nova-transition);
}

.nova-swatch.is-active::after,
.nova-swatch:hover::after {
    border-color: var(--nova-fg);
}

/* ============= 29.9 Tabs (商品详情页) ============= */
.nova-tabs {
    display: flex;
    gap: var(--nova-2);
    border-bottom: 1px solid var(--nova-border);
    margin-bottom: var(--nova-8);
    overflow-x: auto;
}

.nova-tab {
    padding: 12px var(--nova-4);
    color: var(--nova-fg-soft);
    font-size: 14px;
    font-weight: 500;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    cursor: pointer;
    background: none;
    border-top: none;
    border-left: none;
    border-right: none;
    transition: all var(--nova-transition);
    white-space: nowrap;
}

.nova-tab:hover {
    color: var(--nova-fg);
}

.nova-tab.is-active {
    color: var(--nova-fg);
    border-bottom-color: var(--nova-fg);
}

.nova-tab-pane {
    display: none;
}

.nova-tab-pane.is-active {
    display: block;
}

.nova-spec-table {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: var(--nova-3) var(--nova-6);
    font-size: 14px;
    max-width: 720px;
}

.nova-spec-table dt {
    color: var(--nova-fg-soft);
    padding: var(--nova-3) 0;
    border-bottom: 1px solid var(--nova-border);
}

.nova-spec-table dd {
    color: var(--nova-fg);
    margin: 0;
    padding: var(--nova-3) 0;
    border-bottom: 1px solid var(--nova-border);
}

@media (max-width: 600px) {
    .nova-spec-table { grid-template-columns: 1fr; gap: 0; }
    .nova-spec-table dt { border-bottom: none; padding-bottom: 0; }
    .nova-spec-table dd { padding-top: 0; }
}

/* ============= 29.10 Order Item Row (结算页) ============= */
.nova-order-list {
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius-xl);
    overflow: hidden;
}

.nova-order-list-header {
    padding: var(--nova-5) var(--nova-6);
    border-bottom: 1px solid var(--nova-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--nova-bg);
}

.nova-order-list-header h3 {
    font-size: 18px;
    font-weight: 600;
    margin: 0;
    color: var(--nova-fg);
}

.nova-order-row {
    display: grid;
    grid-template-columns: 96px 1fr auto auto auto;
    gap: var(--nova-5);
    align-items: center;
    padding: var(--nova-5) var(--nova-6);
    border-bottom: 1px solid var(--nova-border);
    background: var(--nova-bg);
}

.nova-order-row:last-child {
    border-bottom: none;
}

@media (max-width: 700px) {
    .nova-order-row {
        grid-template-columns: 80px 1fr;
        gap: var(--nova-3);
    }
    .nova-order-row .nova-order-info { grid-column: 2; }
    .nova-order-row .nova-order-qty,
    .nova-order-row .nova-order-price,
    .nova-order-row .nova-order-remove { grid-column: 2; }
}

.nova-order-image {
    width: 96px;
    height: 96px;
    border-radius: var(--nova-radius);
    overflow: hidden;
    background: var(--nova-bg-soft);
}

.nova-order-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.nova-order-info h4 {
    font-size: 15px;
    font-weight: 600;
    color: var(--nova-fg);
    margin: 0 0 4px;
    line-height: 1.3;
}

.nova-order-info .nova-order-meta {
    font-size: 12px;
    color: var(--nova-fg-muted);
}

.nova-order-info .nova-order-sku {
    display: inline-block;
    font-size: 11px;
    color: var(--nova-fg-muted);
    background: var(--nova-bg-soft);
    padding: 2px 8px;
    border-radius: var(--nova-radius-sm);
    margin-top: 4px;
}

.nova-order-price {
    font-size: 15px;
    font-weight: 600;
    color: var(--nova-fg);
    min-width: 80px;
    text-align: right;
}

.nova-order-remove {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--nova-fg-muted);
    transition: all var(--nova-transition);
    background: none;
    border: none;
    cursor: pointer;
}

.nova-order-remove:hover {
    background: var(--nova-bg-soft);
    color: var(--nova-fg);
}

.nova-order-remove svg {
    width: 18px;
    height: 18px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.6;
}

/* ============= 29.11 Checkout Summary ============= */
.nova-checkout-layout {
    display: grid;
    grid-template-columns: 1fr 360px;
    gap: var(--nova-8);
    padding: var(--nova-10) 0;
    align-items: start;
}

@media (max-width: 900px) {
    .nova-checkout-layout {
        grid-template-columns: 1fr;
        gap: var(--nova-6);
    }
}

.nova-checkout-card {
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius-xl);
    padding: var(--nova-6);
    margin-bottom: var(--nova-5);
}

.nova-checkout-card:last-child {
    margin-bottom: 0;
}

.nova-checkout-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--nova-5);
}

.nova-checkout-card-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--nova-fg);
    margin: 0;
}

.nova-checkout-card-aside {
    font-size: 13px;
    color: var(--nova-fg-muted);
}

.nova-checkout-card-aside a {
    color: var(--nova-fg);
    font-weight: 500;
    border-bottom: 1px solid var(--nova-fg);
}

.nova-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--nova-3);
}

.nova-form-row-3 {
    grid-template-columns: 2fr 1fr 1fr;
}

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

.nova-shipping-method {
    display: flex;
    align-items: center;
    gap: var(--nova-3);
    padding: var(--nova-4);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius);
    margin-bottom: var(--nova-3);
    cursor: pointer;
    transition: all var(--nova-transition);
    background: var(--nova-bg);
}

.nova-shipping-method:hover {
    border-color: var(--nova-fg);
}

/* ============= 38. Order Query Results ============= */
.order-results { display: block; }
.order-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* 订单卡片 */
.order-item {
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: 16px;
    overflow: hidden;
    transition: box-shadow var(--nova-transition);
}
.order-item:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.04);
}

/* 头部：状态 + 订单信息 + 金额 */
.order-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
    padding: 20px 24px;
    border-bottom: 1px solid var(--nova-border);
    background: var(--nova-bg-soft);
}
.order-left {
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1;
    min-width: 0;
}
.order-right {
    text-align: right;
    flex-shrink: 0;
}

.status-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
}
.status-badge i { font-size: 12px; }
.status-pending {
    background: rgba(255, 159, 10, 0.1);
    color: #f08c00;
}
.status-paid {
    background: rgba(7, 193, 96, 0.1);
    color: #07c160;
}
.status-shipped {
    background: rgba(0, 122, 255, 0.1);
    color: #007aff;
}
.status-waiting-shipment {
    background: rgba(88, 86, 214, 0.1);
    color: #5856d6;
}

.order-basic {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 13px;
    color: var(--nova-fg-muted);
}
.order-basic > div { line-height: 1.6; }
.order-no-text {
    color: var(--nova-fg-soft);
    font-family: ui-monospace, "SF Mono", Menlo, monospace;
    font-size: 12px;
}
.order-time-text, .payment-time-text { color: var(--nova-fg-soft); }
.payment-icon {
    width: 14px;
    height: 14px;
    vertical-align: -2px;
    margin-right: 4px;
    border-radius: 2px;
}
.payment-name { color: var(--nova-fg-soft); font-size: 12px; }

.order-amount {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
}
.amount-label {
    font-size: 11px;
    color: var(--nova-fg-muted);
    letter-spacing: 0.05em;
    text-transform: uppercase;
}
.amount-value {
    font-size: 24px;
    font-weight: 700;
    color: var(--nova-fg);
    letter-spacing: -0.02em;
    line-height: 1.1;
}
.amount-value .amount-number { font-variant-numeric: tabular-nums; }

/* 商品信息 */
.goods-section {
    display: flex;
    gap: 16px;
    padding: 20px 24px;
    border-bottom: 1px solid var(--nova-border);
}
.goods-thumb {
    flex-shrink: 0;
    width: 80px;
    height: 80px;
    border-radius: 10px;
    overflow: hidden;
    background: var(--nova-bg-soft);
    border: 1px solid var(--nova-border);
}
.goods-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.goods-details {
    flex: 1;
    min-width: 0;
}
.goods-name {
    font-size: 15px;
    font-weight: 600;
    color: var(--nova-fg);
    margin: 0 0 10px;
    line-height: 1.4;
}
.goods-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.goods-sku {
    display: inline-flex;
    align-items: center;
    padding: 3px 8px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.4;
}
.goods-sku.a-badge-success {
    background: rgba(7, 193, 96, 0.08);
    color: #07a055;
}
.goods-sku.a-badge-primary {
    background: rgba(0, 0, 0, 0.05);
    color: var(--nova-fg-soft);
}
.goods-sku.a-badge-warning {
    background: rgba(255, 159, 10, 0.1);
    color: #d97706;
}

/* 卡密内容区 */
.card-section {
    padding: 20px 24px;
    background: #fafbfc;
}
.card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 14px;
}
.card-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}
.shipment-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--nova-fg);
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.shipment-title i { color: var(--nova-fg-muted); }
.shipment-status { font-size: 12px; }
.shipment-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
}
.shipment-waiting {
    background: rgba(255, 159, 10, 0.1);
    color: #f08c00;
}
.shipment-paid {
    background: rgba(7, 193, 96, 0.1);
    color: #07c160;
}

/* 卡密显示 */
.card-display {
    padding: 14px 16px;
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: 10px;
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    font-size: 13px;
    color: var(--nova-fg);
    line-height: 1.7;
    word-break: break-all;
    white-space: pre-wrap;
    position: relative;
}

/* 密码输入区 */
.card-password-section { width: 100%; }
.password-form .input-group {
    display: flex;
    gap: 10px;
    max-width: 420px;
}
.password-form .card-password-input {
    flex: 1;
    padding: 10px 14px;
    border: 1px solid var(--nova-border);
    border-radius: 10px;
    font-size: 14px;
    color: var(--nova-fg);
    background: var(--nova-bg);
    transition: border-color var(--nova-transition);
    outline: none;
}
.password-form .card-password-input:focus {
    border-color: var(--nova-fg);
}
.password-form .view-card-btn {
    padding: 10px 18px;
    background: var(--nova-fg);
    color: var(--nova-bg);
    border: none;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: opacity var(--nova-transition);
    white-space: nowrap;
}
.password-form .view-card-btn:hover { opacity: 0.85; }
.password-form .view-card-btn i { margin-right: 4px; }

/* 加载中 */
/* 覆盖 chahuo-ring 默认青绿色三层圆环，改为 NOVA 极简三点脉冲 */
:root {
    --chahuo-ring-color: var(--nova-fg);
    --chahuo-ring-overlay: rgba(255, 255, 255, 0.72);
    --chahuo-ring-size: 8px;
    --chahuo-ring-border: 0px;
}
/* 主元素作为中间点，::before/::after 作为左右点，绝对定位横向排列 */
.chahuo-ring {
    width: var(--chahuo-ring-size) !important;
    height: var(--chahuo-ring-size) !important;
    aspect-ratio: 1 !important;
    display: block !important;
    position: relative;
    border: none !important;
    border-radius: 50% !important;
    background: var(--chahuo-ring-color);
    animation: nova-pulse 1.2s -0.2s infinite ease-in-out !important;
}
.chahuo-ring::before,
.chahuo-ring::after {
    content: "";
    grid-area: auto;
    position: absolute;
    top: 0;
    margin: 0;
    border: none;
    border-radius: 50%;
    width: var(--chahuo-ring-size);
    height: var(--chahuo-ring-size);
    background: var(--chahuo-ring-color);
}
.chahuo-ring::before {
    left: calc(var(--chahuo-ring-size) * -1.8);
    animation: nova-pulse 1.2s -0.4s infinite ease-in-out;
}
.chahuo-ring::after {
    left: calc(var(--chahuo-ring-size) * 1.8);
    animation: nova-pulse 1.2s 0s infinite ease-in-out;
}
@keyframes nova-pulse {
    0%, 80%, 100% { opacity: 0.25; transform: scale(0.8); }
    40% { opacity: 1; transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
    .chahuo-ring,
    .chahuo-ring::before,
    .chahuo-ring::after {
        animation: none !important;
        opacity: 0.6;
    }
}
.card-loading {
    padding: 20px;
    text-align: center;
}
.loading-content {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--nova-fg-muted);
    font-size: 13px;
}

/* ============== SweetAlert2 弹窗 NOVA 风格 ============== */
.swal2-popup {
    border-radius: var(--nova-radius-xl) !important;
    font-family: var(--nova-font-sans) !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12) !important;
    border: 1px solid var(--nova-border) !important;
    padding: 36px 28px 24px !important;
    width: 22em !important;
    max-width: calc(100vw - 32px) !important;
}
/* 隐藏默认大圆圈图标——极简风格不需要 */
.swal2-icon {
    display: none !important;
}
.swal2-title {
    color: var(--nova-fg) !important;
    font-weight: 600 !important;
    font-size: 17px !important;
    padding: 0 0 6px !important;
    margin: 0 0 4px !important;
    letter-spacing: -0.01em;
}
.swal2-html-container {
    color: var(--nova-fg-muted) !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    margin: 0 !important;
}
/* 按钮区：上下排列，主按钮全宽 */
.swal2-actions {
    flex-direction: column-reverse !important;
    gap: 8px !important;
    width: 100% !important;
    margin-top: 24px !important;
}
.swal2-styled.swal2-confirm,
.swal2-styled.swal2-cancel {
    width: 100% !important;
    border-radius: var(--nova-radius) !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    padding: 12px 20px !important;
    box-shadow: none !important;
    margin: 0 !important;
    transition: all 0.18s ease !important;
}
.swal2-styled.swal2-confirm {
    background-color: var(--nova-fg) !important;
    color: var(--nova-bg) !important;
}
.swal2-styled.swal2-confirm:hover {
    background-color: #1f1f1f !important;
}
.swal2-styled.swal2-cancel {
    background-color: transparent !important;
    color: var(--nova-fg-muted) !important;
    border: 1px solid var(--nova-border) !important;
}
.swal2-styled.swal2-cancel:hover {
    border-color: var(--nova-border-strong) !important;
    color: var(--nova-fg) !important;
}
.swal2-styled:focus {
    box-shadow: none !important;
}
/* 背景遮罩 */
.swal2-backdrop-show {
    background: rgba(0, 0, 0, 0.3) !important;
}

/* 响应式 */
@media (max-width: 640px) {
    .order-header {
        flex-direction: column;
        gap: 14px;
        padding: 16px 18px;
    }
    .order-right { text-align: left; }
    .order-amount { flex-direction: row; align-items: baseline; gap: 8px; }
    .goods-section { padding: 16px 18px; }
    .card-section { padding: 16px 18px; }
    .goods-thumb { width: 64px; height: 64px; }
    .password-form .input-group { flex-direction: column; max-width: 100%; }
    .password-form .view-card-btn { width: 100%; }
}

.nova-shipping-method.is-primary {
    border-color: var(--nova-fg);
    background: var(--nova-bg-soft);
}

.nova-shipping-method input {
    width: 18px;
    height: 18px;
    accent-color: var(--nova-fg);
    flex-shrink: 0;
}

.nova-shipping-method-body {
    flex: 1;
}

.nova-shipping-method-name {
    font-size: 14px;
    font-weight: 500;
    color: var(--nova-fg);
}

.nova-shipping-method-meta {
    font-size: 12px;
    color: var(--nova-fg-muted);
    margin-top: 2px;
}

.nova-shipping-method-price {
    font-size: 14px;
    font-weight: 600;
    color: var(--nova-fg);
}

.nova-shipping-method.is-free .nova-shipping-method-price {
    color: var(--nova-success);
}

.nova-discount-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--nova-3) var(--nova-4);
    background: var(--nova-bg-soft);
    border-radius: var(--nova-radius);
    cursor: pointer;
    transition: background var(--nova-transition);
    font-size: 14px;
    color: var(--nova-fg);
}

.nova-discount-row:hover {
    background: #ebebe9;
}

.nova-summary {
    background: var(--nova-bg-soft);
    border-radius: var(--nova-radius-xl);
    padding: var(--nova-6);
    position: sticky;
    top: 88px;
}

.nova-summary-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--nova-fg);
    margin: 0 0 var(--nova-4);
}

.nova-summary-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--nova-2) 0;
    font-size: 14px;
    color: var(--nova-fg-soft);
}

.nova-summary-line .nova-summary-line-value {
    color: var(--nova-fg);
    font-weight: 500;
}

.nova-summary-line .nova-summary-line-value.is-success {
    color: var(--nova-success);
}

.nova-summary-divider {
    border: none;
    border-top: 1px solid var(--nova-border);
    margin: var(--nova-4) 0;
}

.nova-summary-total {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    padding: var(--nova-2) 0;
}

.nova-summary-total-label {
    font-size: 15px;
    font-weight: 600;
    color: var(--nova-fg);
}

.nova-summary-total-value {
    font-size: 28px;
    font-weight: 700;
    color: var(--nova-fg);
    letter-spacing: -0.02em;
    line-height: 1;
}

.nova-summary-total-currency {
    font-size: 12px;
    color: var(--nova-fg-muted);
    margin-right: 4px;
    font-weight: 500;
    text-transform: uppercase;
}

.nova-trust-list {
    display: flex;
    flex-direction: column;
    gap: var(--nova-3);
    margin-top: var(--nova-6);
    padding-top: var(--nova-6);
    border-top: 1px solid var(--nova-border);
}

.nova-trust-item {
    display: flex;
    align-items: center;
    gap: var(--nova-3);
    font-size: 13px;
    color: var(--nova-fg-soft);
}

.nova-trust-item svg {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
    color: var(--nova-fg);
}

.nova-trust-item b {
    color: var(--nova-fg);
    font-weight: 500;
}

/* ============= 29.12 Feature List (商品详情) ============= */
.nova-feature-list {
    display: flex;
    flex-direction: column;
    gap: var(--nova-3);
    margin: var(--nova-4) 0 var(--nova-6);
}

.nova-feature-list-item {
    display: flex;
    align-items: center;
    gap: var(--nova-3);
    font-size: 14px;
    color: var(--nova-fg-soft);
}

.nova-feature-list-item svg {
    width: 18px;
    height: 18px;
    color: var(--nova-fg);
    flex-shrink: 0;
}

.nova-feature-list-item b {
    color: var(--nova-fg);
    font-weight: 500;
}

/* ============= 30. Utilities ============= */
.nova-text-center { text-align: center; }
.nova-text-right { text-align: right; }
.nova-mt-2 { margin-top: var(--nova-2); }
.nova-mt-3 { margin-top: var(--nova-3); }
.nova-mt-4 { margin-top: var(--nova-4); }
.nova-mt-6 { margin-top: var(--nova-6); }
.nova-mt-8 { margin-top: var(--nova-8); }
.nova-mb-2 { margin-bottom: var(--nova-2); }
.nova-mb-3 { margin-bottom: var(--nova-3); }
.nova-mb-4 { margin-bottom: var(--nova-4); }
.nova-mb-6 { margin-bottom: var(--nova-6); }
.nova-mb-8 { margin-bottom: var(--nova-8); }

.nova-hidden { display: none; }
.nova-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ============= 31. Animations ============= */
@keyframes novaFadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

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

.nova-anim {
    animation: novaFadeIn 0.6s var(--nova-ease-out) backwards;
}

.nova-anim-up {
    animation: novaFadeInUp 0.8s var(--nova-ease-out) backwards;
}

.nova-anim-d-1 { animation-delay: 0.1s; }
.nova-anim-d-2 { animation-delay: 0.2s; }
.nova-anim-d-3 { animation-delay: 0.3s; }
.nova-anim-d-4 { animation-delay: 0.4s; }

/* ============= 32. Overrides for legacy classes ============= */
.fly-header,
.fly-logo,
.fly-nav,
.fly-nav-user,
.fly-marginTop,
.fly-panel,
.fly-panel-user,
.fly-user-main,
.bg-content,
.net-loading,
.loading-view,
.loading-image,
.elem-quote,
.content-header,
.content-body,
.form-block,
.form-header,
.form-body,
.panel,
.panel-header,
.panel-body,
.panel-title,
.chip-list,
.chip,
.chip-icon,
.sku-list,
.sku,
.acg-card,
.acg-cover,
.item-cover,
.badge-soft,
.badge-money,
.price,
.item-message,
.item-detail,
.order-list,
.order-results,
.no-results,
.loading-state,
.optional-card,
.cash-pay,
.qty-group,
.snap-up,
.wx_qrcode,
.wx_qrcode_temp,
.layui-card,
.layui-card-header,
.layui-card-body,
.layui-container,
.layui-form,
.layui-input,
.layui-select,
.layui-row,
.layui-col-md*,
.layui-btn,
.layui-btn-pink,
.layui-table,
.layui-tab,
.layui-tab-brief,
.layui-tab-item,
.layui-badge,
.layui-icon,
.elem-tips,
.layui-panel,
.layui-bg-green,
.layui-bg-blue,
.layui-bg-orange,
.more-table,
.navbar,
.navbar-brand,
.navbar-nav,
.nav-item,
.nav-link,
.nav-icon,
.navbar-collapse,
.navbar-toggler,
.search-input,
.user-info-box,
.user-login-box,
.dropdown,
.dropdown-menu,
.dropdown-item,
.dropdown-toggle,
.input-group,
.input-group-text,
.form-control,
.form-select,
.form-check,
.form-check-input,
.form-check-label,
.form-check-inline,
.form-label,
.text-success,
.text-danger,
.text-muted,
.text-dark,
.btn,
.btn-primary,
.btn-secondary,
.btn-link,
.btn-sm,
.btn-block,
.br-12,
.acg-badge,
.acg-badge-light-success,
.acg-badge-light-primary,
.a-badge,
.a-badge-success,
.a-badge-danger,
.a-badge-primary,
.row,
.col,
.vstack,
.hstack,
.gap-3,
.d-flex,
.d-none,
.d-lg-flex,
.text-start,
.text-end,
.text-decoration-none,
.fw-bold,
.me-1,
.me-2,
.me-3,
.me-auto,
.mb-1,
.mb-2,
.mb-3,
.mb-lg-0,
.ms-2,
.cropper,
.elem-quote,
.bg-content {
    all: revert;
}

/* 兼容 Bootstrap/老式 form-control 类的视觉统一 */
.nova-user-content .form-control,
.nova-user-content .layui-input,
.nova-user-content input[type="text"]:not(.layui-input):not(.nova-input),
.nova-user-content input[type="email"]:not(.layui-input):not(.nova-input),
.nova-user-content input[type="password"]:not(.layui-input):not(.nova-input),
.nova-user-content input[type="number"]:not(.layui-input):not(.nova-input),
.nova-user-content select:not(.nova-input),
.nova-user-content textarea {
    width: 100%;
    padding: 12px 16px;
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: var(--nova-radius);
    color: var(--nova-fg);
    font-size: 14px;
    outline: none;
    transition: all var(--nova-transition);
    font-family: inherit;
    margin-bottom: 16px;
}

.nova-user-content .form-control:focus,
.nova-user-content .layui-input:focus,
.nova-user-content input:focus,
.nova-user-content select:focus,
.nova-user-content textarea:focus {
    border-color: var(--nova-fg);
    box-shadow: 0 0 0 3px rgba(10, 10, 10, 0.06);
}

.nova-user-content .form-label {
    display: block;
    font-size: 13px;
    font-weight: 500;
    color: var(--nova-fg);
    margin-bottom: 8px;
}

/* Hide the loading spinner overlay by default; show only when active */
.net-loading {
    position: fixed;
    inset: 0;
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(8px);
    z-index: 9999;
    display: none;
}

.net-loading.is-active {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ============== 优惠活动页 ============== */

/* ----- Hero 区 ----- */
.nova-promo-hero {
    position: relative;
    margin-top: 24px;
    background: linear-gradient(135deg, #0a0a0c 0%, #1d1d1f 50%, #2d2d30 100%);
    border-radius: 28px;
    overflow: hidden;
    color: #fff;
}
.nova-promo-hero-bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}
.nova-grid { position: absolute; inset: 0; width: 100%; height: 100%; }
.nova-blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.5;
}
.nova-blob-1 {
    top: -100px;
    left: -100px;
    width: 360px;
    height: 360px;
    background: radial-gradient(circle, #5856d6 0%, transparent 70%);
    animation: blob-float 12s ease-in-out infinite;
}
.nova-blob-2 {
    top: 30%;
    right: -80px;
    width: 320px;
    height: 320px;
    background: radial-gradient(circle, #ff2d55 0%, transparent 70%);
    opacity: 0.35;
    animation: blob-float 15s ease-in-out infinite 3s;
}
.nova-blob-3 {
    bottom: -100px;
    left: 30%;
    width: 380px;
    height: 380px;
    background: radial-gradient(circle, #007aff 0%, transparent 70%);
    opacity: 0.3;
    animation: blob-float 18s ease-in-out infinite 6s;
}
@keyframes blob-float {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33% { transform: translate(40px, -30px) scale(1.1); }
    66% { transform: translate(-30px, 40px) scale(0.95); }
}

.nova-promo-hero-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1.3fr 1fr;
    gap: 32px;
    align-items: center;
    padding: 64px 56px;
    min-height: 420px;
}

.nova-promo-tag-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    background: rgba(255,255,255,0.1);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 500;
    color: rgba(255,255,255,0.9);
    margin-bottom: 24px;
}
.nova-promo-tag-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    background: #ff2d55;
    border-radius: 50%;
    box-shadow: 0 0 12px #ff2d55;
    animation: pulse-dot 1.6s ease-in-out infinite;
}
@keyframes pulse-dot {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.6; transform: scale(0.85); }
}

.nova-promo-title {
    font-size: clamp(40px, 5.5vw, 64px);
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1.05;
    margin: 0 0 18px;
    color: #fff;
    background: linear-gradient(180deg, #ffffff 0%, rgba(255,255,255,0.7) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.nova-promo-desc {
    font-size: 16px;
    line-height: 1.7;
    color: rgba(255,255,255,0.7);
    margin: 0 0 36px;
    max-width: 480px;
}

/* 倒计时 */
.nova-promo-countdown {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.nova-promo-countdown-label {
    font-size: 12px;
    color: rgba(255,255,255,0.6);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 500;
}
.nova-promo-countdown-blocks {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}
.nova-cd-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}
.nova-cd-num {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    background: rgba(255,255,255,0.08);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 14px;
    font-size: 28px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: #fff;
    box-shadow: 0 8px 24px rgba(0,0,0,0.3);
}
.nova-cd-label {
    font-size: 10px;
    color: rgba(255,255,255,0.5);
    letter-spacing: 0.1em;
    font-weight: 600;
}
.nova-cd-sep {
    font-size: 28px;
    font-weight: 700;
    color: rgba(255,255,255,0.3);
    padding-bottom: 20px;
    animation: blink 1s steps(2) infinite;
}
@keyframes blink {
    50% { opacity: 0.3; }
}

/* Hero 右侧视觉 */
.nova-promo-hero-visual {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    min-height: 360px;
}
.nova-promo-circle {
    position: relative;
    width: 320px;
    height: 320px;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: circle-rotate 20s linear infinite;
}
.nova-promo-circle-svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.nova-promo-circle-text {
    font-size: 14px;
    font-weight: 600;
    fill: rgba(255,255,255,0.4);
    letter-spacing: 0.15em;
    text-transform: uppercase;
}
.nova-promo-circle-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    text-align: center;
    animation: circle-rotate-reverse 20s linear infinite;
}
.nova-promo-circle-up {
    font-size: 13px;
    color: rgba(255,255,255,0.6);
    letter-spacing: 0.2em;
    font-weight: 600;
}
.nova-promo-circle-num {
    font-size: 88px;
    font-weight: 800;
    line-height: 1;
    color: #fff;
    letter-spacing: -0.04em;
}
.nova-promo-circle-num small {
    font-size: 36px;
    color: #ff9500;
}
.nova-promo-circle-off {
    font-size: 16px;
    color: rgba(255,255,255,0.8);
    letter-spacing: 0.3em;
    font-weight: 700;
}
@keyframes circle-rotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
@keyframes circle-rotate-reverse {
    from { transform: rotate(0deg); }
    to { transform: rotate(-360deg); }
}

/* 浮动小卡 */
.nova-promo-floating-card {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: rgba(255,255,255,0.95);
    backdrop-filter: blur(20px);
    border-radius: 14px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.15);
    color: #1d1d1f;
    animation: float-card 4s ease-in-out infinite;
}
.nova-promo-floating-card svg {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
}
.nova-promo-floating-card b {
    display: block;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
}
.nova-promo-floating-card span {
    font-size: 10px;
    color: #86868b;
}
.nova-promo-fc-1 {
    top: 20px;
    left: -20px;
    animation-delay: 0s;
}
.nova-promo-fc-2 {
    bottom: 30px;
    right: -10px;
    animation-delay: 2s;
}

/* ============== Toastr 提示框美化（NOVA 风格） ============== */
#toast-container {
    top: 24px !important;
    right: 24px !important;
}

#toast-container > div {
    position: relative;
    overflow: hidden;
    margin: 0 0 12px;
    padding: 16px 20px 16px 56px;
    width: 340px;
    max-width: calc(100vw - 48px);
    border-radius: var(--nova-radius-lg) !important;
    background: #ffffff !important;
    background-image: none !important;
    box-shadow: var(--nova-shadow-lg), 0 0 0 1px rgba(0, 0, 0, 0.04) !important;
    color: var(--nova-fg) !important;
    opacity: 1 !important;
    filter: none !important;
    font-family: var(--nova-font-sans);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    border-left: 4px solid var(--nova-fg-muted);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease;
    animation: nova-toast-in 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

#toast-container > div::before {
    content: "";
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    width: 22px;
    height: 22px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

#toast-container > :hover {
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.12), 0 0 0 1px rgba(0, 0, 0, 0.06) !important;
    opacity: 1 !important;
    cursor: default;
    transform: translateY(-1px);
}

/* 成功 */
#toast-container > .toast-success {
    border-left-color: var(--nova-success);
}
#toast-container > .toast-success::before {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232d7a4f' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/><polyline points='22 4 12 14.01 9 11.01'/></svg>");
}

/* 错误 */
#toast-container > .toast-error {
    border-left-color: var(--nova-error);
}
#toast-container > .toast-error::before {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c14545' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><line x1='15' y1='9' x2='9' y2='15'/><line x1='9' y1='9' x2='15' y2='15'/></svg>");
}

/* 警告 */
#toast-container > .toast-warning {
    border-left-color: var(--nova-warning);
}
#toast-container > .toast-warning::before {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b88338' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'/><line x1='12' y1='9' x2='12' y2='13'/><line x1='12' y1='17' x2='12.01' y2='17'/></svg>");
}

/* 信息 */
#toast-container > .toast-info {
    border-left-color: var(--nova-info);
}
#toast-container > .toast-info::before {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><circle cx='12' cy='12' r='10'/><line x1='12' y1='16' x2='12' y2='12'/><line x1='12' y1='8' x2='12.01' y2='8'/></svg>");
}

#toast-container .toast-title {
    font-weight: 700;
    color: var(--nova-fg);
    font-size: 14px;
}

#toast-container .toast-message {
    color: var(--nova-fg-soft);
    font-size: 13px;
    font-weight: 400;
    margin-top: 2px;
}

#toast-container .toast-close-button {
    color: var(--nova-fg-muted);
    text-shadow: none;
    opacity: 0.6;
    font-size: 18px;
    font-weight: 400;
    right: -0.2em;
    top: 0;
    position: absolute;
    padding: 8px;
}
#toast-container .toast-close-button:hover {
    color: var(--nova-fg);
    opacity: 1;
}

#toast-container .toast-progress {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 2px;
    background-color: currentColor;
    opacity: 0.3;
    border-radius: 0;
}

@keyframes nova-toast-in {
    from {
        opacity: 0;
        transform: translateX(40px) scale(0.96);
    }
    to {
        opacity: 1;
        transform: translateX(0) scale(1);
    }
}

/* ============== Bootstrap-Table NOVA 风格覆盖 ============== */
/* 表格容器 */
.bootstrap-table .fixed-table-toolbar {
    margin-bottom: 16px;
}

/* 搜索表单卡片 */
.bootstrap-table .fixed-table-toolbar .search input,
.bootstrap-table .fixed-table-toolbar .search select,
.fixed-table-toolbar .form-control,
.fixed-table-toolbar input[type="text"],
.fixed-table-toolbar input[type="search"],
.fixed-table-toolbar select {
    border: 1px solid var(--nova-border) !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
    font-size: 13px !important;
    color: var(--nova-fg) !important;
    background-color: #fff !important;
    box-shadow: none !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    height: 38px;
}
.bootstrap-table .fixed-table-toolbar .search input:focus,
.bootstrap-table .fixed-table-toolbar .search select:focus,
.fixed-table-toolbar .form-control:focus,
.fixed-table-toolbar input[type="text"]:focus,
.fixed-table-toolbar input[type="search"]:focus,
.fixed-table-toolbar select:focus {
    border-color: var(--nova-fg) !important;
    box-shadow: 0 0 0 3px rgba(10, 10, 10, 0.06) !important;
    outline: none !important;
}

/* 搜索按钮（蓝色 → 黑色） */
.fixed-table-toolbar .btn,
.fixed-table-toolbar .btn-primary,
.bootstrap-table .fixed-table-toolbar .search button {
    background-color: var(--nova-fg) !important;
    border-color: var(--nova-fg) !important;
    color: #fff !important;
    border-radius: 8px !important;
    padding: 8px 16px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    transition: opacity 0.2s ease;
}
.fixed-table-toolbar .btn:hover,
.fixed-table-toolbar .btn-primary:hover,
.bootstrap-table .fixed-table-toolbar .search button:hover {
    opacity: 0.85;
    background-color: var(--nova-fg) !important;
    border-color: var(--nova-fg) !important;
}

/* 次级按钮（重置等） */
.fixed-table-toolbar .btn-secondary,
.fixed-table-toolbar .btn-default {
    background-color: #fff !important;
    border-color: var(--nova-border) !important;
    color: var(--nova-fg-soft) !important;
}
.fixed-table-toolbar .btn-secondary:hover,
.fixed-table-toolbar .btn-default:hover {
    background-color: var(--nova-bg-soft) !important;
    color: var(--nova-fg) !important;
}

/* 表格主体 */
.bootstrap-table .table {
    border: none !important;
    color: var(--nova-fg);
    margin-bottom: 0 !important;
}

.bootstrap-table .table thead th {
    background-color: var(--nova-bg-soft) !important;
    color: var(--nova-fg-soft) !important;
    font-weight: 600 !important;
    font-size: 12px !important;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-bottom: 1px solid var(--nova-border) !important;
    border-top: none !important;
}

.bootstrap-table .table thead th .th-inner {
    padding: 10px 12px !important;
}

.bootstrap-table .table tbody td {
    padding: 10px 12px !important;
    border-top: 1px solid var(--nova-border) !important;
    color: var(--nova-fg) !important;
    font-size: 13px;
    vertical-align: middle !important;
}

.bootstrap-table .table tbody tr:hover {
    background-color: var(--nova-bg-soft) !important;
}

/* 排序图标颜色 */
.bootstrap-table .table thead th.sortable .sortable-icon {
    color: var(--nova-fg-muted) !important;
    opacity: 0.5;
}
.bootstrap-table .table thead th.sortable.asc .sortable-icon,
.bootstrap-table .table thead th.sortable.desc .sortable-icon {
    opacity: 1;
    color: var(--nova-fg) !important;
}

/* 分页 */
.bootstrap-table .fixed-table-pagination {
    padding: 16px;
    border-top: 1px solid var(--nova-border);
    background: #fff;
}

.bootstrap-table .fixed-table-pagination .pagination {
    margin: 0 !important;
    gap: 4px;
}

.bootstrap-table .fixed-table-pagination .page-item .page-link {
    color: var(--nova-fg-soft) !important;
    background-color: #fff !important;
    border: 1px solid var(--nova-border) !important;
    border-radius: 6px !important;
    padding: 6px 12px !important;
    font-size: 13px !important;
    box-shadow: none !important;
    transition: all 0.2s ease;
}

.bootstrap-table .fixed-table-pagination .page-item .page-link:hover {
    color: var(--nova-fg) !important;
    background-color: var(--nova-bg-soft) !important;
    border-color: var(--nova-border) !important;
}

.bootstrap-table .fixed-table-pagination .page-item.active .page-link {
    background-color: var(--nova-fg) !important;
    border-color: var(--nova-fg) !important;
    color: #fff !important;
}

.bootstrap-table .fixed-table-pagination .page-item.disabled .page-link {
    color: var(--nova-fg-muted) !important;
    background-color: #fff !important;
    border-color: var(--nova-border) !important;
    opacity: 0.5;
}

/* 分页信息文字 */
.bootstrap-table .fixed-table-pagination .pagination-detail .page-list .btn,
.bootstrap-table .fixed-table-pagination .pagination-detail .page-info {
    color: var(--nova-fg-soft) !important;
    font-size: 13px;
}

.bootstrap-table .fixed-table-pagination .pagination-detail .page-list .btn {
    background-color: #fff !important;
    border: 1px solid var(--nova-border) !important;
    border-radius: 6px !important;
    color: var(--nova-fg) !important;
}

/* 卡片视图（移动端） */
.bootstrap-table .card-view {
    border-top: 1px solid var(--nova-border) !important;
    padding: 12px 16px !important;
}
.bootstrap-table .card-view .card-view-title {
    color: var(--nova-fg-muted) !important;
    font-weight: 500 !important;
    font-size: 12px !important;
}
.bootstrap-table .card-view .card-view-value {
    color: var(--nova-fg) !important;
}

/* 下拉菜单 */
.bootstrap-table .dropdown-menu {
    border: 1px solid var(--nova-border) !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
    padding: 4px !important;
}
.bootstrap-table .dropdown-item {
    color: var(--nova-fg) !important;
    font-size: 13px !important;
    padding: 8px 12px !important;
    border-radius: 4px;
}
.bootstrap-table .dropdown-item:hover,
.bootstrap-table .dropdown-item.active {
    background-color: var(--nova-bg-soft) !important;
    color: var(--nova-fg) !important;
}

/* 金额颜色（红色支出/绿色收入/黑色默认） */
.bootstrap-table .text-red { color: #c14545 !important; }
.bootstrap-table .text-green { color: #2d7a4f !important; }
.bootstrap-table .text-primary { color: var(--nova-fg) !important; }

/* badge 颜色统一为灰色系 */
.bootstrap-table .badge,
.bootstrap-table .a-badge-info {
    background-color: var(--nova-bg-soft) !important;
    color: var(--nova-fg-soft) !important;
    border: 1px solid var(--nova-border) !important;
    font-weight: 500 !important;
    font-size: 12px !important;
    padding: 3px 8px !important;
    border-radius: 6px !important;
}

/* 搜索区容器（layui form） */
.bootstrap-table .fixed-table-toolbar .columns-search,
.bootstrap-table .fixed-table-toolbar .search {
    margin-bottom: 8px;
}

/* 搜索栏整体布局 */
.bootstrap-table .fixed-table-toolbar::after {
    content: "";
    display: table;
    clear: both;
}

/* 无数据提示 */
.bootstrap-table .no-records-found td {
    text-align: center !important;
    color: var(--nova-fg-muted) !important;
    padding: 40px 16px !important;
    font-size: 13px;
}

/* 表格加载遮罩 */
.bootstrap-table .fixed-table-container .fixed-table-loading {
    background-color: rgba(255, 255, 255, 0.85) !important;
    color: var(--nova-fg-muted) !important;
}

/* layui 日期选择器同步 */
.layui-laydate {
    border-radius: 12px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
    border: 1px solid var(--nova-border) !important;
}
.layui-laydate-header,
.layui-laydate-footer {
    background-color: var(--nova-bg-soft);
}
.layui-laydate .layui-this {
    background-color: var(--nova-fg) !important;
}
.layui-laydate-btns-confirm {
    background-color: var(--nova-fg) !important;
    border-color: var(--nova-fg) !important;
    color: #fff !important;
}

/* ============== Layui 组件 NOVA 风格覆盖 ============== */
/* 搜索栏容器（去除渐变和阴影） */
.table-search {
    background: var(--nova-bg-soft) !important;
    background-image: none !important;
    box-shadow: none !important;
    border: 1px solid var(--nova-border) !important;
    border-radius: 12px !important;
    padding: 12px 16px !important;
}

/* 搜索按钮（layui-btn-primary 青绿色 → 黑色） */
.table-search .layui-btn-primary,
.query-button.layui-btn-primary {
    background-color: var(--nova-fg) !important;
    border-color: var(--nova-fg) !important;
    color: #fff !important;
    border-radius: 8px !important;
    height: 38px !important;
    line-height: 38px !important;
    padding: 0 16px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    transition: opacity 0.2s ease;
}
.table-search .layui-btn-primary:hover,
.query-button.layui-btn-primary:hover {
    opacity: 0.85;
    background-color: var(--nova-fg) !important;
    border-color: var(--nova-fg) !important;
    color: #fff !important;
}

/* layui 表单输入框 */
.table-search .layui-input,
.table-search input[type="text"],
.table-search select,
.table-search .layui-form-select .layui-input {
    border: 1px solid var(--nova-border) !important;
    border-radius: 8px !important;
    height: 38px !important;
    line-height: 38px !important;
    color: var(--nova-fg) !important;
    background-color: #fff !important;
    font-size: 13px !important;
    box-shadow: none !important;
}
.table-search .layui-input:focus,
.table-search input[type="text"]:focus {
    border-color: var(--nova-fg) !important;
    box-shadow: 0 0 0 3px rgba(10, 10, 10, 0.06) !important;
}

/* layui 下拉选择 */
.layui-form-select .layui-form-select dl {
    border: 1px solid var(--nova-border) !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
}
.layui-form-select dl dd.layui-this {
    background-color: var(--nova-bg-soft) !important;
    color: var(--nova-fg) !important;
}

/* ============== global_2.css 渐变覆盖 ============== */
/* 禁用 global_2.css 里所有花哨渐变背景 */
[class*="fly-"],
.fly-case-btn,
.fly-detail-info {
    background: transparent !important;
    background-image: none !important;
}

/* 按钮：去除 layui 青绿色，统一黑色 */
.layui-btn:not(.layui-btn-primary):not(.layui-btn-danger):not(.layui-btn-warm) {
    background-color: var(--nova-fg) !important;
    border-color: var(--nova-fg) !important;
    color: #fff !important;
    border-radius: 8px !important;
}
.layui-btn:not(.layui-btn-primary):not(.layui-btn-danger):not(.layui-btn-warm):hover {
    opacity: 0.85;
    background-color: var(--nova-fg) !important;
}

/* layui 分页按钮 */
.layui-laypage a,
.layui-laypage span {
    border: 1px solid var(--nova-border) !important;
    color: var(--nova-fg-soft) !important;
    background-color: #fff !important;
    border-radius: 6px !important;
}
.layui-laypage .layui-laypage-curr .layui-laypage-em {
    background-color: var(--nova-fg) !important;
    color: #fff !important;
}
.layui-laypage a:hover {
    color: var(--nova-fg) !important;
    background-color: var(--nova-bg-soft) !important;
}

/* select2 下拉框 */
.select2-container--default .select2-selection--single {
    border: 1px solid var(--nova-border) !important;
    border-radius: 8px !important;
    height: 38px !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--nova-fg) !important;
    line-height: 36px !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--nova-bg-soft) !important;
    color: var(--nova-fg) !important;
}
.select2-dropdown {
    border: 1px solid var(--nova-border) !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08) !important;
}

@media (max-width: 480px) {
    #toast-container {
        top: 16px !important;
        right: 16px !important;
        left: 16px !important;
    }
    #toast-container > div {
        width: 100% !important;
        padding: 14px 16px 14px 50px;
    }
    #toast-container > div::before {
        left: 16px;
        width: 20px;
        height: 20px;
    }
}
@keyframes float-card {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-12px); }
}

/* ----- 数据条 ----- */
.nova-promo-stats {
    display: flex;
    align-items: center;
    justify-content: space-around;
    margin-top: 32px;
    padding: 32px 40px;
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: 20px;
}
.nova-promo-stat {
    text-align: center;
    flex: 1;
}
.nova-promo-stat-num {
    font-size: 36px;
    font-weight: 800;
    color: var(--nova-fg);
    letter-spacing: -0.03em;
    line-height: 1;
    margin-bottom: 6px;
    font-variant-numeric: tabular-nums;
}
.nova-promo-stat-num small {
    font-size: 16px;
    color: var(--nova-fg-muted);
    font-weight: 600;
    margin-left: 2px;
}
.nova-promo-stat-label {
    font-size: 13px;
    color: var(--nova-fg-muted);
    font-weight: 500;
}
.nova-promo-stat-divider {
    width: 1px;
    height: 36px;
    background: var(--nova-border);
}

/* ----- 分类筛选 chips ----- */
.nova-promo-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 48px;
    margin-bottom: 24px;
}
.nova-promo-chip {
    padding: 8px 18px;
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: 999px;
    font-size: 13px;
    font-weight: 500;
    color: var(--nova-fg-soft);
    cursor: pointer;
    transition: all var(--nova-transition);
    font-family: inherit;
}
.nova-promo-chip:hover {
    border-color: var(--nova-fg);
    color: var(--nova-fg);
}
.nova-promo-chip.is-active {
    background: var(--nova-fg);
    border-color: var(--nova-fg);
    color: var(--nova-bg);
}

/* ----- 排序栏 ----- */
.nova-promo-toolbar {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 28px;
    gap: 16px;
    padding: 24px 0 0;
    border-top: 1px solid var(--nova-border);
}
.nova-promo-toolbar-eyebrow {
    display: block;
    font-size: 12px;
    color: var(--nova-fg-muted);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 600;
    margin-bottom: 6px;
}
.nova-promo-toolbar h2 {
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--nova-fg);
    margin: 0;
}
.nova-promo-sort {
    display: flex;
    gap: 4px;
    padding: 4px;
    background: var(--nova-bg-soft);
    border-radius: 12px;
    border: 1px solid var(--nova-border);
}
.nova-promo-sort-btn {
    padding: 8px 16px;
    background: transparent;
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    color: var(--nova-fg-soft);
    cursor: pointer;
    transition: all var(--nova-transition);
    font-family: inherit;
}
.nova-promo-sort-btn:hover { color: var(--nova-fg); }
.nova-promo-sort-btn.is-active {
    background: var(--nova-bg);
    color: var(--nova-fg);
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

/* ----- 商品网格 ----- */
.nova-promo-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.nova-promo-product {
    display: flex;
    flex-direction: column;
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: 18px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: all var(--nova-transition);
    position: relative;
}
.nova-promo-product:hover {
    border-color: var(--nova-fg);
    transform: translateY(-4px);
    box-shadow: 0 16px 48px rgba(0,0,0,0.08);
}
.nova-promo-product-cover {
    position: relative;
    aspect-ratio: 1;
    background: var(--nova-bg-soft);
    overflow: hidden;
}
.nova-promo-product-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}
.nova-promo-product:hover .nova-promo-product-cover img {
    transform: scale(1.06);
}
.nova-promo-product-empty {
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #f5f5f7, #e8e8ed);
}
.nova-promo-discount-flag {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 2;
    padding: 4px 10px;
    background: linear-gradient(135deg, #ff2d55, #ff9500);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(255,45,85,0.3);
    letter-spacing: 0.02em;
}
.nova-promo-product-soldout {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.5);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
}
.nova-promo-product-body {
    padding: 16px 18px 18px;
}
.nova-promo-product-name {
    font-size: 14px;
    font-weight: 500;
    color: var(--nova-fg);
    line-height: 1.4;
    margin: 0 0 12px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.8em;
}
.nova-promo-product-price-row {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 10px;
}
.nova-promo-product-price {
    font-size: 22px;
    font-weight: 700;
    color: #ff2d55;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
}
.nova-promo-product-price small {
    font-size: 13px;
    font-weight: 600;
    margin-right: 1px;
}
.nova-promo-product-original {
    font-size: 12px;
    color: var(--nova-fg-muted);
    text-decoration: line-through;
    font-variant-numeric: tabular-nums;
}
.nova-promo-product-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 10px;
    border-top: 1px solid var(--nova-border);
    font-size: 11px;
    color: var(--nova-fg-muted);
}
.nova-promo-product-sold {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.nova-promo-product-sold svg { color: #07c160; }
.nova-promo-product-stock { font-weight: 600; }

/* ----- 优惠特性 ----- */
.nova-promo-feature-row {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: 64px;
}
.nova-promo-feature {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 20px;
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: 16px;
    transition: all var(--nova-transition);
}
.nova-promo-feature:hover {
    border-color: var(--nova-border-strong);
    transform: translateY(-2px);
}
.nova-promo-feature-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    flex-shrink: 0;
}
.nova-promo-feature-icon svg {
    width: 22px;
    height: 22px;
}
.nova-promo-feature b {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--nova-fg);
    margin-bottom: 2px;
}
.nova-promo-feature span {
    font-size: 12px;
    color: var(--nova-fg-muted);
}

/* ----- 四大保障 ----- */
.nova-promo-guarantee {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: 64px;
    padding: 32px 24px;
    background: var(--nova-bg-soft);
    border: 1px solid var(--nova-border);
    border-radius: 20px;
}
.nova-promo-guarantee-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 16px;
    position: relative;
}
.nova-promo-guarantee-item:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 20%;
    height: 60%;
    width: 1px;
    background: var(--nova-border);
}
.nova-promo-guarantee-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: 14px;
    margin-bottom: 14px;
    color: var(--nova-fg);
    transition: all var(--nova-transition);
}
.nova-promo-guarantee-icon svg {
    width: 24px;
    height: 24px;
}
.nova-promo-guarantee-item:hover .nova-promo-guarantee-icon {
    background: var(--nova-fg);
    color: var(--nova-bg);
    border-color: var(--nova-fg);
    transform: translateY(-2px);
}
.nova-promo-guarantee-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--nova-fg);
    margin-bottom: 4px;
}
.nova-promo-guarantee-desc {
    font-size: 12px;
    color: var(--nova-fg-muted);
}
@media (max-width: 860px) {
    .nova-promo-guarantee { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .nova-promo-guarantee-item:not(:last-child)::after { display: none; }
}
@media (max-width: 480px) {
    .nova-promo-guarantee { grid-template-columns: 1fr; }
}

/* ----- 活动说明 ----- */
.nova-promo-faq {
    margin-top: 80px;
    padding-top: 64px;
    border-top: 1px solid var(--nova-border);
}
.nova-promo-faq-title {
    font-size: 32px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--nova-fg);
    margin: 0 0 32px;
    text-align: center;
}
.nova-promo-faq-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.nova-promo-faq-item {
    padding: 28px 24px;
    background: var(--nova-bg);
    border: 1px solid var(--nova-border);
    border-radius: 18px;
    position: relative;
    transition: all var(--nova-transition);
}
.nova-promo-faq-item:hover {
    border-color: var(--nova-fg);
    transform: translateY(-2px);
}
.nova-promo-faq-num {
    font-size: 40px;
    font-weight: 800;
    color: var(--nova-border);
    letter-spacing: -0.04em;
    line-height: 1;
    margin-bottom: 16px;
    font-variant-numeric: tabular-nums;
}
.nova-promo-faq-eyebrow {
    display: block;
    font-size: 12px;
    color: var(--nova-fg-muted);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 600;
    margin-bottom: 8px;
}
.nova-promo-faq-item p {
    font-size: 13px;
    line-height: 1.7;
    color: var(--nova-fg-soft);
    margin: 0;
}

/* ----- 响应式 ----- */
@media (max-width: 1024px) {
    .nova-promo-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 860px) {
    .nova-promo-hero-inner {
        grid-template-columns: 1fr;
        padding: 40px 28px;
        text-align: center;
    }
    .nova-promo-desc { margin-left: auto; margin-right: auto; }
    .nova-promo-countdown { align-items: center; }
    .nova-promo-hero-visual { min-height: 280px; }
    .nova-promo-circle { width: 240px; height: 240px; }
    .nova-promo-circle-num { font-size: 64px; }
    .nova-promo-stats { padding: 24px 16px; }
    .nova-promo-stat-num { font-size: 28px; }
    .nova-promo-toolbar { flex-direction: column; align-items: flex-start; }
    .nova-promo-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
    .nova-promo-feature-row { grid-template-columns: repeat(2, 1fr); }
    .nova-promo-faq-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
    .nova-promo-grid { grid-template-columns: 1fr; }
    .nova-promo-fc-1 { left: 0; }
    .nova-promo-fc-2 { right: 0; }
    .nova-cd-num { width: 52px; height: 52px; font-size: 22px; }
    .nova-cd-sep { font-size: 22px; padding-bottom: 16px; }
    .nova-promo-feature-row { grid-template-columns: 1fr; }
    .nova-promo-faq-grid { grid-template-columns: 1fr; }
}

/* ============= 查询按钮 / 滚动条 保险覆盖 ============= */
.bootstrap-table .fixed-table-toolbar .query-button {
    background: var(--nova-fg, #0a0a0a) !important;
    background-image: none !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08) !important;
}
.bootstrap-table .fixed-table-toolbar .query-button:hover {
    background: #2a2a2a !important;
    background-image: none !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12) !important;
}

.layui-btn-pink {
    background: var(--nova-fg, #0a0a0a) !important;
    background-image: none !important;
    color: #fff !important;
}

::-webkit-scrollbar {
    width: 10px !important;
}
::-webkit-scrollbar-track {
    background: transparent !important;
}
::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.15) !important;
    border: 2px solid transparent !important;
    background-clip: padding-box !important;
}
::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.28) !important;
    background-clip: padding-box !important;
    border: 2px solid transparent !important;
}
::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(0, 0, 0, 0.1) !important;
    background-clip: padding-box !important;
    border: 2px solid transparent !important;
}

/* ============== 购买记录页 NOVA 风格强化 ============== */

/* 表格卡片：内边距 + 滚动容器 */
.nova-card-table {
    padding: 0 !important;
    overflow: hidden !important;
}
.nova-card-table .bootstrap-table {
    overflow: hidden !important;
}
.nova-card-table .bootstrap-table .fixed-table-toolbar {
    padding: 14px 16px 8px !important;
}
.nova-card-table .bootstrap-table .fixed-table-container {
    border: none !important;
}
.nova-card-table .bootstrap-table .fixed-table-pagination {
    border-radius: 0 0 var(--nova-radius-xl) var(--nova-radius-xl);
}

/* 1. 强制覆盖所有彩色 badge 为 NOVA 灰阶系统 */
.bootstrap-table .a-badge,
.bootstrap-table .a-badge-success,
.bootstrap-table .a-badge-danger,
.bootstrap-table .a-badge-primary,
.bootstrap-table .a-badge-warning,
.bootstrap-table .a-badge-info,
.bootstrap-table .a-badge-dark,
.bootstrap-table .badge,
.bootstrap-table .acg-badge {
    background-color: var(--nova-bg-soft) !important;
    color: var(--nova-fg-soft) !important;
    border: 1px solid var(--nova-border) !important;
    font-weight: 500 !important;
    font-size: 12px !important;
    padding: 3px 8px !important;
    border-radius: 6px !important;
    line-height: 1.5 !important;
    display: inline-block !important;
}

/* 状态语义化：用细微色阶区分而非刺眼彩色 */
.bootstrap-table .a-badge-success,
.bootstrap-table .badge-success {
    background-color: rgba(10, 10, 10, 0.06) !important;
    color: var(--nova-fg) !important;
    border-color: rgba(10, 10, 10, 0.12) !important;
}
.bootstrap-table .a-badge-danger,
.bootstrap-table .badge-danger {
    background-color: rgba(10, 10, 10, 0.04) !important;
    color: var(--nova-fg-muted) !important;
    border-color: var(--nova-border) !important;
    text-decoration: line-through;
    text-decoration-color: var(--nova-fg-muted);
    text-decoration-thickness: 1px;
}
.bootstrap-table .a-badge-primary,
.bootstrap-table .a-badge-warning,
.bootstrap-table .a-badge-info {
    background-color: var(--nova-bg-soft) !important;
    color: var(--nova-fg-soft) !important;
    border-color: var(--nova-border) !important;
}
.bootstrap-table .a-badge-dark {
    background-color: var(--nova-fg) !important;
    color: #fff !important;
    border-color: var(--nova-fg) !important;
}

/* 2. 金额统一为 NOVA 黑（不再用绿色/红色） */
.bootstrap-table .text-green,
.bootstrap-table .text-red,
.bootstrap-table .text-primary,
.bootstrap-table span[style*="color: green"],
.bootstrap-table span[style*="color:green"],
.bootstrap-table span[style*="color: red"],
.bootstrap-table span[style*="color:red"],
.bootstrap-table span[style*="color: blue"],
.bootstrap-table span[style*="color:blue"],
.bootstrap-table span[style*="color: #de27ba"],
.bootstrap-table span[style*="color:#de27ba"],
.bootstrap-table span[style*="color: #f3e343"],
.bootstrap-table span[style*="color:#f3e343"] {
    color: var(--nova-fg) !important;
    font-weight: 600 !important;
}

/* 3. 商品/支付方式单元格美化 */
.bootstrap-table .table-item,
.bootstrap-table .pay-item {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
}
.bootstrap-table .table-item-icon,
.bootstrap-table .pay-item .item-icon {
    width: 28px !important;
    height: 28px !important;
    border-radius: 6px !important;
    object-fit: cover !important;
    border: 1px solid var(--nova-border) !important;
    background: var(--nova-bg-soft) !important;
}
.bootstrap-table .table-item-name,
.bootstrap-table .pay-item .item-name {
    color: var(--nova-fg) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

/* 4. SKU badge 组美化 */
.bootstrap-table .a-badge-group {
    display: inline-flex !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    max-width: 240px !important;
}
.bootstrap-table .a-badge-group .a-badge {
    font-size: 11px !important;
    padding: 2px 6px !important;
}

/* 5. 宝贝信息（卡密）区块美化 */
.bootstrap-table textarea.secret {
    width: 100% !important;
    min-height: 48px !important;
    max-height: 120px !important;
    padding: 6px 8px !important;
    border: 1px solid var(--nova-border) !important;
    border-radius: 6px !important;
    background: var(--nova-bg-soft) !important;
    color: var(--nova-fg) !important;
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace !important;
    font-size: 11px !important;
    line-height: 1.5 !important;
    resize: vertical !important;
    outline: none !important;
    transition: border-color 0.2s ease !important;
}
.bootstrap-table textarea.secret:focus {
    border-color: var(--nova-fg) !important;
    background: #fff !important;
}
.bootstrap-table .secret-download {
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
    margin-top: 4px !important;
    color: var(--nova-fg-soft) !important;
    font-size: 11px !important;
    text-decoration: none !important;
    padding: 3px 6px !important;
    border-radius: 4px !important;
    border: 1px solid var(--nova-border) !important;
    background: #fff !important;
    transition: all 0.2s ease !important;
}
.bootstrap-table .secret-download:hover {
    color: var(--nova-fg) !important;
    border-color: var(--nova-fg) !important;
    background: var(--nova-bg-soft) !important;
}
.bootstrap-table .secret-download i {
    font-size: 11px !important;
}

/* 6. 卡片视图（手机端）强化 */
.bootstrap-table .card-view {
    padding: 14px 16px !important;
    border-top: 1px solid var(--nova-border) !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
}
.bootstrap-table .card-view:first-child {
    border-top: none !important;
}
.bootstrap-table .card-view .card-view-title {
    flex-shrink: 0;
    width: 80px !important;
    color: var(--nova-fg-muted) !important;
    font-weight: 500 !important;
    font-size: 12px !important;
    padding-top: 2px !important;
}
.bootstrap-table .card-view .card-view-value {
    flex: 1;
    color: var(--nova-fg) !important;
    font-size: 13px !important;
    word-break: break-all !important;
}

/* 7. 商家留言样式 */
.bootstrap-table .leave-msg {
    display: inline-block !important;
    padding: 4px 8px !important;
    background: var(--nova-bg-soft) !important;
    border-radius: 4px !important;
    border-left: 2px solid var(--nova-fg) !important;
    color: var(--nova-fg-soft) !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
    max-width: 200px !important;
    word-break: break-all !important;
}

/* 8. 订单号等长字符等宽显示 */
.bootstrap-table td {
    font-variant-numeric: tabular-nums;
}
.bootstrap-table .table tbody td:first-child {
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace !important;
    font-size: 12px !important;
    color: var(--nova-fg-soft) !important;
}

/* 9. 强制覆盖 _user.css 的粉色和蓝色 */
.pink {
    background: var(--nova-fg) !important;
    box-shadow: none !important;
    color: #fff !important;
}
.checked {
    border: 1px solid var(--nova-fg) !important;
}

/* 9.1 覆盖 bootstrap-table switch 按钮粉色背景 */
.bootstrap-table.bootstrap5 .table-switch-state button.active,
.bootstrap-table .table-switch-state button.active,
.table-switch-state button.active,
.bootstrap-table.bootstrap5 .table-switch-state button:focus,
.bootstrap-table .table-switch-state button:focus,
.table-switch-state button:focus {
    background-color: var(--nova-fg) !important;
    color: #fff !important;
    border-color: var(--nova-fg) !important;
    box-shadow: none !important;
}
.table-switch-state button {
    border: 1px solid var(--nova-border) !important;
    background-color: #fff !important;
    color: var(--nova-fg-soft) !important;
    border-radius: 6px !important;
    transition: all 0.2s ease !important;
}
.table-switch-state button:not(.active):hover {
    background-color: var(--nova-bg-soft) !important;
    color: var(--nova-fg) !important;
    border-color: var(--nova-fg) !important;
}

/* 9.2 覆盖所有粉色内联 color (#db66ac / #ffa3ad 等) */
.bootstrap-table [style*="color: #db66ac"],
.bootstrap-table [style*="color:#db66ac"],
.bootstrap-table [style*="color: #ffa3ad"],
.bootstrap-table [style*="color:#ffa3ad"],
.bootstrap-table [style*="color: #fa85cb"],
.bootstrap-table [style*="color:#fa85cb"],
.bootstrap-table [style*="color: #e581c5"],
.bootstrap-table [style*="color:#e581c5"],
.bootstrap-table [style*="background-color: #ffa3ad"],
.bootstrap-table [style*="background-color:#ffa3ad"],
.bootstrap-table [style*="background: #ffa3ad"],
.bootstrap-table [style*="background:#ffa3ad"] {
    color: var(--nova-fg) !important;
    background-color: var(--nova-fg) !important;
    background: var(--nova-fg) !important;
}

/* 10. 购买记录页标题区美化 */
.nova-user-content > h2 {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: var(--nova-fg) !important;
    letter-spacing: -0.01em !important;
    margin-bottom: 4px !important;
}
.nova-content-desc {
    color: var(--nova-fg-muted) !important;
    font-size: 13px !important;
    margin-bottom: 20px !important;
}

/* ============== 购买记录 手机端响应式 ============== */
@media (max-width: 768px) {
    /* 关键：禁用表头固定，让表头和表体在同一个滚动容器内 */
    /* overflow: hidden 防止 720px 表格撑开容器导致分页器跟随扩展被裁切 */
    .nova-card-table .bootstrap-table .fixed-table-container {
        overflow: hidden !important;
        height: auto !important;
    }
    .nova-card-table .bootstrap-table .fixed-table-header {
        display: none !important;
    }
    .nova-card-table .bootstrap-table .fixed-table-body {
        overflow-x: auto !important;
        height: auto !important;
        -webkit-overflow-scrolling: touch;
    }
    .nova-card-table .bootstrap-table .fixed-table-body thead {
        display: table-header-group !important;
    }
    .nova-card-table .bootstrap-table .fixed-table-body table {
        table-layout: auto !important;
    }

    /* 表格最小宽度，保证列不被挤压到无法阅读 */
    .nova-card-table .bootstrap-table .table {
        min-width: 720px !important;
        width: 720px !important;
    }

    /* 字号更小 */
    .nova-card-table .bootstrap-table .table thead th .th-inner {
        padding: 8px 10px !important;
        font-size: 11px !important;
    }
    .nova-card-table .bootstrap-table .table tbody td {
        padding: 8px 10px !important;
        font-size: 12px !important;
        white-space: nowrap !important;
    }

    /* 商品名/订单号允许换行 */
    .nova-card-table .bootstrap-table .table-item-name,
    .nova-card-table .bootstrap-table .table tbody td:first-child {
        white-space: normal !important;
        word-break: break-all !important;
    }

    /* 图标更小 */
    .nova-card-table .bootstrap-table .table-item-icon,
    .nova-card-table .bootstrap-table .pay-item .item-icon {
        width: 22px !important;
        height: 22px !important;
    }

    /* 宝贝信息 textarea 紧凑 */
    .nova-card-table .bootstrap-table textarea.secret {
        min-width: 120px !important;
        max-width: 180px !important;
        min-height: 40px !important;
        font-size: 10px !important;
    }

    /* 搜索栏纵向排列 */
    .nova-card-table .bootstrap-table .fixed-table-toolbar .columns-search,
    .nova-card-table .bootstrap-table .fixed-table-toolbar .search {
        width: 100% !important;
        float: none !important;
    }
    .nova-card-table .bootstrap-table .fixed-table-toolbar .columns-search .form-group,
    .nova-card-table .bootstrap-table .fixed-table-toolbar .search .form-group {
        width: 100% !important;
        margin-bottom: 8px !important;
    }

    /* 分页区紧凑 */
    .nova-card-table .bootstrap-table .fixed-table-pagination {
        padding: 10px 8px !important;
        font-size: 12px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    .nova-card-table .bootstrap-table .fixed-table-pagination .page-item .page-link {
        padding: 4px 8px !important;
        font-size: 12px !important;
    }

    /* 标题缩小 */
    .nova-user-content > h2 {
        font-size: 18px !important;
    }
    .nova-content-desc {
        font-size: 12px !important;
        margin-bottom: 12px !important;
    }
}

@media (max-width: 480px) {
    /* 超窄屏：进一步压缩 */
    .nova-card-table .bootstrap-table .table {
        min-width: 620px !important;
        width: 620px !important;
    }
    .nova-card-table .bootstrap-table .table tbody td {
        padding: 6px 8px !important;
        font-size: 11px !important;
    }
    .nova-card-table .bootstrap-table .table thead th .th-inner {
        padding: 6px 8px !important;
        font-size: 10px !important;
    }
    .nova-card-table .bootstrap-table .table-item-icon,
    .nova-card-table .bootstrap-table .pay-item .item-icon {
        width: 20px !important;
        height: 20px !important;
    }
}