/* ========== 服装供销平台 - 设计系统 (深绿+金色) ========== */

:root {
    --fz-green: #1B4332;
    --fz-green-dark: #0D2B1E;
    --fz-green-light: rgba(27, 67, 50, 0.08);
    --fz-gold: #C9A96E;
    --fz-gold-dark: #B8975A;
    --fz-bg: #F8F6F0;
    --fz-text: #1A1A1A;
    --fz-text-sec: #6B7280;
    --fz-text-muted: #9CA3AF;
    --fz-border: #E8E4DC;
    --fz-border-light: #f0efec;
    --fz-radius: 12px;
    --fz-radius-lg: 16px;
    --fz-radius-full: 9999px;
    --fz-shadow: 0 1px 3px rgba(0,0,0,0.04);
    --fz-shadow-md: 0 4px 12px rgba(27,67,50,0.1);
    --fz-transition: 0.25s ease;
}

[v-cloak] {
    display: none !important;
}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
html, body {
    margin:0;
    padding:0;
    height:100%;
}
body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif;
    background: var(--fz-bg);
    color: var(--fz-text);
    -webkit-font-smoothing: antialiased;
    min-height:100vh;
}

.platform-container {
    max-width: 1440px;
    margin: 0 auto;
}
.page-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--fz-green-dark);
}
.section-title-bar {
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:16px;
}
.section-title-bar::before {
    content:'';
    width:4px;
    height:24px;
    background:var(--fz-gold);
    border-radius:2px;
    flex-shrink:0;
}
.section-title {
    margin:0;
    font-size:20px;
    font-weight:700;
    color:var(--fz-green-dark);
}
.text-gold {
    color: var(--fz-gold);
}
.bg-gold {
    background-color: var(--fz-gold);
}
.border-gold {
    border-color: var(--fz-gold);
}

/* Header */
.site3-header {
    background:#fff;
    color:var(--fz-text);
    height:80px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 32px;
    flex-shrink:0;
    position:sticky;
    top:0;
    z-index:50;
    border-bottom:1px solid var(--fz-border);
    box-shadow:0 2px 8px rgba(0,0,0,0.04);
}
.site3-logo {
    width:40px;
    height:40px;
    background:var(--fz-green);
    border-radius:8px;
    display:flex;
    align-items:center;
    justify-content:center;
}
.site3-brand {
    font-size:20px;
    font-weight:700;
    color:var(--fz-green-dark);
    letter-spacing:-0.3px;
}
.site3-search {
    width:100%;
    max-width:360px;
    height:40px;
    padding:0 14px 0 38px;
    background:var(--fz-bg);
    border:1px solid var(--fz-border);
    border-radius:9999px;
    font-size:13px;
    outline:none;
    color:var(--fz-text);
    transition:all 0.2s;
}
.site3-search:focus {
    border-color:var(--fz-gold);
    box-shadow:0 0 0 2px rgba(201,169,110,0.15);
}
.site3-btn-primary {
    height:38px;
    padding:0 20px;
    background:var(--fz-green);
    color:#fff;
    border-radius:8px;
    font-size:13px;
    font-weight:600;
    display:inline-flex;
    align-items:center;
    gap:6px;
    border:none;
    cursor:pointer;
    transition:all 0.2s;
}
.site3-btn-primary:hover {
    background:var(--fz-green-dark);
}

/* Footer */
.site3-footer {
    background:#1A1A1A;
    color:#fff;
    padding:48px 32px 24px;
    flex-shrink:0;
}
.site3-footer-inner {
    max-width:1200px;
    margin:0 auto;
}
.site3-footer-grid {
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    gap:48px;
}
.site3-footer-col {
    text-align:center;
}
.site3-footer-title {
    font-size:15px;
    font-weight:700;
    color:#C9A96E;
    margin-bottom:16px;
}
.site3-footer-links {
    display:flex;
    flex-direction:column;
    gap:8px;
}
.site3-footer-links a {
    color:rgba(255,255,255,0.55);
    font-size:13px;
    text-decoration:none;
    transition:color 0.2s;
}
.site3-footer-links a:hover {
    color:#C9A96E;
}
.footer-link {
    color:#8A8A8A;
    text-decoration:none;
    transition:color 0.2s;
}
.footer-link:hover {
    color:#C9A96E;
}
.site3-footer-contact p {
    color:rgba(255,255,255,0.45);
    font-size:13px;
    margin-bottom:4px;
}
.site3-footer-bottom {
    margin-top:32px;
    padding-top:16px;
    border-top:1px solid rgba(255,255,255,0.08);
    text-align:center;
    font-size:12px;
    color:rgba(255,255,255,0.3);
}

/* Cards */
.card {
    background:#fff;
    border-radius:var(--fz-radius);
    border:1px solid var(--fz-border);
    box-shadow:var(--fz-shadow);
    transition:all var(--fz-transition);
}
.card-header {
    padding:16px 20px;
    border-bottom:1px solid var(--fz-border-light);
    display:flex;
    align-items:center;
    justify-content:space-between;
}
.card-title {
    font-size:16px;
    font-weight:600;
    color:var(--fz-green-dark);
}
.card-body {
    padding:20px;
}

/* Buttons */
.btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    border-radius:8px;
    font-size:14px;
    font-weight:500;
    cursor:pointer;
    border:1px solid transparent;
    transition:all var(--fz-transition);
    outline:none;
    white-space:nowrap;
    text-decoration:none !important;
}
.btn:disabled {
    opacity:0.5;
    cursor:not-allowed;
}
.btn-sm {
    height:32px;
    padding:0 12px;
    font-size:13px;
}
.btn-md {
    height:40px;
    padding:0 16px;
}
.btn-lg {
    height:48px;
    padding:0 32px;
    font-size:16px;
}
.btn-gold {
    background:var(--fz-gold);
    color:#fff;
    border-color:var(--fz-gold);
}
.btn-gold:hover {
    background:var(--fz-gold-dark);
    border-color:var(--fz-gold-dark);
}
.btn-primary {
    background:var(--fz-green);
    color:#fff;
    border-color:var(--fz-green);
}
.btn-primary:hover {
    background:var(--fz-green-dark);
}
.btn-outline {
    background:rgba(255,255,255,0.8);
    color:var(--fz-text);
    border-color:var(--fz-border);
}
.btn-outline:hover {
    background:#fff;
    border-color:#d1ccc3;
}
.btn-ghost {
    background:transparent;
    color:var(--fz-text-sec);
    border-color:transparent;
}
.btn-ghost:hover {
    background:#f3f4f6;
    color:var(--fz-text);
}

/* Table */
.table-wrap {
    background:#fff;
    border-radius:var(--fz-radius);
    border:1px solid var(--fz-border);
    overflow:hidden;
}
.table-scroll {
    overflow-x:auto;
}
table.lb-table {
    width:100%;
    border-collapse:collapse;
    font-size:13px;
}
.lb-table th {
    background:#F0F0ED;
    color:var(--fz-text);
    font-weight:600;
    text-align:left;
    padding:14px 16px;
    border-bottom:1px solid var(--fz-border-light);
    white-space:nowrap;
}
.lb-table td {
    padding:14px 16px;
    border-bottom:1px solid var(--fz-border-light);
    vertical-align:middle;
}
.lb-table tr:last-child td {
    border-bottom:none;
}
.lb-table tbody tr:hover {
    background:rgba(248,246,240,0.5);
}

/* Tags */
.tag {
    display:inline-flex;
    align-items:center;
    padding:2px 10px;
    border-radius:var(--fz-radius-full);
    font-size:12px;
    font-weight:500;
    line-height:1.5;
}
.tag-success {
    background:#ecfdf5;
    color:#059669;
}
.tag-warning {
    background:#fffbeb;
    color:#d97706;
}
.tag-info {
    background:#eff6ff;
    color:#2563eb;
}
.tag-error {
    background:#fef2f2;
    color:#dc2626;
}
.tag-gold {
    background:rgba(201,169,110,0.12);
    color:var(--fz-gold);
}

/* Forms */
.form-input {
    height:36px;
    padding:0 12px;
    border:1px solid var(--fz-border);
    border-radius:8px;
    font-size:13px;
    color:var(--fz-text);
    background:#fff;
    outline:none;
    transition:border-color var(--fz-transition);
}
.form-input:focus {
    border-color:var(--fz-gold);
    box-shadow:0 0 0 2px rgba(201,169,110,0.15);
}
.form-select {
    height:36px;
    padding:0 32px 0 12px;
    border:1px solid var(--fz-border);
    border-radius:8px;
    font-size:13px;
    color:var(--fz-text);
    background:#fff;
    outline:none;
    cursor:pointer;
    appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%239CA3AF' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 10px center;
}
.form-select:focus {
    border-color:var(--fz-gold);
    box-shadow:0 0 0 2px rgba(201,169,110,0.15);
}

/* Stats */
.stat-card {
    background:#fff;
    padding:20px;
    border-radius:var(--fz-radius);
    border:1px solid var(--fz-border-light);
    display:flex;
    align-items:center;
    gap:16px;
    transition:all var(--fz-transition);
}
.stat-card:hover {
    box-shadow:0 4px 12px rgba(27,67,50,0.08);
    border-color:var(--fz-gold);
    transform:translateY(-2px);
}
.stat-icon {
    width:48px;
    height:48px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
}
.stat-value {
    font-size:24px;
    font-weight:700;
    color:var(--fz-gold);
}
.stat-label {
    font-size:14px;
    color:var(--fz-text-sec);
    margin-top:2px;
}

