编辑页面

HTML内容
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>玩具商城 - ToyMall</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        
        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
            background: #f5f5f5;
            max-width: 430px;
            margin: 0 auto;
            min-height: 100vh;
            position: relative;
        }
        
        /* 页面容器 */
        .page {
            display: none;
            min-height: 100vh;
            background: #f5f5f5;
            padding-bottom: 70px;
        }
        
        .page.active {
            display: block;
        }
        
        /* 顶部导航 */
        .header {
            background: linear-gradient(135deg, #FF6B6B 0%, #FF8E53 100%);
            color: #fff;
            padding: 15px 16px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            position: sticky;
            top: 0;
            z-index: 100;
        }
        
        .header-left {
            display: flex;
            align-items: center;
            gap: 10px;
        }
        
        .header-back {
            font-size: 24px;
            cursor: pointer;
            width: 30px;
            height: 30px;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        
        .header-title {
            font-size: 18px;
            font-weight: 600;
        }
        
        .header-search {
            flex: 1;
            margin: 0 15px;
            position: relative;
        }
        
        .header-search input {
            width: 100%;
            padding: 8px 35px 8px 15px;
            border: none;
            border-radius: 20px;
            background: rgba(255,255,255,0.3);
            color: #fff;
            font-size: 14px;
        }
        
        .header-search input::placeholder {
            color: rgba(255,255,255,0.8);
        }
        
        .header-search-icon {
            position: absolute;
            right: 10px;
            top: 50%;
            transform: translateY(-50%);
            font-size: 18px;
        }
        
        .header-right {
            font-size: 20px;
            cursor: pointer;
        }
        
        /* 首页内容 */
        .home-banner {
            width: 100%;
            height: 160px;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            position: relative;
            overflow: hidden;
        }
        
        .banner-slider {
            display: flex;
            transition: transform 0.3s ease;
        }
        
        .banner-item {
            min-width: 100%;
            height: 160px;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
            color: #fff;
        }
        
        .banner-content {
            padding: 20px;
        }
        
        .banner-title {
            font-size: 24px;
            font-weight: bold;
            margin-bottom: 8px;
        }
        
        .banner-subtitle {
            font-size: 14px;
            opacity: 0.9;
        }
        
        .banner-dots {
            position: absolute;
            bottom: 10px;
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            gap: 8px;
        }
        
        .banner-dot {
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background: rgba(255,255,255,0.5);
        }
        
        .banner-dot.active {
            background: #fff;
        }
        
        /* 分类导航 */
        .category-nav {
            display: flex;
            overflow-x: auto;
            padding: 15px;
            gap: 15px;
            background: #fff;
        }
        
        .category-item {
            min-width: 60px;
            text-align: center;
            cursor: pointer;
        }
        
        .category-icon {
            width: 50px;
            height: 50px;
            border-radius: 12px;
            background: linear-gradient(135deg, #ffeaa7 0%, #fdcb6e 100%);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 24px;
            margin: 0 auto 8px;
        }
        
        .category-item:nth-child(2) .category-icon {
            background: linear-gradient(135deg, #74b9ff 0%, #0984e3 100%);
        }
        
        .category-item:nth-child(3) .category-icon {
            background: linear-gradient(135deg, #a29bfe 0%, #6c5ce7 100%);
        }
        
        .category-item:nth-child(4) .category-icon {
            background: linear-gradient(135deg, #fd79a8 0%, #e84393 100%);
        }
        
        .category-item:nth-child(5) .category-icon {
            background: linear-gradient(135deg, #55efc4 0%, #00b894 100%);
        }
        
        .category-item:nth-child(6) .category-icon {
            background: linear-gradient(135deg, #fdcb6e 0%, #e17055 100%);
        }
        
        .category-name {
            font-size: 12px;
            color: #666;
        }
        
        /* 商品区域 */
        .section {
            padding: 15px;
        }
        
        .section-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 12px;
        }
        
        .section-title {
            font-size: 16px;
            font-weight: 600;
            color: #333;
        }
        
        .section-more {
            font-size: 12px;
            color: #999;
            cursor: pointer;
        }
        
        .product-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 12px;
        }
        
        .product-card {
            background: #fff;
            border-radius: 12px;
            overflow: hidden;
            box-shadow: 0 2px 8px rgba(0,0,0,0.06);
            cursor: pointer;
            transition: transform 0.2s;
        }
        
        .product-card:active {
            transform: scale(0.98);
        }
        
        .product-image {
            width: 100%;
            height: 150px;
            background: #f0f0f0;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 48px;
        }
        
        .product-info {
            padding: 10px;
        }
        
        .product-name {
            font-size: 14px;
            color: #333;
            line-height: 1.4;
            height: 40px;
            overflow: hidden;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }
        
        .product-price {
            color: #ff4757;
            font-size: 16px;
            font-weight: 600;
            margin-top: 8px;
        }
        
        .product-price span {
            font-size: 12px;
        }
        
        .product-sales {
            font-size: 11px;
            color: #999;
            margin-top: 4px;
        }
        
        /* 商品详情页 */
        .detail-swiper {
            width: 100%;
            height: 300px;
            background: #fff;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 80px;
        }
        
        .detail-content {
            padding: 15px;
            background: #fff;
        }
        
        .detail-price-row {
            display: flex;
            align-items: baseline;
            gap: 10px;
        }
        
        .detail-price {
            color: #ff4757;
            font-size: 24px;
            font-weight: 600;
        }
        
        .detail-original-price {
            color: #999;
            font-size: 14px;
            text-decoration: line-through;
        }
        
        .detail-title {
            font-size: 16px;
            color: #333;
            line-height: 1.5;
            margin-top: 12px;
        }
        
        .detail-desc {
            font-size: 13px;
            color: #666;
            margin-top: 8px;
            line-height: 1.6;
        }
        
        .detail-tags {
            display: flex;
            gap: 8px;
            margin-top: 12px;
        }
        
        .detail-tag {
            padding: 4px 8px;
            background: #fff0f0;
            color: #ff4757;
            border-radius: 4px;
            font-size: 11px;
        }
        
        .detail-specs {
            margin-top: 15px;
            padding: 15px;
            background: #f9f9f9;
            border-radius: 8px;
        }
        
        .detail-specs-title {
            font-size: 14px;
            color: #333;
            margin-bottom: 10px;
        }
        
        .spec-options {
            display: flex;
            gap: 10px;
            flex-wrap: wrap;
        }
        
        .spec-option {
            padding: 6px 15px;
            border: 1px solid #ddd;
            border-radius: 20px;
            font-size: 13px;
            cursor: pointer;
            transition: all 0.2s;
        }
        
        .spec-option.active {
            border-color: #ff4757;
            background: #fff0f0;
            color: #ff4757;
        }
        
        .detail-shop {
            display: flex;
            align-items: center;
            padding: 15px;
            background: #fff;
            margin-top: 10px;
            gap: 12px;
        }
        
        .shop-avatar {
            width: 50px;
            height: 50px;
            border-radius: 8px;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            display: flex;
            align-items: center;
            justify-content: center;
            color: #fff;
            font-size: 24px;
        }
        
        .shop-info {
            flex: 1;
        }
        
        .shop-name {
            font-size: 15px;
            color: #333;
            font-weight: 500;
        }
        
        .shop-tags {
            font-size: 11px;
            color: #999;
            margin-top: 4px;
        }
        
        .detail-params {
            padding: 15px;
            background: #fff;
            margin-top: 10px;
        }
        
        .param-item {
            display: flex;
            padding: 10px 0;
            border-bottom: 1px solid #f5f5f5;
            font-size: 13px;
        }
        
        .param-label {
            color: #999;
            width: 80px;
        }
        
        .param-value {
            color: #333;
            flex: 1;
        }
        
        /* 底部操作栏 */
        .action-bar {
            position: fixed;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 100%;
            max-width: 430px;
            background: #fff;
            display: flex;
            align-items: center;
            padding: 10px 15px;
            box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
            z-index: 100;
        }
        
        .action-icon-btn {
            display: flex;
            flex-direction: column;
            align-items: center;
            margin-right: 20px;
            cursor: pointer;
        }
        
        .action-icon-btn span {
            font-size: 22px;
        }
        
        .action-icon-btn small {
            font-size: 10px;
            color: #666;
            margin-top: 2px;
        }
        
        .action-buttons {
            flex: 1;
            display: flex;
            gap: 10px;
        }
        
        .btn-add-cart {
            flex: 1;
            padding: 12px;
            background: linear-gradient(135deg, #ffa502 0%, #ff6348 100%);
            color: #fff;
            border: none;
            border-radius: 20px;
            font-size: 14px;
            cursor: pointer;
        }
        
        .btn-buy-now {
            flex: 1;
            padding: 12px;
            background: linear-gradient(135deg, #ff4757 0%, #ff6b81 100%);
            color: #fff;
            border: none;
            border-radius: 20px;
            font-size: 14px;
            cursor: pointer;
        }
        
        /* 购物车页 */
        .cart-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 15px;
            background: #fff;
        }
        
        .cart-edit-btn {
            color: #ff4757;
            font-size: 14px;
            cursor: pointer;
        }
        
        .cart-list {
            padding: 0 15px;
        }
        
        .cart-shop {
            margin-top: 15px;
        }
        
        .cart-shop-header {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 10px 0;
        }
        
        .cart-shop-icon {
            font-size: 20px;
        }
        
        .cart-shop-name {
            font-size: 14px;
            color: #333;
            font-weight: 500;
        }
        
        .cart-item {
            display: flex;
            background: #fff;
            border-radius: 12px;
            padding: 12px;
            margin-top: 10px;
            gap: 12px;
            position: relative;
        }
        
        .cart-item.checked .cart-check {
            background: #ff4757;
            border-color: #ff4757;
        }
        
        .cart-item.checked .cart-check::after {
            content: '✓';
            color: #fff;
            font-size: 12px;
        }
        
        .cart-check {
            width: 22px;
            height: 22px;
            border: 2px solid #ddd;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            align-self: center;
        }
        
        .cart-item-image {
            width: 80px;
            height: 80px;
            background: #f0f0f0;
            border-radius: 8px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 36px;
        }
        
        .cart-item-info {
            flex: 1;
        }
        
        .cart-item-name {
            font-size: 14px;
            color: #333;
            line-height: 1.4;
        }
        
        .cart-item-spec {
            font-size: 12px;
            color: #999;
            margin-top: 4px;
        }
        
        .cart-item-bottom {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-top: 8px;
        }
        
        .cart-item-price {
            color: #ff4757;
            font-size: 15px;
            font-weight: 600;
        }
        
        .quantity-control {
            display: flex;
            align-items: center;
            gap: 0;
        }
        
        .quantity-btn {
            width: 28px;
            height: 28px;
            border: 1px solid #ddd;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 14px;
            cursor: pointer;
            background: #fff;
        }
        
        .quantity-btn:first-child {
            border-radius: 4px 0 0 4px;
        }
        
        .quantity-btn:last-child {
            border-radius: 0 4px 4px 0;
        }
        
        .quantity-num {
            width: 35px;
            height: 28px;
            border: 1px solid #ddd;
            border-left: none;
            border-right: none;
            text-align: center;
            line-height: 28px;
            font-size: 14px;
        }
        
        .cart-bottom {
            position: fixed;
            bottom: 60px;
            left: 50%;
            transform: translateX(-50%);
            width: 100%;
            max-width: 430px;
            background: #fff;
            padding: 12px 15px;
            display: flex;
            align-items: center;
            box-shadow: 0 -2px 10px rgba(0,0,0,0.05);
            z-index: 99;
        }
        
        .cart-all-check {
            display: flex;
            align-items: center;
            gap: 8px;
            cursor: pointer;
        }
        
        .cart-all-check .cart-check {
            width: 22px;
            height: 22px;
        }
        
        .cart-all-check.all-checked .cart-check {
            background: #ff4757;
            border-color: #ff4757;
        }
        
        .cart-all-check.all-checked .cart-check::after {
            content: '✓';
            color: #fff;
            font-size: 12px;
        }
        
        .cart-total {
            flex: 1;
            margin-left: 15px;
        }
        
        .cart-total-price {
            color: #ff4757;
            font-size: 18px;
            font-weight: 600;
        }
        
        .cart-settle-btn {
            padding: 10px 25px;
            background: linear-gradient(135deg, #ff4757 0%, #ff6b81 100%);
            color: #fff;
            border: none;
            border-radius: 20px;
            font-size: 14px;
            cursor: pointer;
        }
        
        /* 订单确认页 */
        .order-address {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            padding: 20px 15px;
            color: #fff;
            cursor: pointer;
        }
        
        .address-content {
            display: flex;
            align-items: center;
        }
        
        .address-icon {
            font-size: 28px;
            margin-right: 12px;
        }
        
        .address-info {
            flex: 1;
        }
        
        .address-name {
            font-size: 16px;
            font-weight: 500;
        }
        
        .address-tel {
            font-size: 14px;
            margin-top: 4px;
            opacity: 0.9;
        }
        
        .address-detail {
            font-size: 13px;
            margin-top: 6px;
            opacity: 0.85;
        }
        
        .address-arrow {
            font-size: 20px;
            opacity: 0.7;
        }
        
        .order-items {
            background: #fff;
            margin-top: 10px;
        }
        
        .order-shop {
            display: flex;
            align-items: center;
            padding: 12px 15px;
            border-bottom: 1px solid #f5f5f5;
            gap: 10px;
        }
        
        .order-shop-icon {
            font-size: 18px;
        }
        
        .order-shop-name {
            font-size: 14px;
            color: #333;
        }
        
        .order-item {
            display: flex;
            padding: 12px 15px;
            gap: 12px;
            border-bottom: 1px solid #f5f5f5;
        }
        
        .order-item:last-child {
            border-bottom: none;
        }
        
        .order-item-image {
            width: 70px;
            height: 70px;
            background: #f0f0f0;
            border-radius: 8px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 32px;
        }
        
        .order-item-info {
            flex: 1;
        }
        
        .order-item-name {
            font-size: 14px;
            color: #333;
            line-height: 1.4;
        }
        
        .order-item-spec {
            font-size: 12px;
            color: #999;
            margin-top: 4px;
        }
        
        .order-item-bottom {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-top: 8px;
        }
        
        .order-item-price {
            color: #ff4757;
            font-size: 15px;
            font-weight: 600;
        }
        
        .order-item-qty {
            color: #666;
            font-size: 13px;
        }
        
        .order-remark {
            background: #fff;
            margin-top: 10px;
            padding: 12px 15px;
            display: flex;
            align-items: center;
            cursor: pointer;
        }
        
        .order-remark-label {
            font-size: 14px;
            color: #333;
            margin-right: 10px;
        }
        
        .order-remark-input {
            flex: 1;
            border: none;
            font-size: 14px;
            color: #666;
            background: transparent;
        }
        
        .order-summary {
            background: #fff;
            margin-top: 10px;
            padding: 15px;
        }
        
        .summary-row {
            display: flex;
            justify-content: space-between;
            padding: 8px 0;
            font-size: 14px;
        }
        
        .summary-row .label {
            color: #666;
        }
        
        .summary-row .value {
            color: #333;
        }
        
        .summary-row.total {
            border-top: 1px solid #f5f5f5;
            margin-top: 8px;
            padding-top: 12px;
        }
        
        .summary-row.total .label {
            font-size: 15px;
            color: #333;
            font-weight: 500;
        }
        
        .summary-row.total .value {
            font-size: 18px;
            color: #ff4757;
            font-weight: 600;
        }
        
        .order-submit-bar {
            position: fixed;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 100%;
            max-width: 430px;
            background: #fff;
            padding: 12px 15px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
            z-index: 100;
        }
        
        .order-total-label {
            font-size: 14px;
            color: #666;
        }
        
        .order-total-price {
            color: #ff4757;
            font-size: 20px;
            font-weight: 600;
        }
        
        .order-submit-btn {
            padding: 12px 40px;
            background: linear-gradient(135deg, #ff4757 0%, #ff6b81 100%);
            color: #fff;
            border: none;
            border-radius: 22px;
            font-size: 15px;
            cursor: pointer;
        }
        
        /* 订单列表页 */
        .order-tabs {
            display: flex;
            background: #fff;
            padding: 12px 0;
        }
        
        .order-tab {
            flex: 1;
            text-align: center;
            font-size: 14px;
            color: #666;
            cursor: pointer;
            position: relative;
        }
        
        .order-tab.active {
            color: #ff4757;
            font-weight: 600;
        }
        
        .order-tab.active::after {
            content: '';
            position: absolute;
            bottom: -12px;
            left: 50%;
            transform: translateX(-50%);
            width: 30px;
            height: 3px;
            background: #ff4757;
            border-radius: 2px;
        }
        
        .order-list {
            padding: 15px;
        }
        
        .order-card {
            background: #fff;
            border-radius: 12px;
            overflow: hidden;
            margin-bottom: 15px;
        }
        
        .order-card-header {
            display: flex;
            justify-content: space-between;
            padding: 12px 15px;
            border-bottom: 1px solid #f5f5f5;
        }
        
        .order-shop-title {
            font-size: 14px;
            color: #333;
            display: flex;
            align-items: center;
            gap: 8px;
        }
        
        .order-status {
            font-size: 13px;
            color: #ff4757;
        }
        
        .order-card-item {
            display: flex;
            padding: 12px 15px;
            gap: 12px;
        }
        
        .order-card-image {
            width: 70px;
            height: 70px;
            background: #f0f0f0;
            border-radius: 8px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 32px;
        }
        
        .order-card-info {
            flex: 1;
        }
        
        .order-card-name {
            font-size: 14px;
            color: #333;
            line-height: 1.4;
        }
        
        .order-card-bottom {
            display: flex;
            justify-content: space-between;
            margin-top: 8px;
        }
        
        .order-card-price {
            color: #666;
            font-size: 13px;
        }
        
        .order-card-qty {
            color: #999;
            font-size: 12px;
        }
        
        .order-card-footer {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 12px 15px;
            border-top: 1px solid #f5f5f5;
        }
        
        .order-card-total {
            font-size: 13px;
            color: #666;
        }
        
        .order-card-total span {
            color: #ff4757;
            font-weight: 600;
            font-size: 15px;
        }
        
        .order-action-btn {
            padding: 6px 15px;
            border: 1px solid #ff4757;
            color: #ff4757;
            border-radius: 15px;
            font-size: 12px;
            background: transparent;
            cursor: pointer;
        }
        
        .order-action-btn.primary {
            background: linear-gradient(135deg, #ff4757 0%, #ff6b81 100%);
            color: #fff;
            border: none;
        }
        
        /* 商家入驻页 */
        .settle-banner {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            padding: 40px 20px;
            text-align: center;
            color: #fff;
        }
        
        .settle-banner-icon {
            font-size: 60px;
            margin-bottom: 15px;
        }
        
        .settle-banner-title {
            font-size: 22px;
            font-weight: 600;
            margin-bottom: 8px;
        }
        
        .settle-banner-desc {
            font-size: 14px;
            opacity: 0.9;
        }
        
        .settle-benefits {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 15px;
            padding: 20px 15px;
        }
        
        .benefit-item {
            background: #fff;
            border-radius: 12px;
            padding: 20px;
            text-align: center;
        }
        
        .benefit-icon {
            width: 50px;
            height: 50px;
            border-radius: 50%;
            background: linear-gradient(135deg, #ffeaa7 0%, #fdcb6e 100%);
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 12px;
            font-size: 24px;
        }
        
        .benefit-title {
            font-size: 14px;
            color: #333;
            font-weight: 500;
        }
        
        .benefit-desc {
            font-size: 12px;
            color: #999;
            margin-top: 6px;
        }
        
        .settle-form {
            background: #fff;
            padding: 15px;
        }
        
        .form-title {
            font-size: 16px;
            color: #333;
            font-weight: 600;
            margin-bottom: 15px;
            padding-left: 10px;
            border-left: 3px solid #ff4757;
        }
        
        .form-item {
            margin-bottom: 20px;
        }
        
        .form-label {
            font-size: 14px;
            color: #666;
            margin-bottom: 8px;
            display: block;
        }
        
        .form-input {
            width: 100%;
            padding: 12px;
            border: 1px solid #e5e5e5;
            border-radius: 8px;
            font-size: 14px;
            transition: border-color 0.2s;
        }
        
        .form-input:focus {
            outline: none;
            border-color: #ff4757;
        }
        
        .form-row {
            display: flex;
            gap: 12px;
        }
        
        .form-row .form-item {
            flex: 1;
        }
        
        .form-upload {
            border: 2px dashed #ddd;
            border-radius: 8px;
            padding: 30px;
            text-align: center;
            cursor: pointer;
        }
        
        .form-upload-icon {
            font-size: 40px;
            color: #ccc;
        }
        
        .form-upload-text {
            font-size: 13px;
            color: #999;
            margin-top: 10px;
        }
        
        .settle-agreement {
            display: flex;
            align-items: center;
            padding: 15px;
            gap: 8px;
            font-size: 13px;
            color: #666;
        }
        
        .agreement-checkbox {
            width: 18px;
            height: 18px;
            border: 2px solid #ddd;
            border-radius: 4px;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
        }
        
        .agreement-checkbox.checked {
            background: #ff4757;
            border-color: #ff4757;
        }
        
        .agreement-checkbox.checked::after {
            content: '✓';
            color: #fff;
            font-size: 12px;
        }
        
        .agreement-link {
            color: #ff4757;
        }
        
        .settle-submit-btn {
            display: block;
            width: calc(100% - 30px);
            margin: 20px 15px;
            padding: 14px;
            background: linear-gradient(135deg, #ff4757 0%, #ff6b81 100%);
            color: #fff;
            border: none;
            border-radius: 25px;
            font-size: 16px;
            cursor: pointer;
        }
        
        /* 商家中心页 */
        .merchant-header {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            padding: 25px 15px;
            color: #fff;
        }
        
        .merchant-profile {
            display: flex;
            align-items: center;
            gap: 15px;
        }
        
        .merchant-avatar {
            width: 65px;
            height: 65px;
            border-radius: 50%;
            background: rgba(255,255,255,0.3);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 32px;
        }
        
        .merchant-info {
            flex: 1;
        }
        
        .merchant-name {
            font-size: 18px;
            font-weight: 600;
        }
        
        .merchant-shop-name {
            font-size: 13px;
            opacity: 0.85;
            margin-top: 4px;
        }
        
        .merchant-badge {
            padding: 4px 10px;
            background: rgba(255,255,255,0.2);
            border-radius: 12px;
            font-size: 11px;
            margin-top: 8px;
            display: inline-block;
        }
        
        .merchant-stats {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 10px;
            margin-top: 20px;
        }
        
        .stat-item {
            text-align: center;
        }
        
        .stat-value {
            font-size: 20px;
            font-weight: 600;
        }
        
        .stat-label {
            font-size: 11px;
            opacity: 0.85;
            margin-top: 4px;
        }
        
        .merchant-quick {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 1px;
            background: #f5f5f5;
            margin-top: 15px;
        }
        
        .quick-item {
            background: #fff;
            padding: 20px 10px;
            text-align: center;
        }
        
        .quick-icon {
            font-size: 28px;
            margin-bottom: 8px;
        }
        
        .quick-label {
            font-size: 12px;
            color: #666;
        }
        
        .merchant-orders {
            background: #fff;
            margin-top: 10px;
        }
        
        .merchant-orders-header {
            display: flex;
            justify-content: space-between;
            padding: 15px;
            border-bottom: 1px solid #f5f5f5;
        }
        
        .merchant-orders-title {
            font-size: 15px;
            color: #333;
            font-weight: 500;
        }
        
        .merchant-orders-more {
            font-size: 13px;
            color: #999;
        }
        
        .order-list-mini {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
        }
        
        .order-mini-item {
            padding: 15px;
            text-align: center;
            border-right: 1px solid #f5f5f5;
        }
        
        .order-mini-item:last-child {
            border-right: none;
        }
        
        .order-mini-num {
            font-size: 18px;
            font-weight: 600;
            color: #333;
        }
        
        .order-mini-label {
            font-size: 11px;
            color: #999;
            margin-top: 4px;
        }
        
        .merchant-tools {
            background: #fff;
            margin-top: 10px;
        }
        
        .tool-item {
            display: flex;
            align-items: center;
            padding: 15px;
            border-bottom: 1px solid #f5f5f5;
            cursor: pointer;
        }
        
        .tool-item:last-child {
            border-bottom: none;
        }
        
        .tool-icon {
            width: 40px;
            height: 40px;
            border-radius: 10px;
            background: linear-gradient(135deg, #ffeaa7 0%, #fdcb6e 100%);
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 20px;
            margin-right: 12px;
        }
        
        .tool-item:nth-child(2) .tool-icon {
            background: linear-gradient(135deg, #74b9ff 0%, #0984e3 100%);
        }
        
        .tool-item:nth-child(3) .tool-icon {
            background: linear-gradient(135deg, #a29bfe 0%, #6c5ce7 100%);
        }
        
        .tool-item:nth-child(4) .tool-icon {
            background: linear-gradient(135deg, #55efc4 0%, #00b894 100%);
        }
        
        .tool-item:nth-child(5) .tool-icon {
            background: linear-gradient(135deg, #fd79a8 0%, #e84393 100%);
        }
        
        .tool-name {
            flex: 1;
            font-size: 14px;
            color: #333;
        }
        
        .tool-arrow {
            font-size: 18px;
            color: #ccc;
        }
        
        /* 商品管理页 */
        .goods-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 12px 15px;
            background: #fff;
        }
        
        .goods-tab {
            font-size: 14px;
            color: #666;
            cursor: pointer;
        }
        
        .goods-tab.active {
            color: #ff4757;
            font-weight: 600;
        }
        
        .goods-add-btn {
            padding: 6px 15px;
            background: #ff4757;
            color: #fff;
            border-radius: 15px;
            font-size: 13px;
            cursor: pointer;
        }
        
        .goods-list {
            padding: 15px;
        }
        
        .goods-item {
            background: #fff;
            border-radius: 12px;
            overflow: hidden;
            margin-bottom: 15px;
        }
        
        .goods-item-header {
            display: flex;
            justify-content: space-between;
            padding: 12px 15px;
            border-bottom: 1px solid #f5f5f5;
        }
        
        .goods-item-shop {
            display: flex;
            align-items: center;
            gap: 8px;
        }
        
        .goods-item-icon {
            font-size: 16px;
        }
        
        .goods-item-name {
            font-size: 14px;
            color: #333;
        }
        
        .goods-item-status {
            font-size: 12px;
            padding: 3px 8px;
            border-radius: 10px;
        }
        
        .goods-item-status.on {
            background: #e8f8f5;
            color: #00b894;
        }
        
        .goods-item-status.off {
            background: #f5f5f5;
            color: #999;
        }
        
        .goods-item-content {
            display: flex;
            padding: 12px 15px;
            gap: 12px;
        }
        
        .goods-item-image {
            width: 80px;
            height: 80px;
            background: #f0f0f0;
            border-radius: 8px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 36px;
        }
        
        .goods-item-info {
            flex: 1;
        }
        
        .goods-item-title {
            font-size: 14px;
            color: #333;
            line-height: 1.4;
        }
        
        .goods-item-price {
            color: #ff4757;
            font-size: 16px;
            font-weight: 600;
            margin-top: 8px;
        }
        
        .goods-item-stats {
            display: flex;
            gap: 15px;
            margin-top: 8px;
            font-size: 12px;
            color: #999;
        }
        
        .goods-item-actions {
            display: flex;
            justify-content: flex-end;
            gap: 10px;
            padding: 10px 15px;
            background: #fafafa;
        }
        
        .goods-action {
            font-size: 13px;
            color: #666;
            cursor: pointer;
        }
        
        /* 订单管理页 */
        .merchant-order-filters {
            display: flex;
            gap: 15px;
            padding: 12px 15px;
            background: #fff;
            overflow-x: auto;
        }
        
        .order-filter {
            font-size: 14px;
            color: #666;
            white-space: nowrap;
            cursor: pointer;
            padding-bottom: 5px;
        }
        
        .order-filter.active {
            color: #ff4757;
            font-weight: 600;
            border-bottom: 2px solid #ff4757;
        }
        
        .merchant-order-list {
            padding: 15px;
        }
        
        .m-order-card {
            background: #fff;
            border-radius: 12px;
            margin-bottom: 15px;
            overflow: hidden;
        }
        
        .m-order-header {
            display: flex;
            justify-content: space-between;
            padding: 12px 15px;
            background: #fafafa;
        }
        
        .m-order-id {
            font-size: 13px;
            color: #666;
        }
        
        .m-order-status {
            font-size: 13px;
            color: #ff4757;
        }
        
        .m-order-content {
            padding: 12px 15px;
        }
        
        .m-order-item {
            display: flex;
            gap: 12px;
            padding-bottom: 12px;
            border-bottom: 1px dashed #f0f0f0;
        }
        
        .m-order-item:last-child {
            border-bottom: none;
            padding-bottom: 0;
        }
        
        .m-order-image {
            width: 60px;
            height: 60px;
            background: #f0f0f0;
            border-radius: 6px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 28px;
        }
        
        .m-order-info {
            flex: 1;
        }
        
        .m-order-title {
            font-size: 14px;
            color: #333;
            line-height: 1.4;
        }
        
        .m-order-spec {
            font-size: 12px;
            color: #999;
            margin-top: 4px;
        }
        
        .m-order-bottom {
            display: flex;
            justify-content: space-between;
            margin-top: 8px;
        }
        
        .m-order-price {
            color: #666;
            font-size: 13px;
        }
        
        .m-order-qty {
            color: #999;
            font-size: 12px;
        }
        
        .m-order-footer {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 12px 15px;
            border-top: 1px solid #f5f5f5;
        }
        
        .m-order-total {
            font-size: 14px;
            color: #333;
        }
        
        .m-order-total span {
            color: #ff4757;
            font-weight: 600;
        }
        
        .m-order-actions {
            display: flex;
            gap: 10px;
        }
        
        .m-order-btn {
            padding: 6px 15px;
            border-radius: 15px;
            font-size: 12px;
            cursor: pointer;
            border: 1px solid #ddd;
            background: #fff;
            color: #666;
        }
        
        .m-order-btn.primary {
            background: #ff4757;
            color: #fff;
            border: none;
        }
        
        /* 店铺设置页 */
        .shop-setting-form {
            padding: 15px;
        }
        
        .shop-avatar-upload {
            display: flex;
            align-items: center;
            gap: 15px;
            padding: 15px 0;
            border-bottom: 1px solid #f5f5f5;
        }
        
        .shop-avatar-preview {
            width: 70px;
            height: 70px;
            border-radius: 50%;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            display: flex;
            align-items: center;
            justify-content: center;
            color: #fff;
            font-size: 32px;
        }
        
        .shop-avatar-tip {
            font-size: 13px;
            color: #999;
        }
        
        .shop-form-item {
            padding: 15px 0;
            border-bottom: 1px solid #f5f5f5;
        }
        
        .shop-form-label {
            font-size: 14px;
            color: #666;
            margin-bottom: 10px;
            display: block;
        }
        
        .shop-form-row {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        
        .shop-form-input {
            flex: 1;
            border: none;
            font-size: 15px;
            color: #333;
            background: transparent;
        }
        
        .shop-form-input:focus {
            outline: none;
        }
        
        .shop-form-select {
            width: 80px;
            text-align: right;
            border: none;
            font-size: 14px;
            color: #666;
            background: transparent;
        }
        
        /* 支付成功页 */
        .pay-success {
            text-align: center;
            padding: 60px 20px;
        }
        
        .pay-success-icon {
            width: 80px;
            height: 80px;
            border-radius: 50%;
            background: linear-gradient(135deg, #55efc4 0%, #00b894 100%);
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 20px;
            font-size: 40px;
            color: #fff;
        }
        
        .pay-success-title {
            font-size: 20px;
            color: #333;
            font-weight: 600;
        }
        
        .pay-success-desc {
            font-size: 14px;
            color: #999;
            margin-top: 10px;
        }
        
        .pay-success-amount {
            font-size: 28px;
            color: #ff4757;
            font-weight: 600;
            margin-top: 30px;
        }
        
        .pay-success-btn {
            display: flex;
            gap: 15px;
            justify-content: center;
            margin-top: 40px;
        }
        
        .pay-btn {
            padding: 12px 30px;
            border-radius: 25px;
            font-size: 14px;
            cursor: pointer;
            border: 1px solid #ddd;
            background: #fff;
            color: #666;
        }
        
        .pay-btn.primary {
            background: linear-gradient(135deg, #ff4757 0%, #ff6b81 100%);
            color: #fff;
            border: none;
        }
        
        /* Toast 提示 */
        .toast {
            position: fixed;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background: rgba(0,0,0,0.75);
            color: #fff;
            padding: 15px 30px;
            border-radius: 8px;
            font-size: 14px;
            z-index: 9999;
            display: none;
        }
        
        .toast.show {
            display: block;
            animation: fadeIn 0.3s ease;
        }
        
        @keyframes fadeIn {
            from {
                opacity: 0;
                transform: translate(-50%, -50%) scale(0.9);
            }
            to {
                opacity: 1;
                transform: translate(-50%, -50%) scale(1);
            }
        }
        
        /* 底部标签栏 */
        .tab-bar {
            position: fixed;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 100%;
            max-width: 430px;
            background: #fff;
            display: flex;
            box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
            z-index: 100;
        }
        
        .tab-item {
            flex: 1;
            text-align: center;
            padding: 8px 0;
            cursor: pointer;
            position: relative;
        }
        
        .tab-item.active {
            color: #ff4757;
        }
        
        .tab-icon {
            font-size: 24px;
            display: block;
        }
        
        .tab-label {
            font-size: 10px;
            margin-top: 2px;
        }
        
        .tab-badge {
            position: absolute;
            top: 2px;
            right: 25%;
            min-width: 16px;
            height: 16px;
            background: #ff4757;
            color: #fff;
            border-radius: 8px;
            font-size: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        
        /* 模态框 */
        .modal-overlay {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(0,0,0,0.5);
            z-index: 200;
            display: none;
        }
        
        .modal-overlay.show {
            display: block;
        }
        
        .modal {
            position: fixed;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 100%;
            max-width: 430px;
            background: #fff;
            border-radius: 16px 16px 0 0;
            z-index: 201;
            display: none;
        }
        
        .modal.show {
            display: block;
            animation: slideUp 0.3s ease;
        }
        
        @keyframes slideUp {
            from {
                transform: translateX(-50%) translateY(100%);
            }
            to {
                transform: translateX(-50%) translateY(0);
            }
        }
        
        .modal-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 15px;
            border-bottom: 1px solid #f5f5f5;
        }
        
        .modal-title {
            font-size: 16px;
            color: #333;
            font-weight: 500;
        }
        
        .modal-close {
            font-size: 24px;
            color: #999;
            cursor: pointer;
        }
        
        .modal-content {
            padding: 20px;
            max-height: 400px;
            overflow-y: auto;
        }
        
        .modal-footer {
            padding: 15px;
            display: flex;
            gap: 12px;
        }
        
        .modal-btn {
            flex: 1;
            padding: 12px;
            border-radius: 22px;
            font-size: 15px;
            cursor: pointer;
            border: 1px solid #ddd;
            background: #fff;
            color: #666;
        }
        
        .modal-btn.primary {
            background: linear-gradient(135deg, #ff4757 0%, #ff6b81 100%);
            color: #fff;
            border: none;
        }
        
        /* 规格选择弹窗 */
        .spec-sku {
            display: flex;
            gap: 12px;
            margin-bottom: 15px;
        }
        
        .spec-sku-image {
            width: 100px;
            height: 100px;
            background: #f0f0f0;
            border-radius: 8px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 40px;
        }
        
        .spec-sku-info {
            flex: 1;
        }
        
        .spec-sku-price {
            color: #ff4757;
            font-size: 20px;
            font-weight: 600;
        }
        
        .spec-sku-stock {
            font-size: 12px;
            color: #999;
            margin-top: 5px;
        }
        
        .spec-group {
            margin-bottom: 15px;
        }
        
        .spec-group-title {
            font-size: 14px;
            color: #333;
            margin-bottom: 10px;
        }
        
        .spec-options-modal {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
        }
        
        .spec-option-modal {
            padding: 8px 16px;
            border: 1px solid #ddd;
            border-radius: 8px;
            font-size: 13px;
            cursor: pointer;
        }
        
        .spec-option-modal.active {
            border-color: #ff4757;
            background: #fff0f0;
            color: #ff4757;
        }
        
        .spec-option-modal.disabled {
            color: #ccc;
            border-color: #eee;
            background: #fafafa;
        }
        
        .quantity-section {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 15px 0;
            border-top: 1px solid #f5f5f5;
        }
        
        .quantity-label {
            font-size: 14px;
            color: #333;
        }
        
        .quantity-control-modal {
            display: flex;
            align-items: center;
        }
        
        .quantity-btn-modal {
            width: 32px;
            height: 32px;
            border: 1px solid #ddd;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 16px;
            cursor: pointer;
            background: #fff;
        }
        
        .quantity-btn-modal:first-child {
            border-radius: 6px 0 0 6px;
        }
        
        .quantity-btn-modal:last-child {
            border-radius: 0 6px 6px 0;
        }
        
        .quantity-num-modal {
            width: 40px;
            height: 32px;
            border: 1px solid #ddd;
            border-left: none;
            border-right: none;
            text-align: center;
            line-height: 32px;
            font-size: 14px;
        }
        
        /* 空状态 */
        .empty-state {
            text-align: center;
            padding: 60px 20px;
        }
        
        .empty-icon {
            font-size: 60px;
            color: #ddd;
        }
        
        .empty-text {
            font-size: 14px;
            color: #999;
            margin-top: 15px;
        }
        
        /* 确认弹窗内容 */
        .confirm-content {
            text-align: center;
            padding: 20px 0;
        }
        
        .confirm-icon {
            font-size: 50px;
            margin-bottom: 15px;
        }
        
        .confirm-text {
            font-size: 15px;
            color: #333;
        }
        
        /* ========== 二级页面样式 ========== */
        
        /* 收货地址列表页 */
        .address-list-container { padding: 0 15px; padding-bottom: 80px; }
        .address-list-item { background: #fff; border-radius: 12px; margin-top: 15px; overflow: hidden; }
        .address-list-content { display: flex; padding: 15px; align-items: center; cursor: pointer; }
        .address-list-icon { font-size: 24px; margin-right: 12px; color: #667eea; }
        .address-list-info { flex: 1; }
        .address-list-name { font-size: 16px; color: #333; font-weight: 500; }
        .address-list-name span { font-size: 14px; color: #666; font-weight: normal; margin-left: 10px; }
        .address-list-detail { font-size: 13px; color: #999; margin-top: 6px; line-height: 1.5; }
        .address-list-default { padding: 4px 10px; background: #ff4757; color: #fff; font-size: 11px; border-radius: 10px; margin-right: 10px; }
        .address-add-card { background: #fff; border-radius: 12px; margin-top: 15px; padding: 30px; text-align: center; cursor: pointer; }
        .address-add-icon { font-size: 40px; color: #ccc; margin-bottom: 10px; }
        .address-add-text { font-size: 14px; color: #999; }
        
        /* 物流详情页 */
        .logistics-detail { padding: 15px; }
        .logistics-status-card { background: #fff; border-radius: 12px; padding: 20px; margin-bottom: 15px; display: flex; align-items: center; }
        .logistics-status-icon { width: 60px; height: 60px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 30px; color: #fff; margin-right: 15px; }
        .logistics-status-info { flex: 1; }
        .logistics-status-text { font-size: 16px; color: #333; font-weight: 500; }
        .logistics-status-time { font-size: 12px; color: #999; margin-top: 5px; }
        .logistics-timeline-card { background: #fff; border-radius: 12px; padding: 15px; }
        .logistics-timeline-title { font-size: 14px; color: #333; font-weight: 500; margin-bottom: 15px; padding-bottom: 10px; border-bottom: 1px solid #f5f5f5; }
        .timeline-item-new { display: flex; padding-bottom: 20px; position: relative; }
        .timeline-item-new::before { content: ''; position: absolute; left: 10px; top: 25px; bottom: 0; width: 1px; background: #e5e5e5; }
        .timeline-item-new:last-child::before { display: none; }
        .timeline-dot-new { width: 20px; height: 20px; border-radius: 50%; background: #fff; border: 2px solid #ddd; z-index: 1; position: relative; flex-shrink: 0; }
        .timeline-item-new.active .timeline-dot-new { background: #ff4757; border-color: #ff4757; }
        .timeline-content-new { margin-left: 15px; flex: 1; }
        .timeline-title-new { font-size: 14px; color: #333; line-height: 1.4; }
        .timeline-time-new { font-size: 12px; color: #999; margin-top: 4px; }
        .timeline-item-new.active .timeline-title-new { color: #ff4757; }
        
        /* 评价页 */
        .review-form-container { padding: 15px; }
        .review-product-card { background: #fff; border-radius: 12px; padding: 15px; margin-bottom: 15px; display: flex; }
        .review-product-img { width: 70px; height: 70px; background: #f0f0f0; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 32px; margin-right: 12px; }
        .review-product-name { font-size: 14px; color: #333; line-height: 1.4; }
        .review-star-section { background: #fff; border-radius: 12px; padding: 15px; margin-bottom: 15px; }
        .review-star-title { font-size: 14px; color: #333; margin-bottom: 12px; }
        .review-stars { display: flex; gap: 5px; }
        .review-star { font-size: 28px; color: #ddd; cursor: pointer; }
        .review-star.active { color: #ffb800; }
        .review-tags-section { background: #fff; border-radius: 12px; padding: 15px; margin-bottom: 15px; }
        .review-tags-container { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
        .review-tag-item { padding: 8px 15px; background: #f5f5f5; border-radius: 20px; font-size: 13px; color: #666; cursor: pointer; }
        .review-tag-item.active { background: #fff0f0; color: #ff4757; }
        .review-content-section { background: #fff; border-radius: 12px; padding: 15px; margin-bottom: 15px; }
        .review-textarea-new { width: 100%; min-height: 120px; border: 1px solid #e5e5e5; border-radius: 8px; padding: 12px; font-size: 14px; resize: none; }
        .review-images-container { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
        .review-img-add { width: 80px; height: 80px; border: 2px dashed #ddd; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 30px; color: #ccc; cursor: pointer; }
        .review-submit-btn { width: 100%; padding: 14px; background: linear-gradient(135deg, #ff4757 0%, #ff6b81 100%); color: #fff; border: none; border-radius: 25px; font-size: 16px; cursor: pointer; }
        
        /* 商家详情页 */
        .shop-detail-container { background: #f5f5f5; }
        .shop-detail-header-new { padding: 30px; text-align: center; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: #fff; }
        .shop-detail-avatar-new { width: 80px; height: 80px; border-radius: 50%; background: rgba(255,255,255,0.3); display: flex; align-items: center; justify-content: center; font-size: 40px; margin: 0 auto 15px; }
        .shop-detail-name-new { font-size: 18px; font-weight: 600; }
        .shop-detail-badge { font-size: 12px; opacity: 0.85; margin-top: 5px; }
        .shop-detail-stats-new { display: flex; justify-content: center; gap: 40px; margin-top: 20px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,0.3); }
        .shop-stat-new { text-align: center; }
        .shop-stat-val { font-size: 18px; font-weight: 600; }
        .shop-stat-lbl { font-size: 11px; opacity: 0.85; margin-top: 4px; }
        .shop-detail-content-new { padding: 15px; }
        .shop-intro-card { background: #fff; border-radius: 12px; padding: 15px; margin-bottom: 15px; }
        .shop-intro-title { font-size: 14px; color: #333; font-weight: 500; margin-bottom: 10px; }
        .shop-intro-text { font-size: 13px; color: #666; line-height: 1.6; }
        .shop-goods-section { background: #fff; border-radius: 12px; padding: 15px; margin-bottom: 15px; }
        .shop-goods-title { font-size: 14px; color: #333; font-weight: 500; margin-bottom: 12px; display: flex; justify-content: space-between; }
        .shop-goods-title span { color: #999; font-weight: normal; font-size: 12px; }
        .shop-goods-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
        .shop-goods-item { background: #fafafa; border-radius: 8px; overflow: hidden; cursor: pointer; }
        .shop-goods-img { width: 100%; height: 100px; background: #f0f0f0; display: flex; align-items: center; justify-content: center; font-size: 36px; }
        .shop-goods-name { font-size: 12px; color: #333; padding: 8px; }
        .shop-goods-price { font-size: 13px; color: #ff4757; padding: 0 8px 8px; font-weight: 600; }
        
        /* 添加商品页 */
        .add-goods-container { padding: 15px; }
        .add-goods-form-new { background: #fff; border-radius: 12px; padding: 15px; }
        .add-form-section { margin-bottom: 15px; }
        .add-form-label-new { font-size: 14px; color: #333; font-weight: 500; margin-bottom: 10px; }
        .add-form-input-new { width: 100%; padding: 12px; border: 1px solid #e5e5e5; border-radius: 8px; font-size: 14px; }
        .add-form-textarea-new { width: 100%; min-height: 80px; padding: 12px; border: 1px solid #e5e5e5; border-radius: 8px; font-size: 14px; resize: none; }
        .add-images-grid { display: flex; gap: 10px; flex-wrap: wrap; }
        .add-img-add-new { width: 80px; height: 80px; border: 2px dashed #ddd; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 30px; color: #ccc; cursor: pointer; }
        .spec-row { display: flex; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
        .spec-tag { padding: 8px 15px; border: 1px solid #e5e5e5; border-radius: 20px; font-size: 13px; color: #666; cursor: pointer; }
        .spec-tag.active { border-color: #ff4757; background: #fff0f0; color: #ff4757; }
        .add-price-row { display: flex; gap: 15px; }
        .add-price-item { flex: 1; }
        .add-price-label { font-size: 12px; color: #999; margin-bottom: 5px; }
        .add-price-input { width: 100%; padding: 10px; border: 1px solid #e5e5e5; border-radius: 8px; font-size: 14px; }
        .add-goods-save { display: flex; gap: 10px; margin-top: 20px; }
        .add-goods-btn { flex: 1; padding: 14px; border-radius: 25px; font-size: 15px; cursor: pointer; text-align: center; border: none; }
        .add-goods-btn.preview { background: #fff; color: #ff4757; border: 1px solid #ff4757; }
        .add-goods-btn.submit { background: linear-gradient(135deg, #ff4757 0%, #ff6b81 100%); color: #fff; }
        
        /* 结算明细页 */
        .settlement-container { padding: 15px; }
        .settlement-card-new { background: #fff; border-radius: 12px; padding: 15px; margin-bottom: 15px; }
        .settlement-card-title-new { font-size: 14px; color: #333; font-weight: 500; padding-bottom: 12px; border-bottom: 1px solid #f5f5f5; margin-bottom: 10px; }
        .settlement-row { display: flex; justify-content: space-between; padding: 10px 0; }
        .settlement-label-new { font-size: 14px; color: #666; }
        .settlement-value-new { font-size: 14px; color: #333; }
        .settlement-value-new.red { color: #ff4757; font-weight: 600; }
        .settlement-value-new.green { color: #00b894; }
        .settlement-total-row { display: flex; justify-content: space-between; align-items: center; padding: 15px 0; }
        .settlement-total-label { font-size: 15px; color: #333; font-weight: 500; }
        .settlement-total-value { font-size: 20px; color: #ff4757; font-weight: 600; }
        
        /* 提现页面 */
        .withdraw-container { padding: 15px; }
        .withdraw-balance-card { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: #fff; padding: 25px; border-radius: 12px; text-align: center; margin-bottom: 20px; }
        .withdraw-balance-label-new { font-size: 14px; opacity: 0.85; }
        .withdraw-balance-value-new { font-size: 32px; font-weight: 600; margin-top: 10px; }
        .withdraw-form-card { background: #fff; border-radius: 12px; padding: 15px; }
        .withdraw-input-group { display: flex; align-items: center; padding: 15px 0; border-bottom: 1px solid #f5f5f5; }
        .withdraw-input-label { font-size: 16px; margin-right: 15px; }
        .withdraw-input-field { flex: 1; border: none; font-size: 20px; }
        .withdraw-input-field:focus { outline: none; }
        .withdraw-tip { font-size: 12px; color: #999; margin-top: 10px; }
        .withdraw-btn { width: 100%; padding: 14px; background: linear-gradient(135deg, #ff4757 0%, #ff6b81 100%); color: #fff; border: none; border-radius: 25px; font-size: 16px; margin-top: 20px; cursor: pointer; }
        .withdraw-methods { background: #fff; border-radius: 12px; padding: 15px; margin-top: 15px; }
        .withdraw-method-title { font-size: 14px; color: #333; font-weight: 500; margin-bottom: 12px; }
        .withdraw-method-item { display: flex; align-items: center; padding: 12px 0; border-bottom: 1px solid #f5f5f5; cursor: pointer; }
        .withdraw-method-item:last-child { border-bottom: none; }
        .withdraw-method-icon { width: 40px; height: 40px; background: #f5f5f5; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 20px; margin-right: 12px; }
        .withdraw-method-name { flex: 1; font-size: 14px; color: #333; }
        .withdraw-method-check { font-size: 20px; color: #ccc; }
        .withdraw-method-item.active .withdraw-method-check { color: #ff4757; }
        
        /* 退款页面 */
        .refund-container { padding: 15px; }
        .refund-product-card { background: #fff; border-radius: 12px; padding: 15px; margin-bottom: 15px; display: flex; cursor: pointer; }
        .refund-product-img { width: 80px; height: 80px; background: #f0f0f0; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 36px; margin-right: 12px; }
        .refund-product-name { font-size: 14px; color: #333; line-height: 1.4; }
        .refund-product-price { font-size: 15px; color: #ff4757; font-weight: 600; margin-top: 8px; }
        .refund-reason-card { background: #fff; border-radius: 12px; padding: 15px; margin-bottom: 15px; }
        .refund-reason-title { font-size: 14px; color: #333; font-weight: 500; margin-bottom: 12px; }
        .refund-reason-list { display: flex; flex-wrap: wrap; gap: 10px; }
        .refund-reason-tag { padding: 8px 15px; background: #f5f5f5; border-radius: 20px; font-size: 13px; color: #666; cursor: pointer; }
        .refund-reason-tag.active { background: #fff0f0; color: #ff4757; }
        .refund-form-card { background: #fff; border-radius: 12px; padding: 15px; }
        .refund-form-item { margin-bottom: 15px; }
        .refund-form-label { font-size: 14px; color: #666; margin-bottom: 8px; display: block; }
        .refund-form-input { width: 100%; padding: 12px; border: 1px solid #e5e5e5; border-radius: 8px; font-size: 14px; }
        .refund-form-textarea { width: 100%; min-height: 100px; padding: 12px; border: 1px solid #e5e5e5; border-radius: 8px; font-size: 14px; resize: none; }
        .refund-images { display: flex; gap: 10px; flex-wrap: wrap; }
        .refund-img-add { width: 80px; height: 80px; border: 2px dashed #ddd; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 30px; color: #ccc; cursor: pointer; }
        .refund-submit-btn { width: 100%; padding: 14px; background: linear-gradient(135deg, #ff4757 0%, #ff6b81 100%); color: #fff; border: none; border-radius: 25px; font-size: 16px; margin-top: 15px; cursor: pointer; }
        
        /* 客服页面 */
        .customer-container { padding: 0; background: #f5f5f5; min-height: 100vh; }
        .customer-header-card { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: #fff; padding: 25px; text-align: center; }
        .customer-online-icon { width: 50px; height: 50px; border-radius: 50%; background: rgba(255,255,255,0.2); display: flex; align-items: center; justify-content: center; font-size: 24px; margin: 0 auto 10px; }
        .customer-status-text { font-size: 14px; opacity: 0.85; }
        .customer-msg-text { font-size: 20px; font-weight: 600; margin-top: 8px; }
        .customer-quick-section { background: #fff; padding: 15px; margin-bottom: 15px; }
        .customer-quick-title { font-size: 14px; color: #333; font-weight: 500; margin-bottom: 12px; }
        .customer-quick-list { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; }
        .customer-quick-item { text-align: center; cursor: pointer; }
        .customer-quick-icon { width: 45px; height: 45px; border-radius: 50%; background: linear-gradient(135deg, #ffeaa7 0%, #fdcb6e 100%); display: flex; align-items: center; justify-content: center; font-size: 20px; margin: 0 auto 8px; }
        .customer-quick-item:nth-child(2) .customer-quick-icon { background: linear-gradient(135deg, #74b9ff 0%, #0984e3 100%); }
        .customer-quick-item:nth-child(3) .customer-quick-icon { background: linear-gradient(135deg, #a29bfe 0%, #6c5ce7 100%); }
        .customer-quick-item:nth-child(4) .customer-quick-icon { background: linear-gradient(135deg, #55efc4 0%, #00b894 100%); }
        .customer-quick-label { font-size: 12px; color: #666; }
        .customer-history-section { background: #fff; }
        .customer-history-title { font-size: 14px; color: #333; font-weight: 500; padding: 15px; border-bottom: 1px solid #f5f5f5; }
        .customer-history-item { display: flex; align-items: center; padding: 12px 15px; border-bottom: 1px solid #f5f5f5; cursor: pointer; }
        .customer-history-item:last-child { border-bottom: none; }
        .customer-history-icon { width: 40px; height: 40px; border-radius: 50%; background: #f5f5f5; display: flex; align-items: center; justify-content: center; font-size: 18px; margin-right: 12px; }
        .customer-history-info { flex: 1; }
        .customer-history-name { font-size: 14px; color: #333; }
        
        /* 数据中心页面 */
        .data-container { padding: 15px; }
        .data-summary-card { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: #fff; padding: 20px; border-radius: 12px; margin-bottom: 15px; }
        .data-summary-value { font-size: 28px; font-weight: 600; margin-top: 8px; }
        .data-chart-card { background: #fff; border-radius: 12px; padding: 15px; margin-bottom: 15px; }
        .data-chart-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; }
        .data-chart-title { font-size: 14px; color: #333; font-weight: 500; }
        .data-chart-tabs { display: flex; gap: 5px; }
        .data-chart-tab { padding: 4px 10px; background: #f5f5f5; border-radius: 10px; font-size: 12px; color: #666; cursor: pointer; }
        .data-chart-tab.active { background: #ff4757; color: #fff; }
        .data-chart-area { height: 180px; background: #fafafa; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 40px; color: #ddd; }
        .data-stats-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; }
        .data-stat-card { background: #fff; border-radius: 12px; padding: 15px; }
        .data-stat-label { font-size: 13px; color: #666; }
        .data-stat-value { font-size: 22px; color: #333; font-weight: 600; margin-top: 8px; }
        .data-stat-trend { font-size: 12px; color: #00b894; margin-top: 5px; }
        
    </style>
</head>
<body>
    <!-- 首页 -->
    <div id="page-home" class="page active">
        <div class="header">
            <div class="header-left">
                <span onclick="showPage('page-settle')" style="font-size:14px;cursor:pointer;">商家入驻</span>
            </div>
            <div class="header-search">
                <input type="text" placeholder="搜索玩具商品">
                <span class="header-search-icon">🔍</span>
            </div>
            <div class="header-right" onclick="showPage('page-cart')">🛒</div>
        </div>
        
        <div class="home-banner">
            <div class="banner-slider">
                <div class="banner-item">
                    <div class="banner-content">
                        <div class="banner-title">六一儿童节特惠</div>
                        <div class="banner-subtitle">全场玩具8折起，惊喜不断</div>
                    </div>
                </div>
                <div class="banner-item" style="background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%);">
                    <div class="banner-content">
                        <div class="banner-title">新品上市</div>
                        <div class="banner-subtitle">热门玩具抢先购</div>
                    </div>
                </div>
                <div class="banner-item" style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);">
                    <div class="banner-content">
                        <div class="banner-title">品牌专区</div>
                        <div class="banner-subtitle">汇聚全球知名玩具品牌</div>
                    </div>
                </div>
            </div>
            <div class="banner-dots">
                <span class="banner-dot active"></span>
                <span class="banner-dot"></span>
                <span class="banner-dot"></span>
            </div>
        </div>
        
        <div class="category-nav">
            <div class="category-item" onclick="filterByCategory('遥控')">
                <div class="category-icon">🚗</div>
                <div class="category-name">遥控玩具</div>
            </div>
            <div class="category-item" onclick="filterByCategory('积木')">
                <div class="category-icon">🧱</div>
                <div class="category-name">积木拼装</div>
            </div>
            <div class="category-item" onclick="filterByCategory('玩偶')">
                <div class="category-icon">🧸</div>
                <div class="category-name">毛绒玩偶</div>
            </div>
            <div class="category-item" onclick="filterByCategory('益智')">
                <div class="category-icon">🧩</div>
                <div class="category-name">益智玩具</div>
            </div>
            <div class="category-item" onclick="filterByCategory('户外')">
                <div class="category-icon">⚽</div>
                <div class="category-name">户外运动</div>
            </div>
            <div class="category-item" onclick="filterByCategory('模型')">
                <div class="category-icon">🚀</div>
                <div class="category-name">模型玩具</div>
            </div>
        </div>
        
        <div class="section">
            <div class="section-header">
                <span class="section-title">🔥 热门推荐</span>
                <span class="section-more">查看更多 ></span>
            </div>
            <div class="product-grid">
                <div class="product-card" onclick="showPage('page-detail', 0)">
                    <div class="product-image">🚗</div>
                    <div class="product-info">
                        <div class="product-name">遥控越野赛车 四驱动力版</div>
                        <div class="product-price">¥<span>299</span></div>
                        <div class="product-sales">已售 1.2万</div>
                    </div>
                </div>
                <div class="product-card" onclick="showPage('page-detail', 1)">
                    <div class="product-image">🧱</div>
                    <div class="product-info">
                        <div class="product-name">智能积木机器人 编程版</div>
                        <div class="product-price">¥<span>459</span></div>
                        <div class="product-sales">已售 8千</div>
                    </div>
                </div>
                <div class="product-card" onclick="showPage('page-detail', 2)">
                    <div class="product-image">🧸</div>
                    <div class="product-info">
                        <div class="product-name">超大号泰迪熊 柔软绒毛</div>
                        <div class="product-price">¥<span>188</span></div>
                        <div class="product-sales">已售 2.3万</div>
                    </div>
                </div>
                <div class="product-card" onclick="showPage('page-detail', 3)">
                    <div class="product-image">🎮</div>
                    <div class="product-info">
                        <div class="product-name">儿童游戏机 经典款</div>
                        <div class="product-price">¥<span>168</span></div>
                        <div class="product-sales">已售 5千</div>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="section">
            <div class="section-header">
                <span class="section-title">🏪 优质商家</span>
                <span class="section-more">全部商家 ></span>
            </div>
            <div class="product-grid">
                <div class="product-card" onclick="showPage('page-detail', 4)">
                    <div class="product-image" style="font-size:36px;">🎪</div>
                    <div class="product-info">
                        <div class="product-name">梦幻玩具屋 - 官方旗舰店</div>
                        <div class="product-price">¥<span>99</span>起</div>
                        <div class="product-sales">综合评分 4.9</div>
                    </div>
                </div>
                <div class="product-card" onclick="showPage('page-detail', 5)">
                    <div class="product-image" style="font-size:36px;">ademia</div>
                    <div class="product-info">
                        <div class="product-name">智趣玩具专营店</div>
                        <div class="product-price">¥<span>79</span>起</div>
                        <div class="product-sales">综合评分 4.8</div>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="tab-bar">
            <div class="tab-item active">
                <span class="tab-icon">🏠</span>
                <span class="tab-label">首页</span>
            </div>
            <div class="tab-item" onclick="showPage('page-category')">
                <span class="tab-icon">📦</span>
                <span class="tab-label">分类</span>
            </div>
            <div class="tab-item" onclick="showPage('page-cart')">
                <span class="tab-icon">🛒</span>
                <span class="tab-label">购物车</span>
                <span class="tab-badge" id="cart-badge" style="display:none;">0</span>
            </div>
            <div class="tab-item" onclick="showPage('page-orders')">
                <span class="tab-icon">📝</span>
                <span class="tab-label">订单</span>
            </div>
            <div class="tab-item" onclick="showPage('page-merchant')">
                <span class="tab-icon">👤</span>
                <span class="tab-label">我的</span>
            </div>
        </div>
    </div>
    
    <!-- 商品详情页 -->
    <div id="page-detail" class="page">
        <div class="header">
            <div class="header-back" onclick="goBack()">←</div>
            <div class="header-title">商品详情</div>
            <div class="header-right">...</div>
        </div>
        
        <div class="detail-swiper" id="detail-emoji">🚗</div>
        
        <div class="detail-content">
            <div class="detail-price-row">
                <span class="detail-price" id="detail-price">¥299</span>
                <span class="detail-original-price" id="detail-original">¥399</span>
            </div>
            <div class="detail-title" id="detail-title">遥控越野赛车 四驱动力版</div>
            <div class="detail-desc">精选材质，安全无毒，适合3岁以上儿童使用。采用先进遥控技术，信号稳定，操作流畅。</div>
            <div class="detail-tags">
                <span class="detail-tag">正品保证</span>
                <span class="detail-tag">7天无理由</span>
                <span class="detail-tag">厂家直发</span>
            </div>
            
            <div class="detail-specs" onclick="showSpecModal()">
                <div class="detail-specs-title">选择规格</div>
                <div class="spec-options">
                    <span class="spec-option active" onclick="selectSpec(this, event)">标准版</span>
                    <span class="spec-option" onclick="selectSpec(this, event)">升级版</span>
                    <span class="spec-option" onclick="selectSpec(this, event)">豪华版</span>
                </div>
            </div>
        </div>
        
        <div class="detail-shop" onclick="showPage('page-shop-detail')">
            <div class="shop-avatar">🏪</div>
            <div class="shop-info">
                <div class="shop-name">梦幻玩具屋</div>
                <div class="shop-tags">官方旗舰店 · 实名认证 · 品质保障</div>
            </div>
            <span style="font-size:18px;color:#ccc;">></span>
        </div>
        
        <div class="detail-params">
            <div class="param-item">
                <span class="param-label">品牌</span>
                <span class="param-value">童趣玩具</span>
            </div>
            <div class="param-item">
                <span class="param-label">产地</span>
                <span class="param-value">广东汕头</span>
            </div>
            <div class="param-item">
                <span class="param-label">材质</span>
                <span class="param-value">ABS塑料</span>
            </div>
            <div class="param-item">
                <span class="param-label">适用年龄</span>
                <span class="param-value">3-12岁</span>
            </div>
            <div class="param-item">
                <span class="param-label">发货方式</span>
                <span class="param-value" style="color:#ff4757;">厂家统一发货</span>
            </div>
        </div>
        
        <div style="height:80px;"></div>
        
        <div class="action-bar">
            <div class="action-icon-btn" onclick="showPage('page-cart')">
                <span>🛒</span>
                <small>购物车</small>
            </div>
            <div class="action-buttons">
                <button class="btn-add-cart" onclick="addToCart()">加入购物车</button>
                <button class="btn-buy-now" onclick="buyNow()">立即购买</button>
            </div>
        </div>
    </div>
    
    <!-- 购物车页 -->
    <div id="page-cart" class="page">
        <div class="header">
            <div class="header-back" onclick="goBack()">←</div>
            <div class="header-title">购物车</div>
            <div class="header-right" onclick="showToast('编辑')">编辑</div>
        </div>
        
        <div class="cart-header">
            <span style="font-size:14px;color:#666;">共 <span id="cart-count">3</span> 件商品</span>
            <span class="cart-edit-btn" onclick="clearCart()">清空购物车</span>
        </div>
        
        <div class="cart-list" id="cart-list">
            <div class="cart-shop">
                <div class="cart-shop-header">
                    <span class="cart-shop-icon">🏪</span>
                    <span class="cart-shop-name">梦幻玩具屋</span>
                </div>
                
                <div class="cart-item checked" data-id="0">
                    <div class="cart-check" onclick="toggleCartCheck(this)"></div>
                    <div class="cart-item-image">🚗</div>
                    <div class="cart-item-info">
                        <div class="cart-item-name">遥控越野赛车 四驱动力版</div>
                        <div class="cart-item-spec">标准版</div>
                        <div class="cart-item-bottom">
                            <span class="cart-item-price">¥299</span>
                            <div class="quantity-control">
                                <div class="quantity-btn" onclick="changeQty(this, -1)">-</div>
                                <div class="quantity-num">1</div>
                                <div class="quantity-btn" onclick="changeQty(this, 1)">+</div>
                            </div>
                        </div>
                    </div>
                </div>
                
                <div class="cart-item" data-id="2">
                    <div class="cart-check" onclick="toggleCartCheck(this)"></div>
                    <div class="cart-item-image">🧸</div>
                    <div class="cart-item-info">
                        <div class="cart-item-name">超大号泰迪熊 柔软绒毛</div>
                        <div class="cart-item-spec">粉色 80cm</div>
                        <div class="cart-item-bottom">
                            <span class="cart-item-price">¥188</span>
                            <div class="quantity-control">
                                <div class="quantity-btn" onclick="changeQty(this, -1)">-</div>
                                <div class="quantity-num">1</div>
                                <div class="quantity-btn" onclick="changeQty(this, 1)">+</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        <div id="cart-empty" class="empty-state" style="display:none;">
            <div class="empty-icon">🛒</div>
            <div class="empty-text">购物车是空的，快去逛逛吧</div>
            <button onclick="showPage('page-home')" style="margin-top:20px;padding:10px 30px;background:#ff4757;color:#fff;border:none;border-radius:20px;cursor:pointer;">去购物</button>
        </div>
        
        <div class="cart-bottom" id="cart-bottom">
            <div class="cart-all-check all-checked" onclick="toggleAllCheck(this)">
                <div class="cart-check"></div>
                <span>全选</span>
            </div>
            <div class="cart-total">
                <span>合计：</span>
                <span class="cart-total-price" id="cart-total-price">¥487</span>
            </div>
            <button class="cart-settle-btn" onclick="goCheckout()">结算</button>
        </div>
        
        <div class="tab-bar">
            <div class="tab-item" onclick="showPage('page-home')">
                <span class="tab-icon">🏠</span>
                <span class="tab-label">首页</span>
            </div>
            <div class="tab-item" onclick="showPage('page-category')">
                <span class="tab-icon">📦</span>
                <span class="tab-label">分类</span>
            </div>
            <div class="tab-item active">
                <span class="tab-icon">🛒</span>
                <span class="tab-label">购物车</span>
                <span class="tab-badge" id="cart-badge-bottom" style="display:none;">0</span>
            </div>
            <div class="tab-item" onclick="showPage('page-orders')">
                <span class="tab-icon">📝</span>
                <span class="tab-label">订单</span>
            </div>
            <div class="tab-item" onclick="showPage('page-merchant')">
                <span class="tab-icon">👤</span>
                <span class="tab-label">我的</span>
            </div>
        </div>
    </div>
    
    <!-- 订单确认页 -->
    <div id="page-checkout" class="page">
        <div class="header">
            <div class="header-back" onclick="goBack()">←</div>
            <div class="header-title">确认订单</div>
            <div class="header-right"></div>
        </div>
        
        <div class="order-address" onclick="showPage('page-address-list')">
            <div class="address-content">
                <div class="address-icon">📍</div>
                <div class="address-info">
                    <div class="address-name">张小明 <span style="margin-left:10px;">138****8888</span></div>
                    <div class="address-detail">广东省深圳市南山区科技园南路88号</div>
                </div>
                <div class="address-arrow">></div>
            </div>
        </div>
        
        <div class="order-items">
            <div class="order-shop">
                <span class="order-shop-icon">🏪</span>
                <span class="order-shop-name">梦幻玩具屋</span>
            </div>
            
            <div class="order-item" id="checkout-item-1">
                <div class="order-item-image">🚗</div>
                <div class="order-item-info">
                    <div class="order-item-name">遥控越野赛车 四驱动力版</div>
                    <div class="order-item-spec">标准版</div>
                    <div class="order-item-bottom">
                        <span class="order-item-price">¥299</span>
                        <span class="order-item-qty">x1</span>
                    </div>
                </div>
            </div>
            
            <div class="order-item" id="checkout-item-2" style="display:none;">
                <div class="order-item-image">🧸</div>
                <div class="order-item-info">
                    <div class="order-item-name">超大号泰迪熊 柔软绒毛</div>
                    <div class="order-item-spec">粉色 80cm</div>
                    <div class="order-item-bottom">
                        <span class="order-item-price">¥188</span>
                        <span class="order-item-qty">x1</span>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="order-remark">
            <span class="order-remark-label">备注</span>
            <input type="text" class="order-remark-input" placeholder="选填，可留言给商家" id="order-remark">
        </div>
        
        <div class="order-summary">
            <div class="summary-row">
                <span class="label">商品金额</span>
                <span class="value" id="checkout-goods-price">¥299</span>
            </div>
            <div class="summary-row">
                <span class="label">运费</span>
                <span class="value" style="color:#00b894;">免运费</span>
            </div>
            <div class="summary-row">
                <span class="label">优惠</span>
                <span class="value" style="color:#00b894;">-¥0</span>
            </div>
            <div class="summary-row total">
                <span class="label">合计</span>
                <span class="value" id="checkout-total">¥299</span>
            </div>
        </div>
        
        <div class="order-submit-bar">
            <div>
                <span class="order-total-label">实付金额：</span>
                <span class="order-total-price" id="checkout-pay-price">¥299</span>
            </div>
            <button class="order-submit-btn" onclick="submitOrder()">提交订单</button>
        </div>
    </div>
    
    <!-- 订单列表页 -->
    <div id="page-orders" class="page">
        <div class="header">
            <div class="header-back" onclick="goBack()">←</div>
            <div class="header-title">我的订单</div>
            <div class="header-right"></div>
        </div>
        
        <div class="order-tabs">
            <div class="order-tab active" onclick="switchOrderTab(this, 'all')">全部</div>
            <div class="order-tab" onclick="switchOrderTab(this, 'pending')">待付款</div>
            <div class="order-tab" onclick="switchOrderTab(this, 'shipped')">待收货</div>
            <div class="order-tab" onclick="switchOrderTab(this, 'completed')">已完成</div>
        </div>
        
        <div class="order-list" id="order-list">
            <div class="order-card" data-status="shipped">
                <div class="order-card-header">
                    <div class="order-shop-title">
                        <span>🏪</span>
                        <span>梦幻玩具屋</span>
                    </div>
                    <div class="order-status">待收货</div>
                </div>
                <div class="order-card-item">
                    <div class="order-card-image">🚗</div>
                    <div class="order-card-info">
                        <div class="order-card-name">遥控越野赛车 四驱动力版</div>
                        <div class="order-card-bottom">
                            <span class="order-card-price">¥299</span>
                            <span class="order-card-qty">x1</span>
                        </div>
                    </div>
                </div>
                <div class="order-card-footer">
                    <div class="order-card-total">合计：<span>¥299</span></div>
                    <div>
                        <button class="order-action-btn" onclick="showPage('page-logistics')">查看物流</button>
                        <button class="order-action-btn primary" onclick="confirmReceive()">确认收货</button>
                    </div>
                </div>
            </div>
            
            <div class="order-card" data-status="completed">
                <div class="order-card-header">
                    <div class="order-shop-title">
                        <span>🏪</span>
                        <span>智趣玩具专营店</span>
                    </div>
                    <div class="order-status" style="color:#999;">已完成</div>
                </div>
                <div class="order-card-item">
                    <div class="order-card-image">🧱</div>
                    <div class="order-card-info">
                        <div class="order-card-name">智能积木机器人 编程版</div>
                        <div class="order-card-bottom">
                            <span class="order-card-price">¥459</span>
                            <span class="order-card-qty">x1</span>
                        </div>
                    </div>
                </div>
                <div class="order-card-footer">
                    <div class="order-card-total">合计：<span>¥459</span></div>
                    <div>
                        <button class="order-action-btn" onclick="showPage('page-refund')">申请售后</button>
                        <button class="order-action-btn" onclick="showPage('page-review')">再次购买</button>
                    </div>
                </div>
            </div>
            
            <div class="order-card" data-status="pending">
                <div class="order-card-header">
                    <div class="order-shop-title">
                        <span>🏪</span>
                        <span>梦幻玩具屋</span>
                    </div>
                    <div class="order-status">待付款</div>
                </div>
                <div class="order-card-item">
                    <div class="order-card-image">🧸</div>
                    <div class="order-card-info">
                        <div class="order-card-name">超大号泰迪熊 柔软绒毛</div>
                        <div class="order-card-bottom">
                            <span class="order-card-price">¥188</span>
                            <span class="order-card-qty">x1</span>
                        </div>
                    </div>
                </div>
                <div class="order-card-footer">
                    <div class="order-card-total">合计：<span>¥188</span></div>
                    <div>
                        <button class="order-action-btn" onclick="cancelOrder(this)">取消订单</button>
                        <button class="order-action-btn primary" onclick="payOrder(this)">去付款</button>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="tab-bar">
            <div class="tab-item" onclick="showPage('page-home')">
                <span class="tab-icon">🏠</span>
                <span class="tab-label">首页</span>
            </div>
            <div class="tab-item" onclick="showPage('page-category')">
                <span class="tab-icon">📦</span>
                <span class="tab-label">分类</span>
            </div>
            <div class="tab-item" onclick="showPage('page-cart')">
                <span class="tab-icon">🛒</span>
                <span class="tab-label">购物车</span>
            </div>
            <div class="tab-item active">
                <span class="tab-icon">📝</span>
                <span class="tab-label">订单</span>
            </div>
            <div class="tab-item" onclick="showPage('page-merchant')">
                <span class="tab-icon">👤</span>
                <span class="tab-label">我的</span>
            </div>
        </div>
    </div>
    
    <!-- 商家入驻页 -->
    <div id="page-settle" class="page">
        <div class="header">
            <div class="header-back" onclick="goBack()">←</div>
            <div class="header-title">商家入驻</div>
            <div class="header-right"></div>
        </div>
        
        <div class="settle-banner">
            <div class="settle-banner-icon">🏪</div>
            <div class="settle-banner-title">玩具厂家直招入驻</div>
            <div class="settle-banner-desc">零门槛入驻 · 统一发货 · 全渠道营销</div>
        </div>
        
        <div class="settle-benefits">
            <div class="benefit-item">
                <div class="benefit-icon">📦</div>
                <div class="benefit-title">统一仓储</div>
                <div class="benefit-desc">厂家统一仓储管理</div>
            </div>
            <div class="benefit-item">
                <div class="benefit-icon">🚚</div>
                <div class="benefit-title">物流保障</div>
                <div class="benefit-desc">平台统一物流配送</div>
            </div>
            <div class="benefit-item">
                <div class="benefit-icon">💰</div>
                <div class="benefit-title">快速回款</div>
                <div class="benefit-desc">订单完成后快速结算</div>
            </div>
            <div class="benefit-item">
                <div class="benefit-icon">📈</div>
                <div class="benefit-title">流量扶持</div>
                <div class="benefit-desc">新人流量扶持计划</div>
            </div>
        </div>
        
        <div class="settle-form">
            <div class="form-title">企业信息</div>
            
            <div class="form-item">
                <label class="form-label">公司名称</label>
                <input type="text" class="form-input" placeholder="请输入公司全称" id="company-name">
            </div>
            
            <div class="form-row">
                <div class="form-item">
                    <label class="form-label">联系人</label>
                    <input type="text" class="form-input" placeholder="联系人姓名" id="contact-name">
                </div>
                <div class="form-item">
                    <label class="form-label">联系电话</label>
                    <input type="tel" class="form-input" placeholder="手机号码" id="contact-phone">
                </div>
            </div>
            
            <div class="form-item">
                <label class="form-label">主营类目</label>
                <input type="text" class="form-input" placeholder="如：遥控玩具、积木拼装等" id="main-category">
            </div>
            
            <div class="form-item">
                <label class="form-label">营业执照</label>
                <div class="form-upload" onclick="showToast('上传营业执照')">
                    <div class="form-upload-icon">📄</div>
                    <div class="form-upload-text">点击上传营业执照照片</div>
                </div>
            </div>
            
            <div class="form-item">
                <label class="form-label">生产许可证</label>
                <div class="form-upload" onclick="showToast('上传生产许可证')">
                    <div class="form-upload-icon">🎫</div>
                    <div class="form-upload-text">点击上传生产许可证照片</div>
                </div>
            </div>
        </div>
        
        <div class="settle-agreement">
            <div class="agreement-checkbox" onclick="toggleAgreement(this)"></div>
            <span>我已阅读并同意</span>
            <span class="agreement-link" onclick="showToast('查看入驻协议')">《商家入驻协议》</span>
        </div>
        
        <button class="settle-submit-btn" onclick="submitSettle()">提交入驻申请</button>
        
        <div style="height:30px;"></div>
    </div>
    
    <!-- 商家中心页 -->
    <div id="page-merchant" class="page">
        <div class="merchant-header">
            <div class="merchant-profile">
                <div class="merchant-avatar">👤</div>
                <div class="merchant-info">
                    <div class="merchant-name">张小明</div>
                    <div class="merchant-shop-name">梦幻玩具屋</div>
                    <div class="merchant-badge">✨ 已认证商家</div>
                </div>
            </div>
            
            <div class="merchant-stats">
                <div class="stat-item">
                    <div class="stat-value">¥12,580</div>
                    <div class="stat-label">今日销售额</div>
                </div>
                <div class="stat-item">
                    <div class="stat-value">86</div>
                    <div class="stat-label">今日订单</div>
                </div>
                <div class="stat-item">
                    <div class="stat-value">256</div>
                    <div class="stat-label">商品数</div>
                </div>
                <div class="stat-item">
                    <div class="stat-value">4.9</div>
                    <div class="stat-label">店铺评分</div>
                </div>
            </div>
        </div>
        
        <div class="merchant-quick">
            <div class="quick-item" onclick="showPage('page-goods')">
                <div class="quick-icon">📦</div>
                <div class="quick-label">商品管理</div>
            </div>
            <div class="quick-item" onclick="showPage('page-merchant-orders')">
                <div class="quick-icon">📝</div>
                <div class="quick-label">订单管理</div>
            </div>
            <div class="quick-item" onclick="showPage('page-shop-setting')">
                <div class="quick-icon">⚙️</div>
                <div class="quick-label">店铺设置</div>
            </div>
            <div class="quick-item" onclick="showPage('page-data-center')">
                <div class="quick-icon">📊</div>
                <div class="quick-label">数据中心</div>
            </div>
        </div>
        
        <div class="merchant-orders">
            <div class="merchant-orders-header" onclick="showPage('page-merchant-orders')">
                <span class="merchant-orders-title">最近订单</span>
                <span class="merchant-orders-more">查看全部 ></span>
            </div>
            <div class="order-list-mini">
                <div class="order-mini-item">
                    <div class="order-mini-num">12</div>
                    <div class="order-mini-label">待发货</div>
                </div>
                <div class="order-mini-item">
                    <div class="order-mini-num">28</div>
                    <div class="order-mini-label">已发货</div>
                </div>
                <div class="order-mini-item">
                    <div class="order-mini-num">45</div>
                    <div class="order-mini-label">已完成</div>
                </div>
                <div class="order-mini-item">
<div class="order-mini-num">3</div>
                    <div class="order-mini-label">退款中</div>
                </div>
            </div>
        </div>
        
        <div class="merchant-tools">
            <div class="tool-item" onclick="showPage('page-goods')">
                <div class="tool-icon">📦</div>
                <div class="tool-name">商品管理</div>
                <div class="tool-arrow">></div>
            </div>
            <div class="tool-item" onclick="showPage('page-merchant-orders')">
                <div class="tool-icon">📝</div>
                <div class="tool-name">订单管理</div>
                <div class="tool-arrow">></div>
            </div>
            <div class="tool-item" onclick="showPage('page-shop-setting')">
                <div class="tool-icon">🏪</div>
                <div class="tool-name">店铺信息</div>
                <div class="tool-arrow">></div>
            </div>
            <div class="tool-item" onclick="showPage('page-settlement')">
                <div class="tool-icon">💰</div>
                <div class="tool-name">资金管理</div>
                <div class="tool-arrow">></div>
            </div>
            <div class="tool-item" onclick="showPage('page-customer')">
                <div class="tool-icon">💬</div>
                <div class="tool-name">在线客服</div>
                <div class="tool-arrow">></div>
            </div>
        </div>
        
        <div class="tab-bar">
            <div class="tab-item" onclick="showPage('page-home')">
                <span class="tab-icon">🏠</span>
                <span class="tab-label">首页</span>
            </div>
            <div class="tab-item" onclick="showPage('page-category')">
                <span class="tab-icon">📦</span>
                <span class="tab-label">分类</span>
            </div>
            <div class="tab-item" onclick="showPage('page-cart')">
                <span class="tab-icon">🛒</span>
                <span class="tab-label">购物车</span>
            </div>
            <div class="tab-item" onclick="showPage('page-orders')">
                <span class="tab-icon">📝</span>
                <span class="tab-label">订单</span>
            </div>
            <div class="tab-item active">
                <span class="tab-icon">👤</span>
                <span class="tab-label">我的</span>
            </div>
        </div>
    </div>
    
    <!-- 商品管理页 -->
    <div id="page-goods" class="page">
        <div class="header">
            <div class="header-back" onclick="goBack()">←</div>
            <div class="header-title">商品管理</div>
            <div class="header-right"></div>
        </div>
        
        <div class="goods-header">
            <span class="goods-tab active" onclick="switchGoodsTab(this)">全部 (256)</span>
            <span class="goods-tab" onclick="switchGoodsTab(this)">在售 (198)</span>
            <span class="goods-tab" onclick="switchGoodsTab(this)">下架 (58)</span>
            <span class="goods-add-btn" onclick="showPage('page-add-goods')">+ 添加</span>
        </div>
        
        <div class="goods-list">
            <div class="goods-item">
                <div class="goods-item-header">
                    <div class="goods-item-shop">
                        <span class="goods-item-icon">🏪</span>
                        <span class="goods-item-name">梦幻玩具屋</span>
                    </div>
                    <span class="goods-item-status on">在售</span>
                </div>
                <div class="goods-item-content">
                    <div class="goods-item-image">🚗</div>
                    <div class="goods-item-info">
                        <div class="goods-item-title">遥控越野赛车 四驱动力版</div>
                        <div class="goods-item-price">¥299</div>
                        <div class="goods-item-stats">
                            <span>库存 520</span>
                            <span>销量 12,000</span>
                        </div>
                    </div>
                </div>
                <div class="goods-item-actions">
                    <span class="goods-action" onclick="showPage('page-add-goods')">编辑</span>
                    <span class="goods-action" onclick="toggleGoodsStatus(this)">下架</span>
                    <span class="goods-action" onclick="showToast('删除商品')">删除</span>
                </div>
            </div>
            
            <div class="goods-item">
                <div class="goods-item-header">
                    <div class="goods-item-shop">
                        <span class="goods-item-icon">🏪</span>
                        <span class="goods-item-name">梦幻玩具屋</span>
                    </div>
                    <span class="goods-item-status on">在售</span>
                </div>
                <div class="goods-item-content">
                    <div class="goods-item-image">🧱</div>
                    <div class="goods-item-info">
                        <div class="goods-item-title">智能积木机器人 编程版</div>
                        <div class="goods-item-price">¥459</div>
                        <div class="goods-item-stats">
                            <span>库存 328</span>
                            <span>销量 8,500</span>
                        </div>
                    </div>
                </div>
                <div class="goods-item-actions">
                    <span class="goods-action" onclick="showPage('page-add-goods')">编辑</span>
                    <span class="goods-action" onclick="toggleGoodsStatus(this)">下架</span>
                    <span class="goods-action" onclick="showToast('删除商品')">删除</span>
                </div>
            </div>
            
            <div class="goods-item">
                <div class="goods-item-header">
                    <div class="goods-item-shop">
                        <span class="goods-item-icon">🏪</span>
                        <span class="goods-item-name">梦幻玩具屋</span>
                    </div>
                    <span class="goods-item-status off">下架</span>
                </div>
                <div class="goods-item-content">
                    <div class="goods-item-image">🎮</div>
                    <div class="goods-item-info">
                        <div class="goods-item-title">儿童游戏机 经典款</div>
                        <div class="goods-item-price">¥168</div>
                        <div class="goods-item-stats">
                            <span>库存 0</span>
                            <span>销量 5,200</span>
                        </div>
                    </div>
                </div>
                <div class="goods-item-actions">
                    <span class="goods-action" onclick="showPage('page-add-goods')">编辑</span>
                    <span class="goods-action" onclick="toggleGoodsStatus(this)">上架</span>
                    <span class="goods-action" onclick="showToast('删除商品')">删除</span>
                </div>
            </div>
        </div>
    </div>
    
    <!-- 订单管理页 -->
    <div id="page-merchant-orders" class="page">
        <div class="header">
            <div class="header-back" onclick="goBack()">←</div>
            <div class="header-title">订单管理</div>
            <div class="header-right"></div>
        </div>
        
        <div class="merchant-order-filters">
            <span class="order-filter active" onclick="switchMOrderFilter(this)">全部</span>
            <span class="order-filter" onclick="switchMOrderFilter(this)">待发货 (12)</span>
            <span class="order-filter" onclick="switchMOrderFilter(this)">已发货 (28)</span>
            <span class="order-filter" onclick="switchMOrderFilter(this)">已完成 (45)</span>
            <span class="order-filter" onclick="switchMOrderFilter(this)">退款 (3)</span>
        </div>
        
        <div class="merchant-order-list">
            <div class="m-order-card">
                <div class="m-order-header">
                    <span class="m-order-id">订单号：TM20240519001</span>
                    <span class="m-order-status">待发货</span>
                </div>
                <div class="m-order-content">
                    <div class="m-order-item">
                        <div class="m-order-image">🚗</div>
                        <div class="m-order-info">
                            <div class="m-order-title">遥控越野赛车 四驱动力版</div>
                            <div class="m-order-spec">标准版 x1</div>
                            <div class="m-order-bottom">
                                <span class="m-order-price">¥299</span>
                                <span class="m-order-qty">买家：张小明</span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="m-order-footer">
                    <div class="m-order-total">实收：<span>¥299</span></div>
                    <div class="m-order-actions">
                        <button class="m-order-btn" onclick="showPage('page-customer')">联系买家</button>
                        <button class="m-order-btn primary" onclick="shipOrder(this)">立即发货</button>
                    </div>
                </div>
            </div>
            
            <div class="m-order-card">
                <div class="m-order-header">
                    <span class="m-order-id">订单号：TM20240519002</span>
                    <span class="m-order-status" style="color:#0984e3;">已发货</span>
                </div>
                <div class="m-order-content">
                    <div class="m-order-item">
                        <div class="m-order-image">🧱</div>
                        <div class="m-order-info">
                            <div class="m-order-title">智能积木机器人 编程版</div>
                            <div class="m-order-spec">升级版 x1</div>
                            <div class="m-order-bottom">
                                <span class="m-order-price">¥459</span>
                                <span class="m-order-qty">买家：李小红</span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="m-order-footer">
                    <div class="m-order-total">实收：<span>¥459</span></div>
                    <div class="m-order-actions">
                        <button class="m-order-btn" onclick="showToast('查看物流')">查看物流</button>
                    </div>
                </div>
            </div>
            
            <div class="m-order-card">
                <div class="m-order-header">
                    <span class="m-order-id">订单号：TM20240518003</span>
                    <span class="m-order-status" style="color:#00b894;">已完成</span>
                </div>
                <div class="m-order-content">
                    <div class="m-order-item">
                        <div class="m-order-image">🧸</div>
                        <div class="m-order-info">
                            <div class="m-order-title">超大号泰迪熊 柔软绒毛</div>
                            <div class="m-order-spec">粉色 80cm x1</div>
                            <div class="m-order-bottom">
                                <span class="m-order-price">¥188</span>
                                <span class="m-order-qty">买家：王小明</span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="m-order-footer">
                    <div class="m-order-total">实收：<span>¥188</span></div>
                    <div class="m-order-actions">
                        <button class="m-order-btn" onclick="showPage('page-review')">查看评价</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <!-- 店铺设置页 -->
    <div id="page-shop-setting" class="page">
        <div class="header">
            <div class="header-back" onclick="goBack()">←</div>
            <div class="header-title">店铺设置</div>
            <div class="header-right"></div>
        </div>
        
        <div class="shop-avatar-upload">
            <div class="shop-avatar-preview">🏪</div>
            <div>
                <div style="font-size:14px;color:#333;">店铺头像</div>
                <div class="shop-avatar-tip">点击更换店铺头像</div>
            </div>
        </div>
        
        <div class="shop-setting-form">
            <div class="shop-form-item">
                <div class="shop-form-row">
                    <span class="shop-form-label">店铺名称</span>
                    <input type="text" class="shop-form-input" value="梦幻玩具屋" id="shop-name">
                </div>
            </div>
            
            <div class="shop-form-item">
                <div class="shop-form-row">
                    <span class="shop-form-label">店铺简介</span>
                    <input type="text" class="shop-form-input" value="专注儿童玩具10年，品质保障！" id="shop-desc">
                </div>
            </div>
            
            <div class="shop-form-item">
                <div class="shop-form-row">
                    <span class="shop-form-label">联系电话</span>
                    <input type="text" class="shop-form-input" value="400-888-8888" id="shop-phone">
                </div>
            </div>
            
            <div class="shop-form-item">
                <div class="shop-form-row">
                    <span class="shop-form-label">主营类目</span>
                    <select class="shop-form-select" id="shop-category">
                        <option value="遥控玩具" selected>遥控玩具</option>
                        <option value="积木拼装">积木拼装</option>
                        <option value="毛绒玩偶">毛绒玩偶</option>
                        <option value="益智玩具">益智玩具</option>
                    </select>
                </div>
            </div>
            
            <div class="shop-form-item">
                <div class="shop-form-row">
                    <span class="shop-form-label">店铺状态</span>
                    <select class="shop-form-select" id="shop-status">
                        <option value="营业中" selected>营业中</option>
                        <option value="休息中">休息中</option>
                    </select>
                </div>
            </div>
        </div>
        
        <button onclick="saveShopSetting()" style="display:block;width:calc(100% - 30px);margin:20px 15px;padding:14px;background:linear-gradient(135deg, #ff4757 0%, #ff6b81 100%);color:#fff;border:none;border-radius:25px;font-size:16px;cursor:pointer;">保存设置</button>
        
        <div style="height:50px;"></div>
    </div>
    
    <!-- 支付成功页 -->
    <div id="page-pay-success" class="page">
        <div class="pay-success">
            <div class="pay-success-icon">✓</div>
            <div class="pay-success-title">订单提交成功</div>
            <div class="pay-success-desc">请完成支付，支付成功后商家将尽快发货</div>
            <div class="pay-success-amount" id="pay-amount">¥299</div>
            
            <div class="pay-success-btn">
                <button class="pay-btn" onclick="showPage('page-orders')">查看订单</button>
                <button class="pay-btn primary" onclick="showPage('page-home')">继续购物</button>
            </div>
        </div>
    </div>
    
    <!-- 分类页 -->
    <div id="page-category" class="page">
        <div class="header">
            <div class="header-back" onclick="goBack()">←</div>
            <div class="header-title">商品分类</div>
            <div class="header-right"></div>
        </div>
        
        <div style="display:flex;height:calc(100vh - 60px);">
            <div style="width:80px;background:#f5f5f5;overflow-y:auto;">
                <div style="padding:20px 0;text-align:center;background:#fff;color:#ff4757;font-size:14px;">遥控玩具</div>
                <div style="padding:20px 0;text-align:center;font-size:14px;color:#666;">积木拼装</div>
                <div style="padding:20px 0;text-align:center;font-size:14px;color:#666;">毛绒玩偶</div>
                <div style="padding:20px 0;text-align:center;font-size:14px;color:#666;">益智玩具</div>
                <div style="padding:20px 0;text-align:center;font-size:14px;color:#666;">户外运动</div>
                <div style="padding:20px 0;text-align:center;font-size:14px;color:#666;">模型玩具</div>
                <div style="padding:20px 0;text-align:center;font-size:14px;color:#666;">早教启蒙</div>
                <div style="padding:20px 0;text-align:center;font-size:14px;color:#666;">电动玩具</div>
            </div>
            
            <div style="flex:1;padding:15px;background:#fff;overflow-y:auto;">
                <div style="font-size:14px;color:#666;margin-bottom:15px;">遥控玩具 - 共 128 件商品</div>
                
                <div class="product-grid" style="grid-template-columns: repeat(2, 1fr);gap:10px;">
                    <div class="product-card" onclick="showPage('page-detail', 0)">
                        <div class="product-image" style="height:120px;">🚗</div>
                        <div class="product-info">
                            <div class="product-name">遥控越野赛车 四驱动力版</div>
                            <div class="product-price">¥<span>299</span></div>
                        </div>
                    </div>
                    <div class="product-card" onclick="showPage('page-detail', 1)">
                        <div class="product-image" style="height:120px;">🚁</div>
                        <div class="product-info">
                            <div class="product-name">遥控直升机 三通道</div>
                            <div class="product-price">¥<span>199</span></div>
                        </div>
                    </div>
                    <div class="product-card" onclick="showPage('page-detail', 3)">
                        <div class="product-image" style="height:120px;">🚂</div>
                        <div class="product-info">
                            <div class="product-name">遥控轨道火车 电动</div>
                            <div class="product-price">¥<span>258</span></div>
                        </div>
                    </div>
                    <div class="product-card" onclick="showPage('page-detail', 5)">
                        <div class="product-image" style="height:120px;">🚜</div>
                        <div class="product-info">
                            <div class="product-name">遥控挖掘机 工程版</div>
                            <div class="product-price">¥<span>328</span></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="tab-bar">
            <div class="tab-item" onclick="showPage('page-home')">
                <span class="tab-icon">🏠</span>
                <span class="tab-label">首页</span>
            </div>
            <div class="tab-item active">
                <span class="tab-icon">📦</span>
                <span class="tab-label">分类</span>
            </div>
            <div class="tab-item" onclick="showPage('page-cart')">
                <span class="tab-icon">🛒</span>
                <span class="tab-label">购物车</span>
            </div>
            <div class="tab-item" onclick="showPage('page-orders')">
                <span class="tab-icon">📝</span>
                <span class="tab-label">订单</span>
            </div>
            <div class="tab-item" onclick="showPage('page-merchant')">
                <span class="tab-icon">👤</span>
                <span class="tab-label">我的</span>
            </div>
        </div>
    </div>
    
    <!-- 规格选择弹窗 -->
    <div class="modal-overlay" id="spec-modal" onclick="closeSpecModal()"></div>
    <div class="modal" id="spec-modal-content">
        <div class="modal-header">
            <span class="modal-title">选择规格</span>
            <span class="modal-close" onclick="closeSpecModal()">×</span>
        </div>
        <div class="modal-content">
            <div class="spec-sku">
                <div class="spec-sku-image" id="spec-sku-image">🚗</div>
                <div class="spec-sku-info">
                    <div class="spec-sku-price" id="spec-price">¥299</div>
                    <div class="spec-sku-stock">库存 520 件</div>
                </div>
            </div>
            
            <div class="spec-group">
                <div class="spec-group-title">选择版本</div>
                <div class="spec-options-modal">
                    <span class="spec-option-modal active" onclick="selectSpecModal(this)">标准版</span>
                    <span class="spec-option-modal" onclick="selectSpecModal(this)">升级版 +¥100</span>
                    <span class="spec-option-modal" onclick="selectSpecModal(this)">豪华版 +¥200</span>
                </div>
            </div>
            
            <div class="spec-group">
                <div class="spec-group-title">选择颜色</div>
                <div class="spec-options-modal">
                    <span class="spec-option-modal active" onclick="selectSpecModal(this)">红色</span>
                    <span class="spec-option-modal" onclick="selectSpecModal(this)">蓝色</span>
                    <span class="spec-option-modal" onclick="selectSpecModal(this)">黄色</span>
                    <span class="spec-option-modal disabled">黑色 (缺货)</span>
                </div>
            </div>
            
            <div class="quantity-section">
                <span class="quantity-label">购买数量</span>
                <div class="quantity-control-modal">
                    <div class="quantity-btn-modal" onclick="changeModalQty(-1)">-</div>
                    <div class="quantity-num-modal" id="modal-qty">1</div>
                    <div class="quantity-btn-modal" onclick="changeModalQty(1)">+</div>
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button class="modal-btn" onclick="addToCartFromModal()">加入购物车</button>
            <button class="modal-btn primary" onclick="buyNowFromModal()">立即购买</button>
        </div>
    </div>
    
    <!-- Toast -->
    <div class="toast" id="toast">提示信息</div>
    
    <script>
        // 商品数据
        const products = [
            { id: 0, emoji: '🚗', name: '遥控越野赛车 四驱动力版', price: 299, originalPrice: 399, shop: '梦幻玩具屋', sales: '1.2万' },
            { id: 1, emoji: '🧱', name: '智能积木机器人 编程版', price: 459, originalPrice: 599, shop: '梦幻玩具屋', sales: '8千' },
            { id: 2, emoji: '🧸', name: '超大号泰迪熊 柔软绒毛', price: 188, originalPrice: 268, shop: '梦幻玩具屋', sales: '2.3万' },
            { id: 3, emoji: '🎮', name: '儿童游戏机 经典款', price: 168, originalPrice: 228, shop: '智趣玩具专营店', sales: '5千' },
            { id: 4, emoji: '🚁', name: '遥控直升机 三通道', price: 199, originalPrice: 299, shop: '智趣玩具专营店', sales: '3千' },
            { id: 5, emoji: '🚂', name: '遥控轨道火车 电动', price: 258, originalPrice: 358, shop: '智趣玩具专营店', sales: '4千' }
        ];
        
        // 页面历史栈
        let pageHistory = ['page-home'];
        let currentProductIndex = 0;
        let modalAction = ''; // 'addCart' or 'buyNow'
        
        // 显示页面
        function showPage(pageId, productIndex) {
            if (productIndex !== undefined) {
                currentProductIndex = productIndex;
                updateDetailPage(products[productIndex]);
            }
            
            // 隐藏所有页面
            document.querySelectorAll('.page').forEach(p => p.classList.remove('active'));
            
            // 显示目标页面
            const targetPage = document.getElementById(pageId);
            if (targetPage) {
                targetPage.classList.add('active');
                
                // 如果不是返回，添加到历史
                if (pageHistory[pageHistory.length - 1] !== pageId) {
                    pageHistory.push(pageId);
                }
            }
        }
        
        // 返回上一页
        function goBack() {
            if (pageHistory.length > 1) {
                pageHistory.pop();
                const prevPage = pageHistory[pageHistory.length - 1];
                
                document.querySelectorAll('.page').forEach(p => p.classList.remove('active'));
                document.getElementById(prevPage).classList.add('active');
            }
        }
        
        // 更新商品详情页
        function updateDetailPage(product) {
            document.getElementById('detail-emoji').textContent = product.emoji;
            document.getElementById('detail-price').textContent = '¥' + product.price;
            document.getElementById('detail-original').textContent = '¥' + product.originalPrice;
            document.getElementById('detail-title').textContent = product.name;
        }
        
        // Toast 提示
        function showToast(message) {
            const toast = document.getElementById('toast');
            toast.textContent = message;
            toast.classList.add('show');
            
            setTimeout(() => {
                toast.classList.remove('show');
            }, 2000);
        }
        
        // 加入购物车
        function addToCart() {
            modalAction = 'addCart';
            showSpecModal();
        }
        
        // 立即购买
        function buyNow() {
            modalAction = 'buyNow';
            showSpecModal();
        }
        
        // 显示规格弹窗
        function showSpecModal() {
            document.getElementById('spec-modal').classList.add('show');
            document.getElementById('spec-modal-content').classList.add('show');
        }
        
        // 关闭规格弹窗
        function closeSpecModal() {
            document.getElementById('spec-modal').classList.remove('show');
            document.getElementById('spec-modal-content').classList.remove('show');
        }
        
        // 选择规格
        function selectSpec(element, event) {
            event.stopPropagation();
            document.querySelectorAll('.spec-option').forEach(opt => opt.classList.remove('active'));
            element.classList.add('active');
        }
        
        // 选择弹窗中的规格
        function selectSpecModal(element) {
            if (element.classList.contains('disabled')) return;
            const parent = element.parentElement;
            parent.querySelectorAll('.spec-option-modal').forEach(opt => opt.classList.remove('active'));
            element.classList.add('active');
        }
        
        // 修改弹窗中的数量
        function changeModalQty(delta) {
            const qtyEl = document.getElementById('modal-qty');
            let qty = parseInt(qtyEl.textContent) + delta;
            if (qty < 1) qty = 1;
            if (qty > 99) qty = 99;
            qtyEl.textContent = qty;
        }
        
        // 从弹窗加入购物车
        function addToCartFromModal() {
            closeSpecModal();
            showToast('已加入购物车');
            updateCartBadge();
        }
        
        // 从弹窗立即购买
        function buyNowFromModal() {
            closeSpecModal();
            showPage('page-checkout');
        }
        
        // 更新购物车徽章
        function updateCartBadge() {
            const badge = document.getElementById('cart-badge');
            const badgeBottom = document.getElementById('cart-badge-bottom');
            badge.style.display = 'block';
            badge.textContent = '1';
            if (badgeBottom) {
                badgeBottom.style.display = 'block';
                badgeBottom.textContent = '1';
            }
        }
        
        // 切换购物车选中状态
        function toggleCartCheck(element) {
            element.classList.toggle('checked');
            element.parentElement.classList.toggle('checked');
            updateCartTotal();
        }
        
        // 全选/取消全选
        function toggleAllCheck(element) {
            element.classList.toggle('all-checked');
            const isChecked = element.classList.contains('all-checked');
            document.querySelectorAll('.cart-item .cart-check').forEach(check => {
                if (isChecked) {
                    check.classList.add('checked');
                    check.parentElement.classList.add('checked');
                } else {
                    check.classList.remove('checked');
                    check.parentElement.classList.remove('checked');
                }
            });
            updateCartTotal();
        }
        
        // 修改购物车商品数量
        function changeQty(element, delta) {
            const qtyEl = element.parentElement.querySelector('.quantity-num');
            let qty = parseInt(qtyEl.textContent) + delta;
            if (qty < 1) qty = 1;
            if (qty > 99) qty = 99;
            qtyEl.textContent = qty;
            updateCartTotal();
        }
        
        // 更新购物车总价
        function updateCartTotal() {
            let total = 0;
            document.querySelectorAll('.cart-item.checked .cart-item-price').forEach(priceEl => {
                const price = parseInt(priceEl.textContent.replace('¥', ''));
                const qty = parseInt(priceEl.parentElement.querySelector('.quantity-num').textContent);
                total += price * qty;
            });
            document.getElementById('cart-total-price').textContent = '¥' + total;
        }
        
        // 清空购物车
        function clearCart() {
            document.getElementById('cart-list').innerHTML = '';
            document.getElementById('cart-bottom').style.display = 'none';
            document.getElementById('cart-empty').style.display = 'block';
        }
        
        // 去结算
        function goCheckout() {
            showPage('page-checkout');
        }
        
        // 提交订单
        function submitOrder() {
            const total = document.getElementById('checkout-pay-price').textContent;
            document.getElementById('pay-amount').textContent = total;
            showPage('page-pay-success');
        }
        
        // 切换订单标签
        function switchOrderTab(element, status) {
            element.parentElement.querySelectorAll('.order-tab').forEach(tab => tab.classList.remove('active'));
            element.classList.add('active');
            showToast('筛选 ' + status + ' 订单');
        }
        
        // 取消订单
        function cancelOrder(element) {
            showConfirmModal('确定要取消该订单吗？', () => {
                element.closest('.order-card').remove();
                showToast('订单已取消');
            });
        }
        
        // 去付款
        function payOrder(element) {
            const card = element.closest('.order-card');
            const total = card.querySelector('.order-card-total span').textContent;
            document.getElementById('pay-amount').textContent = total;
            showPage('page-pay-success');
        }
        
        // 确认收货
        function confirmReceive() {
            showConfirmModal('确认已收到货物吗？', () => {
                showToast('已确认收货');
            });
        }
        
        // 显示确认弹窗
        function showConfirmModal(message, callback) {
            const overlay = document.createElement('div');
            overlay.className = 'modal-overlay show';
            overlay.style.cssText = 'z-index:300;';
            
            const modal = document.createElement('div');
            modal.className = 'modal show';
            modal.style.cssText = 'z-index:301;bottom:50%;transform:translateX(-50%) translateY(50%);border-radius:12px;';
            modal.innerHTML = `
                <div class="modal-header">
                    <span class="modal-title">提示</span>
                    <span class="modal-close" onclick="this.closest('.modal').remove();this.closest('.modal-overlay').remove();">×</span>
                </div>
                <div class="modal-content">
                    <div class="confirm-content">
                        <div class="confirm-text">${message}</div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button class="modal-btn" onclick="this.closest('.modal').remove();this.closest('.modal-overlay').remove();">取消</button>
                    <button class="modal-btn primary" onclick="this.closest('.modal').remove();this.closest('.modal-overlay').remove();if(window.confirmCallback)confirmCallback();">确定</button>
                </div>
            `;
            
            document.body.appendChild(overlay);
            document.body.appendChild(modal);
            
            window.confirmCallback = callback;
        }
        
        // 商家提交入驻
        function submitSettle() {
            const companyName = document.getElementById('company-name').value;
            const contactName = document.getElementById('contact-name').value;
            const contactPhone = document.getElementById('contact-phone').value;
            const mainCategory = document.getElementById('main-category').value;
            
            if (!companyName || !contactName || !contactPhone) {
                showToast('请填写完整信息');
                return;
            }
            
            showConfirmModal('确认提交入驻申请？', () => {
                showToast('提交成功，请等待审核');
                setTimeout(() => {
                    showPage('page-home');
                }, 1500);
            });
        }
        
        // 切换入驻协议勾选
        function toggleAgreement(element) {
            element.classList.toggle('checked');
        }
        
        // 切换商品标签
        function switchGoodsTab(element) {
            element.parentElement.querySelectorAll('.goods-tab').forEach(tab => tab.classList.remove('active'));
            element.classList.add('active');
        }
        
        // 切换商家订单筛选
        function switchMOrderFilter(element) {
            element.parentElement.querySelectorAll('.order-filter').forEach(f => f.classList.remove('active'));
            element.classList.add('active');
        }
        
        // 切换商品上下架状态
        function toggleGoodsStatus(element) {
            const item = element.closest('.goods-item');
            const statusEl = item.querySelector('.goods-item-status');
            
            if (statusEl.classList.contains('on')) {
                statusEl.classList.remove('on');
                statusEl.classList.add('off');
                statusEl.textContent = '下架';
                element.textContent = '上架';
            } else {
                statusEl.classList.remove('off');
                statusEl.classList.add('on');
                statusEl.textContent = '在售';
                element.textContent = '下架';
            }
        }
        
        // 商家发货
        function shipOrder(element) {
            showConfirmModal('确认发货吗？', () => {
                const card = element.closest('.m-order-card');
                card.querySelector('.m-order-status').textContent = '已发货';
                card.querySelector('.m-order-status').style.color = '#0984e3';
                element.textContent = '已发货';
                element.disabled = true;
                showToast('发货成功');
            });
        }
        
        // 保存店铺设置
        function saveShopSetting() {
            const shopName = document.getElementById('shop-name').value;
            if (!shopName) {
                showToast('请输入店铺名称');
                return;
            }
            showToast('保存成功');
        }
        
        // 分类筛选
        function filterByCategory(category) {
            showToast('筛选 ' + category + ' 类商品');
        }
        
        // ========== 新增二级页面功能 ==========
        
        // 选中地址
        function selectAddress(element) {
            showToast('已选择该地址');
            setTimeout(() => goBack(), 500);
        }
        
        // 切换默认地址
        function toggleDefault(element) {
            element.innerHTML = element.innerHTML.includes('默认') ? '☆ 设为默认' : '⭐ 默认地址';
            showToast('已设为默认地址');
        }
        
        // 删除地址
        function deleteAddress(element) {
            showConfirmModal('确定要删除该地址吗？', () => {
                element.closest('.address-list-item').remove();
                showToast('地址已删除');
            });
        }
        
        // 保存地址
        function saveAddress() {
            showToast('地址保存成功');
            goBack();
        }
        
        // 设置评分
        function setRating(num) {
            const stars = document.querySelectorAll('#stars-container .review-star');
            stars.forEach((star, index) => {
                star.classList.toggle('active', index < num);
            });
        }
        
        // 切换评价标签
        function toggleReviewTag(element) {
            element.classList.toggle('active');
        }
        
        // 提交评价
        function submitReview() {
            showToast('评价提交成功');
            goBack();
        }
        
        // 选择提现方式
        function selectWithdrawMethod(element) {
            element.parentElement.querySelectorAll('.withdraw-method-item').forEach(item => {
                item.classList.remove('active');
                item.querySelector('.withdraw-method-check').textContent = '○';
            });
            element.classList.add('active');
            element.querySelector('.withdraw-method-check').textContent = '✓';
        }
        
        // 提交提现
        function submitWithdraw() {
            showToast('提现申请已提交');
            setTimeout(() => goBack(), 1500);
        }
        
        // 选择退款原因
        function selectRefundReason(element) {
            element.parentElement.querySelectorAll('.refund-reason-tag').forEach(tag => tag.classList.remove('active'));
            element.classList.add('active');
        }
        
        // 提交退款
        function submitRefund() {
            showConfirmModal('确定要提交退款申请吗？', () => {
                showToast('退款申请已提交');
                setTimeout(() => goBack(), 1500);
            });
        }
        
        // 切换数据标签
        function switchDataTab(element) {
            element.parentElement.querySelectorAll('.data-chart-tab').forEach(tab => tab.classList.remove('active'));
            element.classList.add('active');
        }
        
        // 提交商品
        function submitGoods() {
            showConfirmModal('确定要发布该商品吗？', () => {
                showToast('商品发布成功');
                setTimeout(() => goBack(), 1500);
            });
        }
        
        // 初始化
        document.addEventListener('DOMContentLoaded', () => {
            // 自动轮播banner
            let currentBanner = 0;
            const totalBanners = 3;
            
            setInterval(() => {
                currentBanner = (currentBanner + 1) % totalBanners;
                document.querySelector('.banner-slider').style.transform = `translateX(-${currentBanner * 100}%)`;
                document.querySelectorAll('.banner-dot').forEach((dot, i) => {
                    dot.classList.toggle('active', i === currentBanner);
                });
            }, 4000);
        });
    </script>
    
    <!-- ========== 新增二级页面 ========== -->
    
    <!-- 收货地址列表页 -->
    <div id="page-address-list" class="page">
        <div class="header">
            <div class="header-back" onclick="goBack()">←</div>
            <div class="header-title">收货地址</div>
            <div class="header-right"></div>
        </div>
        <div class="address-list-container">
            <div class="address-list-item">
                <div class="address-list-content" onclick="selectAddress(this)">
                    <div class="address-list-icon">📍</div>
                    <div class="address-list-info">
                        <div class="address-list-name">张小明 <span>138****8888</span> <span class="address-list-default">默认</span></div>
                        <div class="address-list-detail">广东省深圳市南山区科技园南路88号1栋1001室</div>
                    </div>
                    <div style="font-size:20px;color:#ccc;">></div>
                </div>
                <div class="address-list-actions">
                    <span class="address-action" onclick="toggleDefault(this)">⭐ 默认地址</span>
                    <span class="address-action" onclick="showPage('page-address-edit')">✏️ 编辑</span>
                    <span class="address-action danger" onclick="deleteAddress(this)">🗑️ 删除</span>
                </div>
            </div>
            <div class="address-list-item">
                <div class="address-list-content" onclick="selectAddress(this)">
                    <div class="address-list-icon">📍</div>
                    <div class="address-list-info">
                        <div class="address-list-name">李小红 <span>139****6666</span></div>
                        <div class="address-list-detail">广东省广州市天河区珠江新城花城大道88号2栋2002室</div>
                    </div>
                    <div style="font-size:20px;color:#ccc;">></div>
                </div>
                <div class="address-list-actions">
                    <span class="address-action" onclick="toggleDefault(this)">☆ 设为默认</span>
                    <span class="address-action" onclick="showPage('page-address-edit')">✏️ 编辑</span>
                    <span class="address-action danger" onclick="deleteAddress(this)">🗑️ 删除</span>
                </div>
            </div>
            <div class="address-add-card" onclick="showPage('page-address-edit')">
                <div class="address-add-icon">➕</div>
                <div class="address-add-text">添加新地址</div>
            </div>
        </div>
    </div>
    
    <!-- 编辑/新增地址页 -->
    <div id="page-address-edit" class="page">
        <div class="header">
            <div class="header-back" onclick="goBack()">←</div>
            <div class="header-title">编辑地址</div>
            <div class="header-right"></div>
        </div>
        <div class="address-form">
            <div class="address-form-item">
                <div class="address-form-row">
                    <span class="address-form-label">收货人</span>
                    <input type="text" class="address-form-input" value="张小明" placeholder="请输入收货人姓名">
                </div>
                <div class="address-form-row">
                    <span class="address-form-label">手机号码</span>
                    <input type="tel" class="address-form-input" value="13812348888" placeholder="请输入手机号码">
                </div>
                <div class="address-form-row">
                    <span class="address-form-label">所在地区</span>
                    <select class="address-form-select">
                        <option>广东省 - 深圳市 - 南山区</option>
                    </select>
                </div>
                <div class="address-form-row">
                    <span class="address-form-label">详细地址</span>
                    <input type="text" class="address-form-input" value="科技园南路88号1栋1001室" placeholder="请输入详细地址">
                </div>
                <div class="address-form-row">
                    <span class="address-form-label">设为默认</span>
                    <div class="address-form-switch active" onclick="this.classList.toggle('active')"></div>
                </div>
            </div>
            <button onclick="saveAddress()" style="width:100%;padding:14px;background:linear-gradient(135deg, #ff4757 0%, #ff6b81 100%);color:#fff;border:none;border-radius:25px;font-size:16px;cursor:pointer;margin-top:20px;">保存地址</button>
        </div>
    </div>
    
    <!-- 物流详情页 -->
    <div id="page-logistics" class="page">
        <div class="header">
            <div class="header-back" onclick="goBack()">←</div>
            <div class="header-title">物流详情</div>
            <div class="header-right"></div>
        </div>
        <div class="logistics-detail">
            <div class="logistics-status-card">
                <div class="logistics-status-icon">🚚</div>
                <div class="logistics-status-info">
                    <div class="logistics-status-text">包裹正在配送中</div>
                    <div class="logistics-status-time">预计明天 14:00 前送达</div>
                </div>
            </div>
            <div class="logistics-timeline-card">
                <div class="logistics-timeline-title">物流轨迹</div>
                <div class="timeline-list">
                    <div class="timeline-item-new active">
                        <div class="timeline-dot-new"></div>
                        <div class="timeline-content-new">
                            <div class="timeline-title-new">您的包裹已到达【深圳配送中心】</div>
                            <div class="timeline-time-new">2024-05-19 08:30</div>
                        </div>
                    </div>
                    <div class="timeline-item-new">
                        <div class="timeline-dot-new"></div>
                        <div class="timeline-content-new">
                            <div class="timeline-title-new">您的包裹已从【广州转运中心】发出</div>
                            <div class="timeline-time-new">2024-05-18 16:20</div>
                        </div>
                    </div>
                    <div class="timeline-item-new">
                        <div class="timeline-dot-new"></div>
                        <div class="timeline-content-new">
                            <div class="timeline-title-new">您的包裹已到达【广州转运中心】</div>
                            <div class="timeline-time-new">2024-05-18 14:00</div>
                        </div>
                    </div>
                    <div class="timeline-item-new">
                        <div class="timeline-dot-new"></div>
                        <div class="timeline-content-new">
                            <div class="timeline-title-new">您的包裹已从【厂家仓库】发出</div>
                            <div class="timeline-time-new">2024-05-17 10:30</div>
                        </div>
                    </div>
                    <div class="timeline-item-new">
                        <div class="timeline-dot-new"></div>
                        <div class="timeline-content-new">
                            <div class="timeline-title-new">商家已发货，厂家统一配送</div>
                            <div class="timeline-time-new">2024-05-17 09:00</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <!-- 商品评价页 -->
    <div id="page-review" class="page">
        <div class="header">
            <div class="header-back" onclick="goBack()">←</div>
            <div class="header-title">评价商品</div>
            <div class="header-right"></div>
        </div>
        <div class="review-form-container">
            <div class="review-product-card">
                <div class="review-product-img">🚗</div>
                <div style="flex:1;">
                    <div class="review-product-name">遥控越野赛车 四驱动力版</div>
                    <div style="font-size:12px;color:#999;margin-top:4px;">标准版</div>
                </div>
            </div>
            <div class="review-star-section">
                <div class="review-star-title">商品评分</div>
                <div class="review-stars" id="stars-container">
                    <span class="review-star active" onclick="setRating(1)">⭐</span>
                    <span class="review-star active" onclick="setRating(2)">⭐</span>
                    <span class="review-star active" onclick="setRating(3)">⭐</span>
                    <span class="review-star active" onclick="setRating(4)">⭐</span>
                    <span class="review-star active" onclick="setRating(5)">⭐</span>
                </div>
            </div>
            <div class="review-tags-section">
                <div class="review-star-title">服务评价标签（选填）</div>
                <div class="review-tags-container">
                    <span class="review-tag-item active" onclick="toggleReviewTag(this)">🎁 包装完好</span>
                    <span class="review-tag-item" onclick="toggleReviewTag(this)">🚀 发货快速</span>
                    <span class="review-tag-item" onclick="toggleReviewTag(this)">😊 态度很好</span>
                    <span class="review-tag-item" onclick="toggleReviewTag(this)">📦 玩具质量好</span>
                    <span class="review-tag-item" onclick="toggleReviewTag(this)">👶 孩子喜欢</span>
                </div>
            </div>
            <div class="review-content-section">
                <div class="review-star-title">说说你的购物体验（选填）</div>
                <textarea class="review-textarea-new" placeholder="分享购买体验，帮助更多家长选购优质玩具...">玩具质量很好，孩子玩得很开心！物流也很快，包装完好。
📷
🏪 店铺介绍
梦幻玩具屋专注儿童玩具10年，主营遥控玩具、积木拼装、毛绒玩偶等品类。所有商品均来自正规厂家，品质有保障。厂家统一发货，让您的购物更加便捷！
✓ 实名认证 ✓ 品质保障 ✓ 7天无理由
🔥 热门商品查看更多 >
🚗
遥控越野赛车四驱动力版
¥299
🧱
智能积木机器人编程版
¥459
🧸
超大号泰迪熊柔软绒毛
¥188
🎮
儿童游戏机经典款
¥168