/* Cat card */
.cat-card {
    background:#fff;
    border:1px solid var(--fz-border-light);
    border-radius:var(--fz-radius);
    padding:20px 12px;
    text-align:center;
    cursor:pointer;
    transition:all var(--fz-transition);
}
.cat-card:hover {
    border-color:var(--fz-gold);
    transform:translateY(-2px);
    box-shadow:0 4px 12px rgba(201,169,110,0.15);
}
.cat-icon-wrap {
    width:48px;
    height:48px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto 8px;
    font-size:22px;
}
.cat-name {
    font-size:14px;
    font-weight:500;
    color:var(--fz-text);
}
.cat-count {
    font-size:12px;
    color:#999;
    margin-top:4px;
}

/* Product card */
.prod-card {
    background:#fff;
    border-radius:var(--fz-radius);
    overflow:hidden;
    cursor:pointer;
    border:1px solid var(--fz-border-light);
    transition:all var(--fz-transition);
}
.prod-card:hover {
    box-shadow:var(--fz-shadow-md);
    transform:translateY(-2px);
}
.prod-img-wrap {
    aspect-ratio:1;
    background:#f0efec;
    overflow:hidden;
}
.prod-img {
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform 0.3s;
}
.prod-card:hover .prod-img {
    transform:scale(1.08);
}
.prod-info {
    padding:12px;
}
.prod-name {
    font-size:14px;
    font-weight:500;
    color:var(--fz-green-dark);
    line-height:1.4;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    min-height:40px;
}
.prod-price {
    font-size:18px;
    font-weight:700;
    color:#ef4445;
}
.prod-sales {
    font-size:12px;
    color:var(--fz-text-sec);
}

/* Pagination */
.page-btn {
    min-width:32px;
    height:32px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid var(--fz-border);
    border-radius:6px;
    background:#fff;
    color:var(--fz-text);
    font-size:13px;
    cursor:pointer;
    transition:all var(--fz-transition);
}
.page-btn:hover {
    border-color:var(--fz-green);
    color:var(--fz-green);
}
.page-btn.active {
    background:var(--fz-green);
    color:#fff;
    border-color:var(--fz-green);
}
.page-btn:disabled {
    opacity:0.4;
    cursor:not-allowed;
}

/* === Status Tag Base & Colors === */
.tag-status {
    display:inline-flex;
    align-items:center;
    border-radius:9999px;
    padding:2px 10px;
    font-size:12px;
    font-weight:600;
    border:1px solid transparent;
    line-height:1.4;
}
.tag-green {
    background:#1B4332;
    color:#fff;
}
.tag-orange {
    background:#C9A96E;
    color:#fff;
}
.tag-red {
    background:#dc2626;
    color:#fff;
}
.tag-blue {
    background:#2563eb;
    color:#fff;
}
.tag-gray {
    background:#F0EFEC;
    color:#4A4A4A;
}

/* === Button Variants === */
.btn-gold-sm {
    height:36px;
    padding:0 16px;
    background:var(--fz-gold);
    color:#fff;
    border:none;
    border-radius:8px;
    font-size:13px;
    font-weight:600;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:6px;
    white-space:nowrap;
    transition:background 0.2s;
}
.btn-gold-sm:hover {
    background:var(--fz-gold-dark);
}
.btn-outline-sm {
    height:36px;
    padding:0 16px;
    background:transparent;
    color:var(--fz-text);
    border:1px solid var(--fz-border);
    border-radius:8px;
    font-size:13px;
    font-weight:600;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:6px;
    white-space:nowrap;
    transition:all 0.2s;
}
.btn-outline-sm:hover {
    background:var(--fz-bg);
    border-color:var(--fz-gold);
    color:var(--fz-gold);
}
.btn-link-gold {
    background:none;
    border:none;
    color:var(--fz-gold);
    font-size:13px;
    font-weight:700;
    cursor:pointer;
    padding:4px 8px;
    transition:color 0.2s;
    text-decoration:none;
}
.btn-link-gold:hover {
    color:var(--fz-gold-dark);
}
.btn-icon-circle {
    width:36px;
    height:36px;
    border-radius:50%;
    background:transparent;
    border:none;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:#8A8A8A;
    transition:all 0.2s;
}
.btn-icon-circle:hover {
    background:#1B4332;
    color:#C9A96E;
}
.btn-publish {
    height:40px;
    padding:0 24px;
    background:var(--fz-green);
    color:var(--fz-gold);
    border:none;
    border-radius:9999px;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.1em;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:8px;
    box-shadow:0 4px 12px rgba(27,67,50,0.2);
    transition:all 0.2s;
}
.btn-publish:hover {
    background:#2D6A4F;
}

/* === Type Badges === */
.tag-type-company {
    display:inline-flex;
    align-items:center;
    border-radius:6px;
    padding:2px 8px;
    font-size:10px;
    font-weight:600;
    background:rgba(27,67,50,0.08);
    color:var(--fz-green);
}
.tag-type-individual {
    display:inline-flex;
    align-items:center;
    border-radius:6px;
    padding:2px 8px;
    font-size:10px;
    font-weight:600;
    background:rgba(201,169,110,0.12);
    color:var(--fz-gold);
}
.tag-type-natural {
    display:inline-flex;
    align-items:center;
    border-radius:6px;
    padding:2px 8px;
    font-size:10px;
    font-weight:600;
    background:rgba(248,246,240,0.8);
    color:var(--fz-text-sec);
}
.tag-type-self {
    display:inline-flex;
    align-items:center;
    border-radius:6px;
    padding:2px 8px;
    font-size:10px;
    font-weight:600;
    background:rgba(201,169,110,0.12);
    color:var(--fz-gold);
}

/* === Filter Card / Inputs === */
.filter-card {
    background:#fff;
    border:1px solid var(--fz-border);
    border-radius:var(--fz-radius);
    padding:24px;
    margin-bottom:24px;
    box-shadow:var(--fz-shadow);
}
.filter-input {
    background:var(--fz-bg);
    border-color:var(--fz-border);
    border-radius:8px;
    width:100%;
}
.filter-select {
    background:var(--fz-bg);
    border-color:var(--fz-border);
    border-radius:8px;
    color:var(--fz-text);
    width:100%;
}
.flex-scroll {
    flex:1;
    overflow-y:auto;
    min-height:0;
}
.flex-between-wrap {
    display:flex;
    align-items:center;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:12px;
}
.app-shell {
    display:flex;
    flex-direction:column;
    min-height:100vh;
}
.page-title-lg {
    font-size:30px;
    font-weight:800;
    color:#1A1A1A;
    margin:0;
    letter-spacing:-0.5px;
}
.filter-card-lg {
    background:#fff;
    border:1px solid var(--fz-border);
    border-radius:16px;
    padding:20px 24px;
    margin-bottom:24px;
}
.filter-grid-2 {
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(170px,1fr));
    gap:12px;
    align-items:center;
}
.search-input {
    width:100%;
    height:36px;
    padding:0 12px 0 34px;
    background:var(--fz-bg);
    border:1px solid transparent;
    border-radius:8px;
    font-size:13px;
    outline:none;
    color:var(--fz-text);
    box-sizing:border-box;
    transition:all 0.2s;
}
.search-input:focus {
    border-color:var(--fz-gold);
}
.search-select {
    height:36px;
    padding:0 28px 0 12px;
    background:var(--fz-bg);
    border:1px solid transparent;
    border-radius:8px;
    font-size:13px;
    color:#4A4A4A;
    outline:none;
    width:100%;
    cursor:pointer;
    box-sizing:border-box;
    appearance:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2212%22 height=%2212%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%238A8A8A%22 stroke-width=%222%22%3E%3Cpolyline points=%226 9 12 15 18 9%22/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 10px center;
}
.search-select:focus {
    border-color:var(--fz-gold);
}
.search-icon {
    position:absolute;
    left:12px;
    top:50%;
    transform:translateY(-50%);
    color:#8A8A8A;
    pointer-events:none;
}
.th-gold {
    font-weight:700;
    color:var(--fz-gold);
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:0.1em;
    padding:20px 16px;
    text-align:left;
}
.tr-border {
    border-bottom:1px solid var(--fz-border);
    transition:all 0.2s;
}
.card-hover-shadow {
    background:#fff;
    border-radius:16px;
    border:1px solid var(--fz-border);
    overflow:hidden;
    transition:box-shadow 0.2s;
}
.card-hover-shadow:hover {
    box-shadow:0 4px 12px rgba(27,67,50,0.08);
}

/* === Table Enhancements === */
table.lb-table {
    border:none;
}
.lb-table thead tr {
    border-bottom:1px solid var(--fz-border-light);
}

/* === Th Dark === */
.th-dark {
    font-weight:700;
    color:var(--fz-green-dark);
}

/* Utilities */
.flex-center {
    display:flex;
    align-items:center;
}
.flex-between {
    display:flex;
    align-items:center;
    justify-content:space-between;
}
.flex-col {
    display:flex;
    flex-direction:column;
}
.flex-1 {
    flex:1;
}
.shrink-0 {
    flex-shrink:0;
}
.gap-4 {
    gap:4px;
}
.gap-6 {
    gap:6px;
}
.gap-8 {
    gap:8px;
}
.gap-10 {
    gap:10px;
}
.gap-12 {
    gap:12px;
}
.gap-16 {
    gap:16px;
}
.gap-20 {
    gap:20px;
}
.gap-24 {
    gap:24px;
}
.gap-32 {
    gap:32px;
}
.gap-40 {
    gap:40px;
}
.gap-48 {
    gap:48px;
}
.p-12 {
    padding:12px;
}
.p-16 {
    padding:16px;
}
.p-20 {
    padding:20px;
}
.p-24 {
    padding:24px;
}
.p-32 {
    padding:32px;
}
.m-0 {
    margin:0;
}
.mb-16 {
    margin-bottom:16px;
}
.mb-20 {
    margin-bottom:20px;
}
.mb-24 {
    margin-bottom:24px;
}
.text-dark {
    color:var(--fz-green-dark);
}
.text-sec {
    color:var(--fz-text-sec);
}
.text-muted {
    color:var(--fz-text-muted);
}
.text-gold {
    color:var(--fz-gold);
}
.text-red {
    color:#ef4445;
}
.text-white {
    color:#fff;
}
.fs-11 {
    font-size:11px;
}
.fs-12 {
    font-size:12px;
}
.fs-13 {
    font-size:13px;
}
.fs-14 {
    font-size:14px;
}
.fs-16 {
    font-size:16px;
}
.fs-20 {
    font-size:20px;
}
.fs-24 {
    font-size:24px;
}
.fw-5 {
    font-weight:500;
}
.fw-6 {
    font-weight:600;
}
.fw-7 {
    font-weight:700;
}
.br-8 {
    border-radius:8px;
}
.br-12 {
    border-radius:12px;
}
.br-16 {
    border-radius:16px;
}
.br-50 {
    border-radius:50%;
}
.br-full {
    border-radius:9999px;
}
.bdr {
    border:1px solid var(--fz-border);
}
.bdr-l {
    border:1px solid var(--fz-border-light);
}
.w-full {
    width:100%;
}
.h-full {
    height:100%;
}
.obj-cover {
    object-fit:cover;
}
.aspect-1 {
    aspect-ratio:1;
}
.stats-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
}
.cat-grid {
    display:grid;
    grid-template-columns:repeat(8,1fr);
    gap:16px;
}
.prod-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:16px;
}
.chart-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px;
    margin-bottom:24px;
}
@media(max-width:1023px) {
    .stats-grid {
        grid-template-columns:repeat(2,1fr);
    }
    .cat-grid {
        grid-template-columns:repeat(4,1fr);
    }
    .prod-grid {
        grid-template-columns:repeat(2,1fr);
    }
}
@media(max-width:767px) {
    .stats-grid {
        grid-template-columns:1fr;
    }
    .cat-grid {
        grid-template-columns:repeat(2,1fr);
    }
    .prod-grid {
        grid-template-columns:1fr;
    }
}

/* === Merchant Modal === */
.merchant-overlay {
    position:fixed;
    inset:0;
    z-index:100;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:16px 40px;
    background:rgba(26,26,26,0.9);
    backdrop-filter:blur(4px);
    overflow-y:auto;
}
.merchant-modal {
    background:#FDFBF7;
    max-width:1024px;
    width:100%;
    border-radius:48px;
    box-shadow:0 24px 64px rgba(0,0,0,0.2);
    overflow:hidden;
    border:1px solid #E8E4DC;
    display:flex;
    flex-direction:column;
    max-height:90vh;
}
.merchant-header {
    background:#1B4332;
    padding:32px 48px;
    color:#fff;
    position:relative;
    flex-shrink:0;
}
.merchant-close-btn {
    position:absolute;
    top:32px;
    right:32px;
    width:40px;
    height:40px;
    border-radius:50%;
    background:rgba(255,255,255,0.1);
    border:none;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    cursor:pointer;
    transition:background 0.2s;
}
.merchant-close-btn:hover {
    background:rgba(255,255,255,0.2);
}
.merchant-step-progress {
    margin-top:48px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    position:relative;
    max-width:600px;
}
.merchant-step-bar {
    position:absolute;
    top:20px;
    left:0;
    width:100%;
    height:1px;
    background:rgba(255,255,255,0.2);
}
.merchant-step-dot {
    width:40px;
    height:40px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:12px;
    font-weight:700;
    transition:all 0.5s;
}
.merchant-step-label {
    font-size:10px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.15em;
    margin-top:8px;
    white-space:nowrap;
    transition:color 0.5s;
}
.merchant-body {
    flex:1;
    overflow-y:auto;
    padding:32px 64px;
    min-height:300px;
}
.merchant-body-inner {
    max-width:720px;
    margin:0 auto;
}
.merchant-footer {
    padding:24px 64px;
    border-top:1px solid #E8E4DC;
    background:#fff;
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-shrink:0;
}
.merchant-btn-primary {
    height:56px;
    padding:0 48px;
    border:none;
    border-radius:9999px;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:0.15em;
    cursor:pointer;
    color:#C9A96E;
    display:inline-flex;
    align-items:center;
    gap:8px;
    box-shadow:0 8px 24px rgba(27,67,50,0.2);
    transition:all 0.2s;
    background:#1B4332;
}
.merchant-btn-primary:hover {
    background:#2D6A4F;
}
.merchant-btn-primary:disabled {
    opacity:0.4;
    cursor:not-allowed;
}
.merchant-btn-primary.merchant-submit {
    background:#059669;
    color:#fff;
}
.merchant-btn-primary.merchant-submit:hover {
    background:#047857;
}
.merchant-btn-prev {
    height:56px;
    padding:0 32px;
    background:transparent;
    border:none;
    color:#8A8A8A;
    font-size:12px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.1em;
    cursor:pointer;
    display:flex;
    align-items:center;
    gap:8px;
    border-radius:9999px;
    transition:all 0.2s;
}
.merchant-btn-prev:hover {
    background:#F8F6F0;
    color:#1B4332;
}
.merchant-btn-prev:disabled {
    opacity:0.3;
    cursor:not-allowed;
}
.merchant-btn-sm-primary {
    padding:12px 32px;
    background:#1B4332;
    color:#C9A96E;
    border:none;
    border-radius:12px;
    font-size:12px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.1em;
    cursor:pointer;
    box-shadow:0 4px 12px rgba(27,67,50,0.1);
    transition:background 0.2s;
    margin-top:24px;
}
.merchant-btn-sm-primary:hover {
    background:#2D6A4F;
}
.merchant-btn-add {
    height:44px;
    padding:0 24px;
    background:#1B4332;
    color:#C9A96E;
    border:none;
    border-radius:9999px;
    font-size:12px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.1em;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:8px;
    box-shadow:0 4px 12px rgba(27,67,50,0.1);
    transition:background 0.2s;
}
.merchant-btn-add:hover {
    background:#2D6A4F;
}
.merchant-btn-delete {
    width:36px;
    height:36px;
    border-radius:50%;
    background:#fef2f2;
    color:#ef4444;
    border:none;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all 0.2s;
}
.merchant-btn-delete:hover {
    background:#fecaca;
}
.merchant-btn-text {
    font-size:10px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:0.1em;
    background:none;
    border:none;
    cursor:pointer;
    display:flex;
    align-items:center;
    gap:4px;
    transition:color 0.2s;
}
.merchant-btn-upload-circle {
    width:64px;
    height:64px;
    border-radius:50%;
    background:#F0EFEC;
    color:#8A8A8A;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all 0.3s;
}
.merchant-btn-upload-circle:hover {
    background:#C9A96E;
    color:#fff;
}
.merchant-upload-card {
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:48px;
    border-radius:40px;
    border:2px dashed;
    cursor:pointer;
    transition:all 0.3s;
}
.merchant-product-card {
    padding:32px;
    border-radius:32px;
    border:1px solid #E8E4DC;
    background:#fff;
    position:relative;
    transition:box-shadow 0.3s;
}
.merchant-product-card:hover {
    box-shadow:0 4px 12px rgba(0,0,0,0.04);
}
.merchant-section-card {
    background:#F8F6F0;
    padding:40px;
    border-radius:40px;
    border:1px solid #E8E4DC;
}
.merchant-agreement-box {
    background:#fff;
    padding:40px 56px;
    border-radius:48px;
    border:1px solid #E8E4DC;
    display:flex;
    flex-direction:column;
    gap:32px;
}
.merchant-sign-area {
    height:180px;
    background:#fff;
    border-radius:32px;
    border:2px solid;
    position:relative;
    overflow:hidden;
    transition:all 0.2s;
}
.merchant-sign-locked {
    display:flex;
    align-items:center;
    gap:8px;
    padding:8px 16px;
    border-radius:999px;
    border:1px solid rgba(27,67,50,0.2);
    background:rgba(255,255,255,0.9);
    backdrop-filter:blur(4px);
}
.merchant-field-label {
    font-size:10px;
    font-weight:900;
    color:#1B4332;
    text-transform:uppercase;
    letter-spacing:0.15em;
    display:flex;
    align-items:center;
    gap:8px;
}
.merchant-field-wrap {
    display:flex;
    flex-direction:column;
    gap:12px;
}
.merchant-grid-2 {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:32px;
}
.merchant-prod-label {
    font-size:10px;
    font-weight:700;
    color:#8A8A8A;
    text-transform:uppercase;
    letter-spacing:0.1em;
}
.merchant-prod-input {
    width:100%;
    height:48px;
    padding:0 12px;
    border:none;
    border-radius:12px;
    font-size:12px;
    background:#F0EFEC;
    outline:none;
    color:#1A1A1A;
    box-sizing:border-box;
}
.merchant-prod-select {
    width:100%;
    height:48px;
    padding:0 12px;
    border:none;
    border-radius:12px;
    font-size:12px;
    font-weight:700;
    background:#F0EFEC;
    outline:none;
    color:#1A1A1A;
    cursor:pointer;
}
.merchant-prod-field {
    display:flex;
    flex-direction:column;
    gap:8px;
}
.merchant-type-card {
    padding:32px;
    border-radius:32px;
    border:2px solid;
    cursor:pointer;
    transition:all 0.3s;
    display:flex;
    flex-direction:column;
    gap:16px;
}
.merchant-type-icon {
    width:56px;
    height:56px;
    border-radius:16px;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all 0.3s;
}
.merchant-btn-text-default {
    color:#8A8A8A;
}
.merchant-btn-text-default:hover {
    color:#ef4444;
}
.merchant-btn-text-confirm {
    color:#059669;
}
.merchant-btn-text-confirm:hover {
    color:#047857;
}
.text-center {
    text-align:center;
}
.merchant-input {
    width:100%;
    height:56px;
    padding:0 16px;
    border:1px solid #E8E4DC;
    border-radius:16px;
    font-size:14px;
    outline:none;
    color:#1A1A1A;
    background:#fff;
    box-sizing:border-box;
    transition:border-color 0.2s;
}
.merchant-input:focus {
    border-color:#C9A96E;
}
.merchant-textarea {
    width:100%;
    min-height:150px;
    padding:24px;
    border:1px solid #E8E4DC;
    border-radius:32px;
    font-size:14px;
    outline:none;
    color:#1A1A1A;
    background:#fff;
    resize:none;
    font-family:inherit;
    box-sizing:border-box;
    transition:border-color 0.2s;
}
.merchant-textarea:focus {
    border-color:#C9A96E;
}
@keyframes fadeSlideIn {
    from {
        opacity:0;
        transform:translateY(10px);
    }
    to {
        opacity:1;
        transform:translateY(0);
    }
}

/* ====== page-dashboard ====== */
.page-dashboard .hero-card {
    min-height: 500px;
    border-radius: 40px;
    display: flex;
    align-items: center;
    padding: 0 64px;
    background: #1B4332;
    border: 1px solid rgba(201, 169, 110, 0.2);
    position: relative;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(27, 67, 50, 0.3);
}
.page-dashboard .welcome-card {
    border-radius: 32px;
    padding: 40px;
    background: #fff;
    border: 1px solid #E8E4DC;
    position: relative;
    overflow: hidden;
}
.page-dashboard .notice-card {
    border-radius: 32px;
    padding: 40px;
    background: #1B4332;
    border: 1px solid rgba(201, 169, 110, 0.2);
    position: relative;
    overflow: hidden;
}
.page-dashboard .stat-card {
    border-radius: 32px;
    padding: 32px;
    background: #fff;
    border: 1px solid #E8E4DC;
    position: relative;
    overflow: hidden;
    transition: all 0.3s;
}
.page-dashboard .stat-card:hover {
    box-shadow: 0 20px 30px -10px rgba(27, 67, 50, 0.08);
}
.page-dashboard .cat-card {
    border-radius: 16px;
    padding: 32px;
    background: #fff;
    border: 1px solid #E8E4DC;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
    cursor: pointer;
    transition: all 0.4s;
}
.page-dashboard .cat-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 25px 50px -12px rgba(27, 67, 50, 0.12);
    border-color: rgba(201, 169, 110, 0.4);
}
.page-dashboard .cat-icon {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.04);
}
.page-dashboard .cat-card:hover .cat-icon {
    transform: scale(1.1);
}
.page-dashboard .prod-card {
    aspect-ratio: 3/4;
    border-radius: 40px;
    overflow: hidden;
    background: #F0EFEC;
    border: 1px solid #E8E4DC;
    position: relative;
    cursor: pointer;
    transition: all 0.7s;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}
.page-dashboard .prod-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 25px 50px -12px rgba(27, 67, 50, 0.12);
}
.page-dashboard .prod-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 50%, rgba(27, 67, 50, 0.6));
    opacity: 0;
    transition: opacity 0.5s;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 32px;
}
.page-dashboard .prod-card:hover .prod-overlay {
    opacity: 1;
}
.page-dashboard .chart-box {
    border-radius: 40px;
    padding: 40px;
    background: #fff;
    border: 1px solid #E8E4DC;
}
/* === Dashboard extras === */
.page-dashboard .dash-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 16px;
    border-radius: 999px;
    background: rgba(201, 169, 110, 0.1);
    color: #C9A96E;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    margin-bottom: 8px;
    border: 1px solid rgba(201, 169, 110, 0.2);
}
.page-dashboard .dash-hero-btn {
    height: 64px;
    padding: 0 48px;
    border-radius: 9999px;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    transition: all 0.3s;
}
.page-dashboard .dash-hero-btn-primary {
    background: #C9A96E;
    color: #1B4332;
    box-shadow: 0 8px 24px rgba(201, 169, 110, 0.25);
}
.page-dashboard .dash-hero-btn-primary:hover {
    background: #D4AF37;
    transform: scale(1.05);
}
.page-dashboard .dash-hero-btn-outline {
    background: transparent;
    color: #C9A96E;
    border: 1px solid #C9A96E;
}
.page-dashboard .dash-hero-btn-outline:hover {
    background: #C9A96E;
    color: #1B4332;
}
.page-dashboard .dash-status-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #F0EFEC;
    padding: 8px 16px;
    border-radius: 999px;
    border: 1px solid #E8E4DC;
    font-size: 12px;
    font-weight: 700;
    color: #4A4A4A;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.page-dashboard .dash-welcome-icon {
    transition: transform 0.5s;
    cursor: pointer;
}
.page-dashboard .dash-welcome-icon:hover {
    transform: rotate(6deg);
}
.page-dashboard .dash-notice-link {
    font-size: 11px;
    font-weight: 700;
    color: #C9A96E;
    text-transform: uppercase;
    letter-spacing: 0.3em;
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 16px;
    transition: all 0.3s;
    cursor: pointer;
}
.page-dashboard .dash-notice-link:hover {
    gap: 12px;
}
.page-dashboard .dash-stat-card {
    background: #fff;
    padding: 32px;
    border-radius: 32px;
    border: 1px solid #E8E4DC;
    position: relative;
    overflow: hidden;
    transition: all 0.3s;
}
.page-dashboard .dash-stat-card:hover {
    box-shadow: 0 20px 30px -10px rgba(27, 67, 50, 0.1);
}
.page-dashboard .dash-label {
    font-size: 10px;
    font-weight: 700;
    color: #C9A96E;
    text-transform: uppercase;
    letter-spacing: 0.3em;
}
.page-dashboard .dash-label-dark {
    font-size: 10px;
    font-weight: 700;
    color: #8A8A8A;
    text-transform: uppercase;
    letter-spacing: 0.2em;
}
.page-dashboard .dash-label-sec {
    font-size: 10px;
    font-weight: 700;
    color: #8A8A8A;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}
.page-dashboard .dash-section-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 4px;
}
.page-dashboard .dash-section-bar-dot {
    width: 8px;
    height: 32px;
    background: #1B4332;
    border-radius: 999px;
    box-shadow: 0 2px 8px rgba(27, 67, 50, 0.15);
}
.page-dashboard .dash-section-title {
    font-size: 30px;
    font-weight: 800;
    color: #1A1A1A;
    margin: 0;
    letter-spacing: -0.5px;
}
.page-dashboard .dash-stat-value {
    font-size: 36px;
    font-weight: 900;
    color: #1A1A1A;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.5px;
}
.page-dashboard .dash-stat-label {
    font-size: 12px;
    font-weight: 700;
    color: #8A8A8A;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    margin-top: 4px;
}
.page-dashboard .dash-section-sub {
    font-size: 10px;
    color: #8A8A8A;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.4em;
    margin-left: 20px;
}
.page-dashboard .dash-link-arrow {
    color: #8A8A8A;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: all 0.3s;
}
.page-dashboard .dash-link-arrow:hover {
    color: #C9A96E;
}
.page-dashboard .dash-arrow {
    transition: transform 0.3s;
    display: inline-block;
}
.page-dashboard .dash-link-arrow:hover .dash-arrow {
    transform: translateX(4px);
}
.page-dashboard .dash-section-header {
    border-bottom: 1px solid #E8E4DC;
    padding-bottom: 16px;
    margin-bottom: 32px;
}
.page-dashboard .dash-chart-header {
    border-bottom: 1px solid #E8E4DC;
    padding-bottom: 24px;
    margin-bottom: 24px;
}
.page-dashboard .dash-prod-img {
    transition: transform 1s;
    will-change: transform;
}
.page-dashboard .dash-prod-img:hover {
    transform: scale(1.1);
}
.page-dashboard .dash-hero-img {
    transition: all 0.7s;
    will-change: filter;
}
.page-dashboard .dash-hero-img:hover {
    filter: grayscale(0) !important;
}
.page-dashboard .dash-heart-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(8px);
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #1B4332;
    transition: color 0.2s;
}
.page-dashboard .dash-heart-btn:hover {
    color: #ef4445;
}
.page-dashboard .dash-overlay-btn {
    width: 100%;
    padding: 16px;
    background: #C9A96E;
    color: #1B4332;
    font-weight: 900;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 4px 16px rgba(201, 169, 110, 0.3);
    transform: translateY(16px);
    transition: transform 0.5s;
    display: block;
    border: none;
    cursor: pointer;
}
.page-dashboard .prod-card:hover .dash-overlay-btn {
    transform: translateY(0);
}
.page-dashboard .dash-prod-name {
    font-size: 16px;
    font-weight: 700;
    color: #1A1A1A;
    transition: color 0.3s;
    cursor: pointer;
}
.page-dashboard .dash-prod-name:hover {
    color: #1B4332;
}
.page-dashboard .dash-table-hover {
    transition: all 0.3s;
    cursor: pointer;
    border: 1px solid transparent;
}
.page-dashboard .dash-table-hover:hover {
    background: #F8F6F0;
    border-color: #E8E4DC;
}
.page-dashboard .dash-rank-name {
    font-size: 15px;
    font-weight: 700;
    color: #1A1A1A;
    transition: color 0.3s;
}
.page-dashboard .dash-rank-name:hover {
    color: #1B4332;
}
.page-dashboard .dash-cat-name {
    font-size: 14px;
    font-weight: 700;
    color: #4A4A4A;
    transition: color 0.3s;
    letter-spacing: 0.02em;
}
.page-dashboard .dash-cat-name:hover {
    color: #1B4332;
}
.page-dashboard .dash-prod-meta {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
}
.page-dashboard .dash-price-cur {
    font-size: 20px;
    font-weight: 900;
    color: #1B4332;
}
.page-dashboard .dash-price-old {
    font-size: 13px;
    color: #8A8A8A;
    text-decoration: line-through;
    text-decoration-color: rgba(201, 169, 110, 0.3);
}
/* === dh: extracted inline === */
.page-dashboard .dh-stat-value {
    font-size: 22px;
    font-weight: 700;
    color: #1A1A1A;
    margin: 4px 0 0;
}
.page-dashboard .dh-stat-label {
    font-size: 10px;
    font-weight: 700;
    color: #8A8A8A;
    text-transform: uppercase;
}
.page-dashboard .dh-hero-title {
    font-size: 60px;
    font-weight: 800;
    color: #fff;
    line-height: 1.1;
    margin: 16px 0;
    letter-spacing: -1.5px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    word-break: break-all;
}
.page-dashboard .dh-hero-desc {
    font-size: 17px;
    color: rgba(248, 246, 240, 0.7);
    line-height: 1.6;
    font-weight: 500;
    max-width: 480px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    word-break: break-all;
}
.page-dashboard .dh-hero-img-wrap {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 45%;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    padding: 48px;
}
.page-dashboard .dh-hero-img-border {
    width: 100%;
    height: 100%;
    border-radius: 32px;
    overflow: hidden;
    border: 1px solid rgba(201, 169, 110, 0.3);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}
.page-dashboard .dh-hero-blob-top {
    position: absolute;
    top: -20%;
    right: -10%;
    width: 60%;
    height: 60%;
    background: rgba(201, 169, 110, 0.04);
    border-radius: 50%;
    filter: blur(120px);
    pointer-events: none;
}
.page-dashboard .dh-hero-blob-bottom {
    position: absolute;
    bottom: -10%;
    left: 10%;
    width: 30%;
    height: 30%;
    background: rgba(45, 106, 79, 0.15);
    border-radius: 50%;
    filter: blur(100px);
    pointer-events: none;
}
.page-dashboard .dh-hero-watermark {
    position: absolute;
    bottom: 40px;
    right: 40px;
    opacity: 0.04;
    pointer-events: none;
    font-size: 120px;
    font-weight: 900;
    color: #fff;
    font-style: italic;
    letter-spacing: -5px;
}
.page-dashboard .dh-welcome-circle {
    position: absolute;
    right: -80px;
    top: -80px;
    width: 320px;
    height: 320px;
    border: 40px solid #F8F6F0;
    border-radius: 50%;
    opacity: 0.5;
}
.page-dashboard .dh-notice-bar {
    position: absolute;
    top: 0;
    right: 0;
    width: 8px;
    height: 100%;
    background: rgba(201, 169, 110, 0.15);
}
.page-dashboard .dh-change-badge {
    font-size: 10px;
    font-weight: 700;
    color: #059669;
    background: #ecfdf5;
    padding: 4px 10px;
    border-radius: 999px;
}
.page-dashboard .dh-qc-label {
    font-size: 10px;
    font-weight: 700;
    color: #C9A96E;
    text-transform: uppercase;
    letter-spacing: 0.3em;
    margin-bottom: 4px;
}
.page-dashboard .dh-label-sm {
    font-size: 11px;
    font-weight: 700;
    color: #8A8A8A;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}
.page-dashboard .dh-review-card {
    background: #F8F6F0;
    padding: 12px 16px;
    border-radius: 16px;
    border: 1px solid rgba(232, 228, 220, 0.5);
}
.page-dashboard .dh-rank-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 24px;
    border-radius: 16px;
}
.page-dashboard .dh-rank-sub {
    font-size: 10px;
    color: #8A8A8A;
    font-weight: 500;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-top: 2px;
}
.page-dashboard .dh-rank-right {
    text-align: right;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
}
.page-dashboard .dh-rank-amount {
    font-size: 20px;
    font-weight: 900;
    color: #1B4332;
}
.page-dashboard .dh-rank-badge {
    display: inline-flex;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    border: 1px solid #E8E4DC;
    color: #8A8A8A;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.page-dashboard .dh-welcome-icon-box {
    width: 160px;
    height: 160px;
    background: #1B4332;
    border-radius: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 32px rgba(27, 67, 50, 0.15);
    flex-shrink: 0;
}
.page-dashboard .dh-divider-line {
    height: 1px;
    flex: 1;
}
.page-dashboard .dh-divider-line-left {
    background: linear-gradient(90deg, transparent, rgba(201, 169, 110, 0.3));
}
.page-dashboard .dh-divider-line-right {
    background: linear-gradient(270deg, transparent, rgba(201, 169, 110, 0.3));
}
@media (max-width: 1023px) {
    .page-dashboard .hero-card {
        min-height: auto;
        padding: 48px 32px;
        border-radius: 24px;
    }
}
.page-dashboard .dh-app {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}
.page-dashboard .dh-container {
    padding: 24px 24px 80px;
}
.page-dashboard .dh-hero-content {
    position: relative;
    z-index: 10;
    max-width: 560px;
}
.page-dashboard .dh-hero-ctas {
    margin-top: 32px;
    display: flex;
    gap: 24px;
}
.page-dashboard .dh-hero-img-fill {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(0.8);
}
.page-dashboard .dh-hero-img-mask {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 30%, #1B4332);
}
.page-dashboard .dh-welcome-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 32px;
    margin-bottom: 64px;
}
.page-dashboard .dh-welcome-inner {
    display: flex;
    align-items: center;
    gap: 40px;
    position: relative;
    z-index: 10;
}
.page-dashboard .dh-welcome-title {
    font-size: 36px;
    font-weight: 900;
    color: #1A1A1A;
    margin: 0;
    letter-spacing: -0.5px;
}
.page-dashboard .dh-welcome-desc {
    font-size: 14px;
    color: #8A8A8A;
    margin-top: 8px;
    font-weight: 500;
}
.page-dashboard .dh-welcome-strong {
    color: #1B4332;
    font-weight: 900;
    text-decoration: underline;
    text-decoration-color: #C9A96E;
    text-underline-offset: 4px;
}
.page-dashboard .dh-welcome-tags {
    display: flex;
    gap: 12px;
    margin-top: 20px;
}
.page-dashboard .dh-notice-inner {
    position: relative;
    z-index: 10;
    display: flex;
    flex-direction: column;
    height: 100%;
}
.page-dashboard .dh-notice-head {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #C9A96E;
    margin-bottom: 12px;
}
.page-dashboard .dh-notice-label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.2em;
}
.page-dashboard .dh-notice-title {
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    margin: 0 0 8px;
}
.page-dashboard .dh-notice-desc {
    font-size: 14px;
    color: rgba(248, 246, 240, 0.55);
    line-height: 1.6;
    flex: 1;
}
.page-dashboard .dh-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
    margin-bottom: 64px;
}
.page-dashboard .dh-stat-icon-box {
    padding: 16px;
    border-radius: 16px;
    transition: all 0.3s;
}
.page-dashboard .dh-stat-deco {
    position: absolute;
    right: -16px;
    bottom: -16px;
    transition: all 0.3s;
}
.page-dashboard .dh-cat-grid {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 24px;
}
.page-dashboard .dh-prod-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
}
.page-dashboard .dh-prod-img-fill {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.page-dashboard .dh-heart-pos {
    position: absolute;
    top: 24px;
    right: 24px;
}
.page-dashboard .dh-prod-info {
    margin-top: 24px;
    text-align: center;
}
.page-dashboard .dh-prod-meta-row {
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: center;
    margin-bottom: 6px;
}
.page-dashboard .dh-dot-sm {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #E8E4DC;
}
.page-dashboard .dh-prod-price-row {
    margin-top: 8px;
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: center;
}
.page-dashboard .dh-divider-row {
    display: flex;
    align-items: center;
    gap: 32px;
    padding: 0 8px;
    margin-bottom: 48px;
}
.page-dashboard .dh-divider-text {
    font-size: 10px;
    font-weight: 700;
    color: #C9A96E;
    text-transform: uppercase;
    letter-spacing: 0.5em;
}
.page-dashboard .dh-main-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    margin-bottom: 40px;
}
.page-dashboard .dh-legend-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
}
.page-dashboard .dh-right-col {
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.page-dashboard .dh-review-box {
    display: flex;
    align-items: center;
    gap: 48px;
    padding: 32px;
}
.page-dashboard .dh-card-title {
    font-size: 20px;
    font-weight: 700;
    color: #1A1A1A;
    margin: 0 0 8px;
}
.page-dashboard .dh-card-desc {
    font-size: 13px;
    color: #8A8A8A;
    margin-bottom: 16px;
}
.page-dashboard .dh-strong {
    color: #1B4332;
    font-weight: 900;
    font-style: italic;
}
.page-dashboard .dh-review-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
.page-dashboard .dh-review-num {
    font-size: 20px;
    font-weight: 900;
    color: #1A1A1A;
    margin-top: 2px;
}
.page-dashboard .dh-avg-time {
    font-size: 24px;
    font-weight: 900;
    color: #1B4332;
}
.page-dashboard .dh-rank-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.page-dashboard .dh-rank-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    font-size: 12px;
}

/* ====== page-products ====== */
.page-products .empty-cell {
    text-align: center;
    padding: 60px;
    color: #9CA3AF;
    font-style: italic;
}
.page-products .p-th {
    font-weight: 700;
    color: #C9A96E;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    text-align: left;
    padding: 24px 16px;
}
.page-products .p-title {
    font-size: 36px;
    font-weight: 700;
    color: #1A1A1A;
    margin: 0;
    letter-spacing: -0.5px;
}
.page-products .p-subtitle {
    font-size: 12px;
    color: #8A8A8A;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    margin: 4px 0 0;
}
.page-products .p-label {
    font-size: 10px;
    font-weight: 700;
    color: #C9A96E;
    text-transform: uppercase;
    letter-spacing: 0.3em;
    margin-bottom: 4px;
}
.page-products .tag-status {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 8px 14px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    border: 1px solid transparent;
    line-height: 1.2;
}
.page-products .tag-green {
    background: #1B4332;
    color: #C9A96E;
    border: none;
}
.page-products .tag-orange {
    background: #C9A96E;
    color: #1B4332;
    border: none;
}
.page-products .tag-red {
    background: #fef2f2;
    color: #dc2626;
    border: 1px solid #fecaca;
}
.page-products .tag-gray {
    background: #F0EFEC;
    color: #4A4A4A;
    border: none;
}
/* === 页面面板 === */
.page-products .p-panel-search {
    background: #fff;
    border: 1px solid #E8E4DC;
    border-radius: 24px;
    padding: 32px;
    margin-bottom: 24px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}
.page-products .p-panel-table {
    background: #fff;
    border: 1px solid #E8E4DC;
    border-radius: 24px;
    overflow: hidden;
    transition: box-shadow 0.2s;
}
.page-products .p-search-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr auto;
    gap: 16px;
    align-items: center;
}
.page-products .p-search-field {
    position: relative;
    height: 36px;
}
/* === 搜索按钮（与 buyers 一致） === */
.page-products .btn-gold-sm {
    height: 36px;
    padding: 0 16px;
    background: #1B4332;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    box-sizing: border-box;
    transition: background 0.2s;
}
.page-products .btn-gold-sm:hover {
    background: #2D6A4F;
}
/* === 商品表格 === */
.page-products .p-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.page-products .p-thead {
    background: #1B4332;
    border: none;
}
.page-products .p-th-r {
    text-align: right;
}
.page-products .p-th-start {
    padding: 24px 0 24px 32px;
}
.page-products .p-th-end {
    padding: 24px 32px 24px 16px;
    text-align: right;
}
.page-products .p-tr {
    border-bottom: 1px solid #E8E4DC;
    transition: all 0.2s;
}
.page-products .p-tr:hover {
    background: #F8F6F0;
}
.page-products .p-td {
    padding: 24px 16px;
}
.page-products .p-td-start {
    padding: 24px 0 24px 32px;
}
.page-products .p-td-r {
    text-align: right;
}
.page-products .p-td-end {
    padding: 24px 32px 24px 16px;
    text-align: right;
}
.page-products .p-prod-thumb {
    width: 64px;
    height: 64px;
    border-radius: 12px;
    background: #F8F6F0;
    overflow: hidden;
    border: 1px solid #E8E4DC;
    flex-shrink: 0;
    transition: border-color 0.3s;
}
.page-products .p-prod-thumb:hover {
    border-color: #C9A96E;
}
.page-products .p-prod-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
}
.page-products .p-prod-thumb:hover img {
    transform: scale(1.1);
}
.page-products .p-prod-name {
    color: #1A1A1A;
    max-width: 220px;
    cursor: pointer;
    transition: color 0.3s;
}
.page-products .p-prod-name:hover {
    color: #1B4332;
}
.page-products .p-sku {
    font-size: 10px;
    color: #8A8A8A;
    font-weight: 500;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-top: 4px;
}
.page-products .p-cat-badge {
    display: inline-flex;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    background: #F8F6F0;
    color: #4A4A4A;
    border: none;
}
.page-products .p-seller-id {
    font-size: 10px;
    color: #8A8A8A;
    text-transform: uppercase;
    letter-spacing: -0.02em;
    margin-top: 2px;
}
.page-products .p-price {
    font-size: 18px;
    font-weight: 900;
    color: #1B4332;
    font-variant-numeric: tabular-nums;
}
.page-products .p-pre-price {
    font-size: 10px;
    color: #8A8A8A;
    text-decoration: line-through;
    text-decoration-color: rgba(201, 169, 110, 0.3);
    font-variant-numeric: tabular-nums;
}
.page-products .p-ch-icon {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
    flex-shrink: 0;
}
.page-products .btn-link-gold {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.page-products .p-btn-down {
    background: none;
    border: none;
    font-size: 11px;
    font-weight: 700;
    color: #8A8A8A;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    cursor: pointer;
    transition: color 0.2s;
}
.page-products .p-btn-down:hover {
    color: #ef4445;
}

/* ====== page-buyers ====== */
.page-buyers .empty-cell {
    text-align: center;
    padding: 60px;
    color: #9CA3AF;
    font-style: italic;
}
.page-buyers .table-hover th {
    font-weight: 700;
    color: #C9A96E;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding: 20px 16px;
}
.page-buyers .tag-status {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 8px 14px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    border: 1px solid transparent;
    line-height: 1.2;
}
.page-buyers .status-completed {
    background: #1B4332;
    color: #C9A96E;
    border: none;
}
.page-buyers .status-pending {
    background: #C9A96E;
    color: #1B4332;
    border: none;
}
.page-buyers .status-progress {
    background: #F0EFEC;
    color: #4A4A4A;
    border: none;
}
.page-buyers .btn-gold-sm {
    height: 36px;
    padding: 0 16px;
    background: #1B4332;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    box-sizing: border-box;
    transition: background 0.2s;
}
.page-buyers .btn-gold-sm:hover {
    background: #2D6A4F;
}
.page-buyers .btn-outline-sm {
    height: 36px;
    padding: 0 16px;
    background: transparent;
    color: #8A8A8A;
    border: 1px solid #E8E4DC;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    box-sizing: border-box;
    transition: all 0.2s;
}
.page-buyers .btn-outline-sm:hover {
    background: #F8F6F0;
}
.page-buyers .btn-link-gold {
    background: none;
    border: none;
    color: #C9A96E;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    text-decoration: none;
    transition: color 0.2s;
}
.page-buyers .btn-link-gold:hover {
    color: #1B4332;
}
/* === 页面头部 === */
.page-buyers .b-page-subtitle {
    font-size: 12px;
    color: #8A8A8A;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    margin: 4px 0 0;
}
.page-buyers .btn-export {
    height: 40px;
    padding: 0 24px;
    background: transparent;
    color: #C9A96E;
    border: 1px solid rgba(201, 169, 110, 0.3);
    border-radius: 9999px;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s;
}
.page-buyers .btn-export:hover {
    background: #C9A96E;
    color: #1B4332;
}
/* === 统计卡片 === */
.page-buyers .b-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 24px;
}
.page-buyers .b-stat-card {
    background: #fff;
    border: 1px solid #E8E4DC;
    border-radius: 16px;
    overflow: hidden;
    position: relative;
    transition: all 0.25s;
}
.page-buyers .b-stat-card:hover {
    box-shadow: 0 4px 12px rgba(27, 67, 50, 0.08);
}
.page-buyers .b-stat-corner {
    position: absolute;
    top: 0;
    right: 0;
    width: 64px;
    height: 64px;
    background: linear-gradient(135deg, rgba(27, 67, 50, 0.04), transparent);
    border-radius: 0 0 0 64px;
}
.page-buyers .b-stat-body {
    padding: 20px 24px;
    display: flex;
    align-items: center;
    gap: 16px;
}
.page-buyers .b-stat-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.page-buyers .b-stat-label {
    font-size: 10px;
    font-weight: 700;
    color: #8A8A8A;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 4px;
}
/* === 订单表格 === */
.page-buyers .b-th-start {
    padding: 20px 0 20px 24px;
}
.page-buyers .b-th-r {
    text-align: right;
}
.page-buyers .b-th-c {
    text-align: center;
}
.page-buyers .b-th-end {
    padding: 20px 24px 20px 16px;
    text-align: right;
}
.page-buyers .b-tr {
    border-bottom: 1px solid #E8E4DC;
    transition: background 0.15s;
}
.page-buyers .b-tr:hover {
    background: #F8F6F0;
}
.page-buyers .b-td {
    padding: 16px;
}
.page-buyers .b-td-start {
    padding: 16px 0 16px 24px;
}
.page-buyers .b-td-r {
    text-align: right;
}
.page-buyers .b-td-c {
    text-align: center;
}
.page-buyers .b-td-end {
    padding: 16px 24px 16px 16px;
    text-align: right;
}
.page-buyers .b-td-mono {
    font-size: 10px;
    color: #8A8A8A;
    font-family: monospace;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    margin-top: 2px;
}
.page-buyers .b-order-img {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    object-fit: cover;
    border: 1px solid #E8E4DC;
}
.page-buyers .b-prod-name {
    font-size: 12px;
    font-weight: 700;
    color: #4A4A4A;
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.page-buyers .b-ch-wrap {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
    color: #4A4A4A;
}
.page-buyers .b-ch-icon {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    border: 1px solid rgba(0, 0, 0, 0.04);
    flex-shrink: 0;
}
.page-buyers .b-amount {
    font-size: 16px;
    font-weight: 900;
    color: #C9A96E;
    font-variant-numeric: tabular-nums;
}
/* === 加载中 === */
.page-buyers .b-loading {
    position: absolute;
    top: 55px;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
}
.page-buyers .b-loading-spinner {
    width: 24px;
    height: 24px;
    border: 3px solid #E8E4DC;
    border-top-color: #1B4332;
    border-radius: 50%;
    animation: b-spin 0.8s linear infinite;
}
@keyframes b-spin {
    to {
        transform: rotate(360deg);
    }
}
.page-buyers .b-scroll-loading {
    min-height: 240px;
}

/* ====== page-sellers ====== */
.page-sellers .empty-cell {
    text-align: center;
    padding: 60px;
    color: #9CA3AF;
    font-style: italic;
}
/* === 搜索按钮（与 buyers 一致） === */
.page-sellers .btn-gold-sm {
    height: 36px;
    padding: 0 16px;
    background: #1B4332;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    box-sizing: border-box;
    transition: background 0.2s;
}
.page-sellers .btn-gold-sm:hover {
    background: #2D6A4F;
}
/* === 页面头部 === */
.page-sellers .s-eyebrow {
    font-size: 10px;
    font-weight: 700;
    color: #C9A96E;
    text-transform: uppercase;
    letter-spacing: 0.3em;
    margin-bottom: 4px;
}
.page-sellers .s-subtitle {
    font-size: 12px;
    color: #8A8A8A;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    margin: 4px 0 0;
}
/* === 设计师表格 === */
.page-sellers .s-th {
    font-weight: 700;
    color: #C9A96E;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding: 20px 16px;
    text-align: left;
}
.page-sellers .s-th-start {
    padding: 20px 0 20px 24px;
}
.page-sellers .s-th-r {
    text-align: right;
}
.page-sellers .s-th-c {
    text-align: center;
}
.page-sellers .s-th-end {
    padding: 20px 24px 20px 16px;
    text-align: right;
}
.page-sellers .s-tr {
    border-bottom: 1px solid #E8E4DC;
    transition: all 0.2s;
}
.page-sellers .s-td {
    padding: 24px 16px;
}
.page-sellers .s-td-start {
    padding: 24px 0 24px 24px;
}
.page-sellers .s-td-r {
    text-align: right;
}
.page-sellers .s-td-c {
    text-align: center;
}
.page-sellers .s-td-end {
    padding: 24px 24px 24px 16px;
    text-align: right;
}
.page-sellers .s-avatar {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    background: #1B4332;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #C9A96E;
    font-weight: 900;
    font-size: 16px;
    font-style: italic;
    transition: transform 0.3s;
    box-shadow: 0 4px 12px rgba(27, 67, 50, 0.1);
    overflow: hidden;
}
.page-sellers .s-name {
    color: #1A1A1A;
    transition: color 0.3s;
}
.page-sellers .s-name:hover {
    color: #1B4332;
}
.page-sellers .s-meta {
    font-size: 10px;
    color: #8A8A8A;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-top: 2px;
}
.page-sellers .s-entity {
    font-size: 10px;
    color: #8A8A8A;
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 2px;
}
.page-sellers .s-prods {
    font-size: 14px;
    font-weight: 700;
    color: #1A1A1A;
    font-variant-numeric: tabular-nums;
}
.page-sellers .s-sales {
    font-size: 15px;
    font-weight: 900;
    color: #1B4332;
    font-variant-numeric: tabular-nums;
}

/* ====== page-rules ====== */
.page-rules .rules-publish-btn {
    height:48px;
    padding:0 32px;
    background:#1B4332;
    color:#C9A96E;
    border:none;
    border-radius:9999px;
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.1em;
    cursor:pointer;
    display:inline-flex;
    align-items:center;
    gap:8px;
    box-shadow:0 4px 12px rgba(27,67,50,0.2);
    transition:all 0.2s;
}
.page-rules .rules-publish-btn:hover {
    background:#2D6A4F;
}
.page-rules .rules-table-card {
    background:#fff;
    border-radius:16px;
    border:1px solid #E8E4DC;
    overflow:hidden;
    transition:box-shadow 0.2s;
}
.page-rules .rules-table-card:hover {
    box-shadow:0 4px 12px rgba(0,0,0,0.04);
}
.page-rules .empty-cell {
    text-align: center;
    padding: 60px;
    color: #9CA3AF;
    font-style: italic;
}

/* ====== page-messages ====== */
.page-messages .msg-card {
    display: flex;
    gap: 16px;
    padding: 20px;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #E8E4DC;
    margin-bottom: 12px;
    cursor: pointer;
    transition: all 0.2s;
}
.page-messages .msg-card:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    border-color: #d5d0c8;
}
.page-messages .msg-card.unread {
    border-left: 3px solid #C9A96E;
}
.page-messages .tab-bar {
    display: inline-flex;
    gap: 4px;
    padding: 4px;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #E8E4DC;
    margin-bottom: 24px;
}
.page-messages .tab-btn {
    padding: 8px 20px;
    border-radius: 8px;
    font-size: 13px;
    cursor: pointer;
    border: none;
    background: transparent;
    color: #6B7280;
    font-weight: 500;
    transition: all 0.2s;
}
.page-messages .tab-btn.active {
    background: #1B4332;
    color: #fff;
}
.page-messages .empty-state {
    text-align: center;
    padding: 60px 0;
    color: #9CA3AF;
}

/* ====== page-product-detail ====== */
.page-product-detail .empty-cell {
    text-align: center;
    padding: 60px;
    color: #9CA3AF;
    font-style: italic;
}
.page-product-detail .back-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #8A8A8A;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    text-decoration: none;
    transition: color 0.2s;
    margin-bottom: 32px;
}
.page-product-detail .img-main-wrap {
    aspect-ratio: 4/5;
    border-radius: 40px;
    overflow: hidden;
    background: #F0EFEC;
    border: 1px solid #E8E4DC;
    box-shadow: 0 20px 30px -10px rgba(0, 0, 0, 0.04);
    position: relative;
}
.page-product-detail .detail-main-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s;
}
.page-product-detail .img-actions {
    position: absolute;
    top: 32px;
    right: 32px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.page-product-detail .icon-btn-round {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(8px);
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #1B4332;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    cursor: pointer;
    transition: all 0.3s;
}
.page-product-detail .thumb-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-top: 24px;
}
.page-product-detail .thumb-item {
    aspect-ratio: 1;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid #E8E4DC;
    background: #F0EFEC;
    cursor: pointer;
    transition: opacity 0.2s;
}
.page-product-detail .thumb-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.page-product-detail .detail-right {
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.page-product-detail .detail-header {
    margin-bottom: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.page-product-detail .detail-sku {
    font-size: 10px;
    font-weight: 700;
    color: #8A8A8A;
    text-transform: uppercase;
    letter-spacing: 0.2em;
}
.page-product-detail .detail-title {
    font-size: 48px;
    font-weight: 800;
    color: #1A1A1A;
    margin: 0;
    line-height: 1.2;
    letter-spacing: -1px;
}
.page-product-detail .detail-desc {
    font-size: 18px;
    color: #4A4A4A;
    line-height: 1.6;
    font-weight: 500;
    margin: 0;
}
.page-product-detail .price-card {
    padding: 40px;
    border-radius: 40px;
    background: #1B4332;
    color: #fff;
    position: relative;
    overflow: hidden;
    box-shadow: 0 20px 30px -10px rgba(27, 67, 50, 0.2);
    border: 1px solid rgba(201, 169, 110, 0.2);
    margin-bottom: 24px;
}
.page-product-detail .price-row {
    display: flex;
    align-items: flex-end;
    gap: 16px;
    position: relative;
    z-index: 10;
    margin-bottom: 32px;
}
.page-product-detail .price-current {
    font-size: 48px;
    font-weight: 900;
    color: #C9A96E;
    font-variant-numeric: tabular-nums;
}
.page-product-detail .price-original {
    font-size: 20px;
    color: rgba(248, 246, 240, 0.4);
    text-decoration: line-through;
    text-decoration-color: rgba(201, 169, 110, 0.4);
    margin-bottom: 4px;
    font-variant-numeric: tabular-nums;
}
.page-product-detail .price-meta {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    position: relative;
    z-index: 10;
    margin-bottom: 24px;
}
.page-product-detail .meta-label {
    font-size: 10px;
    font-weight: 700;
    color: #C9A96E;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    margin: 0 0 4px;
}
.page-product-detail .meta-value {
    font-size: 18px;
    font-weight: 700;
    margin: 0;
}
.page-product-detail .btn-cta-lg-gold {
    width: 100%;
    height: 64px;
    background: #C9A96E;
    color: #1B4332;
    border: none;
    border-radius: 16px;
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.3em;
    cursor: pointer;
    position: relative;
    z-index: 10;
    box-shadow: 0 8px 24px rgba(201, 169, 110, 0.2);
    transition: all 0.2s;
}
.page-product-detail .price-card-watermark {
    position: absolute;
    top: 40px;
    right: -20px;
    opacity: 0.05;
    pointer-events: none;
    font-size: 80px;
    font-weight: 900;
    font-style: italic;
    letter-spacing: -3px;
    color: #fff;
}
.page-product-detail .trust-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.page-product-detail .trust-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 24px;
    border-radius: 16px;
    background: #F0EFEC;
    border: 1px solid rgba(232, 228, 220, 0.5);
}
.page-product-detail .trust-label {
    font-size: 10px;
    font-weight: 900;
    color: #1A1A1A;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}
.page-product-detail .tag-category {
    padding: 6px 16px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    border: none;
}

/* ====== page-seller-home ====== */
.page-seller-home .empty-cell {
    text-align: center;
    padding: 60px;
    color: #9CA3AF;
    font-style: italic;
}
.page-seller-home .tag-status {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    border: 1px solid transparent;
    line-height: 1.2;
}
.page-seller-home .tag-green {
    background: #1B4332;
    color: #C9A96E;
    border: none;
}
.page-seller-home .tag-orange {
    background: #C9A96E;
    color: #1B4332;
    border: none;
}
.page-seller-home .tag-gray {
    background: #F0EFEC;
    color: #4A4A4A;
    border: none;
}
.page-seller-home .tag-type-company {
    display: inline-flex;
    padding: 4px 16px;
    border-radius: 999px;
    background: #C9A96E;
    color: #1B4332;
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}
.page-seller-home .tag-verified {
    display: inline-flex;
    padding: 4px 14px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    background: #ecfdf5;
    color: #059669;
    border: 1px solid #a7f3d0;
}
.page-seller-home .tag-settled {
    display: inline-flex;
    padding: 4px 14px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.05em;
    background: #ecfdf5;
    color: #059669;
    border: 1px solid #a7f3d0;
}
.page-seller-home .btn-primary {
    height: 48px;
    padding: 0 40px;
    background: #1B4332;
    color: #C9A96E;
    border: none;
    border-radius: 9999px;
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: background 0.2s;
}
.page-seller-home .btn-primary:hover {
    background: #2D6A4F;
}
.page-seller-home .btn-secondary {
    height: 48px;
    padding: 0 40px;
    background: #fff;
    color: #1B4332;
    border: 1px solid #E8E4DC;
    border-radius: 9999px;
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.2s;
}
.page-seller-home .btn-secondary:hover {
    background: #F8F6F0;
}
.page-seller-home .btn-outline {
    width: 100%;
    height: 48px;
    margin-top: 24px;
    border-radius: 12px;
    border: 1px solid #E8E4DC;
    background: transparent;
    color: #8A8A8A;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    cursor: pointer;
    transition: all 0.2s;
}
.page-seller-home .btn-outline:hover {
    background: #1B4332;
    color: #C9A96E;
    border-color: #1B4332;
}
/* === Patterns from spec === */
.page-seller-home .sh-label {
    font-size: 12px;
    font-weight: 700;
    color: #8A8A8A;
    text-transform: uppercase;
    letter-spacing: 0.1em;
}
.page-seller-home .sh-label-xs {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.15em;
}
.page-seller-home .sh-th {
    font-weight: 700;
    color: #1B4332;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    padding: 24px 24px;
    text-align: left;
}
.page-seller-home .sh-th-sm {
    font-weight: 700;
    color: #1B4332;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    padding: 20px 24px;
    text-align: left;
}
.page-seller-home .sh-section-title {
    font-size: 18px;
    font-weight: 700;
    color: #1A1A1A;
    margin: 0;
}
.page-seller-home .sh-value {
    font-size: 13px;
    font-weight: 700;
    color: #1A1A1A;
}
.page-seller-home .sh-stat {
    font-size: 12px;
    font-weight: 900;
    color: #1A1A1A;
}
.page-seller-home .sh-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    opacity: 0;
    transition: opacity 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* === Additional repeated patterns (2+ occurrences) === */
.page-seller-home .sh-subtitle {
    font-size: 10px;
    font-weight: 700;
    color: #8A8A8A;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin: 2px 0 0;
}
.page-seller-home .sh-card-label {
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    margin: 0;
}
.page-seller-home .sh-card-table {
    background: #fff;
    border-radius: 40px;
    border: 1px solid #E8E4DC;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}
.page-seller-home .sh-card-qual {
    background: #fff;
    border-radius: 40px;
    border: 1px solid #E8E4DC;
    padding: 40px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}
.page-seller-home .sh-section-divider {
    border-bottom: 1px solid #F0EFEC;
    padding-bottom: 24px;
}
.page-seller-home .sh-img-card {
    aspect-ratio: 4/3;
    border-radius: 16px;
    background: #F8F6F0;
    border: 1px solid #E8E4DC;
    overflow: hidden;
    position: relative;
    cursor: pointer;
}
.page-seller-home .sh-img-fade {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.6;
    transition: opacity 0.3s;
}
/* === One-off long inline styles (>80 chars) === */
.page-seller-home .sh-back-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #8A8A8A;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    text-decoration: none;
    transition: color 0.2s;
    margin-bottom: 32px;
}
.page-seller-home .sh-tab-container {
    display: flex;
    background: #fff;
    border: 1px solid #E8E4DC;
    border-radius: 9999px;
    padding: 6px;
    width: fit-content;
    margin-bottom: 40px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}
.page-seller-home .sh-tab-btn {
    padding: 12px 40px;
    border-radius: 9999px;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    cursor: pointer;
    border: none;
    transition: all 0.2s;
}
.page-seller-home .sh-stat-card {
    background: #fff;
    padding: 32px;
    border-radius: 40px;
    border: 1px solid #E8E4DC;
    position: relative;
    overflow: hidden;
    transition: all 0.3s;
}
.page-seller-home .sh-prod-card {
    background: #fff;
    border-radius: 32px;
    border: 1px solid #E8E4DC;
    overflow: hidden;
    transition: all 0.5s;
    cursor: pointer;
}
.page-seller-home .sh-prod-cat {
    font-size: 10px;
    font-weight: 700;
    color: #C9A96E;
    text-transform: uppercase;
    letter-spacing: 0.15em;
}
.page-seller-home .sh-prod-sales {
    font-size: 10px;
    font-weight: 700;
    color: #8A8A8A;
    text-transform: uppercase;
    letter-spacing: 0.15em;
}
/* === Additional one-off long inline styles === */
.page-seller-home .sh-avatar {
    width: 96px;
    height: 96px;
    border-radius: 32px;
    background: #1B4332;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #C9A96E;
    box-shadow: 0 20px 30px -10px rgba(27, 67, 50, 0.2);
    border: 1px solid rgba(201, 169, 110, 0.2);
    overflow: hidden;
}
.page-seller-home .sh-name-title {
    font-size: 36px;
    font-weight: 900;
    color: #1A1A1A;
    margin: 0;
    letter-spacing: -0.5px;
}
.page-seller-home .sh-deco-icon {
    position: absolute;
    right: -16px;
    bottom: -16px;
    opacity: 0.04;
    transform: rotate(-12deg);
    pointer-events: none;
    transition: opacity 0.3s;
}
.page-seller-home .sh-stat-value {
    font-size: 36px;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
    letter-spacing: -1px;
}
.page-seller-home .sh-img-label {
    font-size: 10px;
    font-weight: 900;
    color: #1B4332;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    margin: 0 0 12px;
}
.page-seller-home .sh-icon-circle {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.page-seller-home .sh-settlement-id {
    padding: 24px 0 24px 40px;
    font-size: 13px;
    font-weight: 700;
    color: #1A1A1A;
    font-variant-numeric: tabular-nums;
}
.page-seller-home .sh-qual-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    padding-top: 24px;
    border-top: 1px solid #F0EFEC;
}
.page-seller-home .sh-protocol-title {
    font-size: 12px;
    font-weight: 900;
    color: #1B4332;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
}
.page-seller-home .sh-meta-text {
    font-size: 10px;
    color: #8A8A8A;
    font-weight: 500;
    margin-top: 2px;
}
.page-seller-home .sh-amount {
    font-size: 14px;
    font-weight: 900;
    color: #1B4332;
}
.page-seller-home .sh-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.page-seller-home .sh-td-center {
    padding: 24px;
    text-align: center;
}
/* === 图片大图预览 === */
.page-seller-home .sh-viewer {
    position: fixed;
    inset: 0;
    z-index: 999;
    background: rgba(0, 0, 0, 0.85);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: zoom-out;
}
.page-seller-home .sh-viewer img {
    max-width: 90vw;
    max-height: 90vh;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}
.page-seller-home .sh-viewer-close {
    position: absolute;
    top: 24px;
    right: 24px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.3);
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s;
}
.page-seller-home .sh-viewer-close:hover {
    background: rgba(255, 255, 255, 0.25);
}
/* === 经营概况 === */
.page-seller-home .s3-rev-header {
    padding: 32px 40px;
    border-bottom: 1px solid #F0EFEC;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.page-seller-home .s3-rev-grid {
    display: flex;
    flex-direction: row;
}
.page-seller-home .s3-rev-item {
    flex: 1;
    padding: 40px 24px;
    text-align: center;
}
.page-seller-home .s3-rev-item + .s3-rev-item {
    border-left: 1px solid #F0EFEC;
}
.page-seller-home .s3-rev-value {
    font-size: 32px;
    font-weight: 900;
    color: #1A1A1A;
    font-variant-numeric: tabular-nums;
    margin-top: 8px;
    letter-spacing: -0.5px;
}
.page-seller-home .s3-month-picker {
    width: 150px;
    --el-input-height: 36px;
    --el-input-border-radius: 12px;
    --el-input-border-color: #E8E4DC;
    --el-input-hover-border-color: #1B4332;
    --el-input-focus-border-color: #1B4332;
}
.page-seller-home .s3-month-picker .el-input__inner {
    font-size: 13px;
    font-weight: 700;
    color: #4A4A4A;
}
.page-seller-home .el-picker-panel {
    --el-color-primary: #1B4332;
    --el-color-primary-light-3: #4d715f;
    --el-color-primary-light-5: #7d9c8e;
    --el-color-primary-light-7: #b6c9bf;
    --el-color-primary-light-8: #d2dfd8;
    --el-color-primary-light-9: #ebf0ed;
    --el-color-primary-dark-2: #123326;
    --el-border-radius-base: 12px;
}

