* { margin: 0; padding: 0; box-sizing: border-box; }
    body { font-family: 'Noto Sans SC', sans-serif; background: #faf9f7; color: #3d3328; line-height: 1.6; }
    a { text-decoration: none; color: inherit; }
    button { cursor: pointer; border: none; background: none; font-family: inherit; }
    input, select, textarea { font-family: inherit; }
    
    .container { max-width: 1280px; margin: 0 auto; padding: 0 16px; }
    @media(min-width:640px){ .container { padding: 0 24px; } }
    @media(min-width:1024px){ .container { padding: 0 32px; } }
    
    /* Header */
    header { position: sticky; top: var(--promoH, 0px); z-index: 50; background: rgba(250,249,247,0.95); backdrop-filter: blur(8px); border-bottom: 1px solid #ebe7e0; }
    .header-inner { display: flex; align-items: center; justify-content: space-between; height: 64px; }
    .logo { font-family: 'Noto Serif SC', serif; font-size: 20px; font-weight: 700; color: #3d3328; flex-shrink: 0; }
    .logo .logo-text { white-space: nowrap; }
    .nav-links { display: none; gap: 6px; align-items: center; flex-shrink: 0; }
    @media(min-width:1024px){ .nav-links { display: flex; } }
    .nav-links a { padding: 8px 13px; font-size: 16.5px; font-weight: 600; border-radius: 8px; color: #55483a; transition: all 0.2s; white-space: nowrap; flex-shrink: 0; }
    .nav-links a:hover { color: #2a231a; font-weight: 700; background: #f0ebe2; }
    .nav-links a.active { color: #8B4513; font-weight: 700; }
    /* 1024~1399 宽度略收，防止与登录/购物车挤压 */
    @media(min-width:1024px) and (max-width:1399px){ .nav-links a { padding: 8px 9px; font-size: 15.5px; } }
    /* 导航栏「更多」折叠菜单（⋯） */
    .nav-more { position: relative; }
    .nav-more::after { content: ''; position: absolute; top: 100%; left: -10px; right: -10px; height: 10px; }
    .nav-more-btn { padding: 8px 13px; font-size: 17px; font-weight: 700; line-height: 1; border-radius: 8px; color: #55483a; background: none; border: none; cursor: pointer; letter-spacing: 1px; transition: all 0.2s; white-space: nowrap; flex-shrink: 0; }
    .nav-more-btn:hover, .nav-more:hover .nav-more-btn { color: #2a231a; background: #f0ebe2; }
    .nav-more-list { display: none; position: absolute; top: calc(100% + 6px); right: 0; min-width: 146px; background: #fff; border: 1px solid #e5e0d8; border-radius: 10px; box-shadow: 0 12px 32px rgba(60,40,20,.14); padding: 6px; z-index: 70; }
    .nav-more:hover .nav-more-list, .nav-more.open .nav-more-list { display: block; }
    .nav-more-list a { display: block; padding: 10px 14px; font-size: 15.5px; font-weight: 600; color: #55483a; border-radius: 6px; white-space: nowrap; }
    .nav-more-list a:hover { color: #2a231a; font-weight: 700; background: #f5f1ea; }
    /* 导航栏搜索框（放「首页」前面，字体天下同款布局） */
    .header-search { display: none; position: relative; flex-shrink: 1; min-width: 150px; width: 216px; margin: 0 14px 0 18px; }
    @media(min-width:1200px){ .header-search { display: block; } }
    .header-search-bar { display: flex; align-items: center; height: 38px; background: #fff; border: 1.5px solid #d9d2c6; border-radius: 999px; overflow: hidden; transition: border-color .2s, box-shadow .2s; }
    .header-search-bar:focus-within { border-color: #c41e3a; box-shadow: 0 0 0 3px rgba(196,30,58,.08); }
    .header-search-bar input { flex: 1; min-width: 0; border: none; outline: none; padding: 0 4px 0 16px; font-size: 13.5px; font-family: inherit; color: #3d3328; background: transparent; }
    .header-search-bar input::placeholder { color: #b4a48f; }
    .header-search-bar button { flex-shrink: 0; width: 38px; height: 100%; border: none; background: none; color: #8a7a64; cursor: pointer; display: flex; align-items: center; justify-content: center; }
    .header-search-bar button:hover { color: #c41e3a; }
    .header-search-bar button svg { width: 17px; height: 17px; }
    .header-search .sg-list { position: absolute; top: calc(100% + 6px); left: 0; right: 0; background: #fff; border: 1px solid #e5e0d8; border-radius: 12px; box-shadow: 0 12px 32px rgba(60,40,20,.16); overflow: hidden; z-index: 80; display: none; text-align: left; }
    .header-search .sg-list.show { display: block; }
    .header-search .sg-item { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 14px; font-size: 13.5px; color: #333; cursor: pointer; border-bottom: 1px solid #f4f0ea; }
    .header-search .sg-item:last-child { border-bottom: none; }
    .header-search .sg-item:hover, .header-search .sg-item.active { background: #faf3ec; }
    .header-search .sg-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .header-search .sg-name mark { background: none; color: #c41e3a; font-weight: 700; padding: 0; }
    .header-search .sg-go { flex-shrink: 0; font-size: 11.5px; color: #b09880; }
    .header-search .sg-empty { padding: 12px 14px; font-size: 12.5px; color: #999; text-align: center; }
    .header-actions { display: none; align-items: center; gap: 12px; flex-shrink: 0; white-space: nowrap; }
    @media(min-width:1024px){ .header-actions { display: flex; } }
    .btn-primary { padding: 8px 16px; background: #3d3328; color: #f5f3ef; font-size: 14px; border-radius: 8px; transition: background 0.2s; }
    .btn-primary:hover { background: #2a231a; }
    .mobile-toggle { display: block; padding: 8px; font-size: 22px; line-height: 1; color: #3d3328; }
    @media(min-width:1024px){ .mobile-toggle { display: none; } }
    .mobile-menu { display: none; background: #faf9f7; border-bottom: 1px solid #ebe7e0; padding: 12px 16px; }
    .mobile-menu.open { display: block; }
    .mobile-menu a { display: block; padding: 8px 12px; font-size: 14px; color: #5c4f40; border-radius: 8px; }
    .mobile-menu a:hover { background: #f5f3ef; color: #8B4513; }
    
    /* Hero */
    .hero { position: relative; overflow: hidden; background: #f5f3ef; min-height: 440px; display: flex; align-items: center; }
    .hero-bg { position: absolute; inset: 0; opacity: 0.3; }
    .hero-content { position: relative; padding: 56px 0; }
    .hero h1 { font-family: 'Noto Serif SC', serif; font-size: 48px; font-weight: 700; color: #3d3328; line-height: 1.2; margin-bottom: 24px; }
    @media(min-width:640px){ .hero h1 { font-size: 56px; } }
    @media(min-width:1024px){ .hero h1 { font-size: 72px; } }
    .hero p { font-size: 18px; color: #5c4f40; margin-bottom: 32px; line-height: 1.6; }
    @media(min-width:640px){ .hero p { font-size: 20px; } }
    .hero-buttons { display: flex; flex-wrap: wrap; gap: 16px; justify-content: center; }
    /* 两个按钮统一规格：同高、同字号；button 继承页面字体（否则浏览器默认字体偏小，导致黑按钮比绿按钮大） */
    .hero-btn-main, .hero-btn-sec { display: inline-flex; align-items: center; justify-content: center; gap: 8px; box-sizing: border-box; height: 44px; padding: 0 20px; font-family: inherit; font-size: 15px; font-weight: 500; line-height: 1; border: none; border-radius: 8px; cursor: pointer; white-space: nowrap; text-decoration: none; transition: all 0.2s; }
    .hero-btn-main { background: #3d3328; color: #f5f3ef; }
    .hero-btn-main:hover { background: #2a231a; }
    .hero-btn-sec { background: #07C160; color: #ffffff; box-shadow: 0 2px 8px rgba(7,193,96,0.3); }
    .hero-btn-sec:hover { background: #06a653; box-shadow: 0 4px 12px rgba(7,193,96,0.4); }
    .hero-btn-main svg, .hero-btn-sec svg, .wechat-footer-btn svg { width: 18px; height: 18px; fill: currentColor; flex-shrink: 0; }
    /* 平板：按钮随界面放大 */
    @media(min-width:640px){ .hero-btn-main, .hero-btn-sec { height: 46px; padding: 0 24px; font-size: 15px; } }
    /* 电脑：再放大一档 */
    @media(min-width:1024px){ .hero-btn-main, .hero-btn-sec { height: 48px; padding: 0 28px; font-size: 16px; } }
    /* 小屏手机：两按钮收窄为内容宽度、上下居中排列，两侧留白不撑满屏 */
    @media(max-width:480px){ .hero-buttons { flex-direction: column; align-items: center; gap: 12px; } .hero-btn-main, .hero-btn-sec { flex: 0 0 auto; width: min(72%, 260px); } }

    /* Footer WeChat Button (same style as hero) */
    .wechat-footer-btn { display: inline-flex; align-items: center; gap: 8px; padding: 10px 20px; background: #07C160; color: #ffffff; border: none; border-radius: 8px; font-size: 14px; font-weight: 500; cursor: pointer; transition: all 0.2s; box-shadow: 0 2px 8px rgba(7,193,96,0.25); margin-bottom: 12px; }
    .wechat-footer-btn:hover { background: #06a653; box-shadow: 0 4px 12px rgba(7,193,96,0.35); }

    /* WeChat QR Modal */
    .wechat-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.55); display: none; align-items: center; justify-content: center; z-index: 100; padding: 16px; }
    .wechat-modal-overlay.open { display: flex; }
    .wechat-modal { background: #ffffff; border-radius: 16px; padding: 32px 28px 28px; max-width: 340px; width: 100%; text-align: center; position: relative; box-shadow: 0 20px 60px rgba(0,0,0,0.3); animation: wechatPop 0.25s ease; }
    @keyframes wechatPop { from { transform: scale(0.9); opacity: 0; } to { transform: scale(1); opacity: 1; } }
    .wechat-modal-close { position: absolute; top: 10px; right: 12px; width: 32px; height: 32px; border: none; background: none; font-size: 22px; color: #9a8b76; cursor: pointer; border-radius: 50%; line-height: 1; }
    .wechat-modal-close:hover { background: #f5f3ef; color: #3d3328; }
    .wechat-modal-icon { width: 48px; height: 48px; background: #07C160; border-radius: 12px; display: flex; align-items: center; justify-content: center; margin: 0 auto 12px; }
    .wechat-modal-icon svg { width: 28px; height: 28px; fill: #ffffff; }
    .wechat-modal h3 { font-size: 18px; font-weight: 600; color: #3d3328; margin-bottom: 4px; }
    .wechat-modal .wechat-tip { font-size: 13px; color: #9a8b76; margin-bottom: 16px; }
    .wechat-modal img { width: 220px; height: 220px; border-radius: 10px; border: 1px solid #ebe7e0; display: block; margin: 0 auto 16px; background: #f5f3ef; object-fit: contain; }
    .wechat-id-row { display: flex; align-items: center; justify-content: center; gap: 10px; }
    .wechat-id-row .wechat-id { font-size: 16px; font-weight: 600; color: #07C160; letter-spacing: 0.5px; }
    .wechat-copy-btn { padding: 6px 14px; background: #07C160; color: #ffffff; border: none; border-radius: 6px; font-size: 13px; cursor: pointer; transition: background 0.2s; }
    .wechat-copy-btn:hover { background: #06a653; }

    /* Cases & News */
    .cases-section { padding: 80px 0; background: #f5f3ef; }
    .cases-grid { display: grid; grid-template-columns: 1fr; gap: 24px; }
    @media(min-width:768px){ .cases-grid { grid-template-columns: repeat(3, 1fr); } }
    .case-card { background: #fff; border: 1px solid #ebe7e0; border-radius: 12px; overflow: hidden; transition: all 0.3s; }
    .case-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,0.08); }
    .case-card img { width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block; background: #f5f3ef; }
    .case-card .case-body { padding: 16px 20px 20px; }
    .case-card h4 { font-size: 16px; font-weight: 500; color: #3d3328; margin-bottom: 6px; }
    .case-card p { font-size: 14px; color: #9a8b76; line-height: 1.6; }
    .news-section { padding: 80px 0; background: #f5f3ef; }
    .news-grid { display: grid; grid-template-columns: 1fr; gap: 24px; }
    @media(min-width:768px){ .news-grid { grid-template-columns: repeat(3, 1fr); } }
    .news-card { background: #fff; border: 1px solid #ebe7e0; border-radius: 12px; padding: 24px; cursor: pointer; transition: all 0.3s; }
    .news-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,0.08); }
    .news-card .news-date { font-size: 12px; color: #9a8b76; margin-bottom: 8px; }
    .news-card h4 { font-size: 17px; font-weight: 500; color: #3d3328; margin-bottom: 8px; transition: color 0.2s; }
    .news-card:hover h4 { color: #8B4513; }
    .news-card p { font-size: 14px; color: #9a8b76; line-height: 1.6; margin-bottom: 12px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
    .news-card .news-more { font-size: 13px; color: #8B4513; }
    .empty-tip { text-align: center; color: #9a8b76; font-size: 14px; padding: 32px 0; grid-column: 1/-1; }

    /* Article Reader Modal */
    .article-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.55); display: none; align-items: center; justify-content: center; z-index: 100; padding: 16px; }
    .article-modal-overlay.open { display: flex; }
    .article-modal { background: #fff; border-radius: 16px; padding: 36px 32px; max-width: 760px; width: 100%; max-height: 85vh; overflow-y: auto; position: relative; box-shadow: 0 20px 60px rgba(0,0,0,0.3); }
    .article-modal-close { position: absolute; top: 14px; right: 16px; width: 32px; height: 32px; border: none; background: none; font-size: 22px; color: #9a8b76; cursor: pointer; border-radius: 50%; line-height: 1; }
    .article-modal-close:hover { background: #f5f3ef; color: #3d3328; }
    .article-modal h2 { font-family: 'Noto Serif SC', serif; font-size: 26px; font-weight: 700; color: #3d3328; margin-bottom: 8px; padding-right: 32px; }
    .article-modal .article-date { font-size: 13px; color: #9a8b76; margin-bottom: 20px; padding-bottom: 16px; border-bottom: 1px solid #ebe7e0; }
    .article-modal .article-content { font-size: 15px; color: #5c4f40; line-height: 1.9; }
    .article-modal .article-content img { max-width: 100%; border-radius: 8px; margin: 8px 0; }
    .article-modal .article-content b, .article-modal .article-content strong { font-weight: 700; }
    .article-modal .article-content i, .article-modal .article-content em { font-style: italic; }
    .article-modal .article-content u { text-decoration: underline; }
    .article-modal .article-content h1 { font-size: 24px; font-weight: 700; margin: 16px 0 10px; color: #3d3328; line-height: 1.4; }
    .article-modal .article-content h2 { font-size: 21px; font-weight: 600; margin: 14px 0 8px; color: #3d3328; line-height: 1.4; }
    .article-modal .article-content h3 { font-size: 18px; font-weight: 600; margin: 12px 0 6px; color: #3d3328; line-height: 1.4; }
    .article-modal .article-content p { margin: 8px 0; }
    .article-modal .article-content blockquote { border-left: 3px solid #8B4513; padding-left: 14px; color: #7d6f5e; margin: 12px 0; }
    .article-modal .article-content ul, .article-modal .article-content ol { padding-left: 26px; margin: 10px 0; }
    .article-modal .article-content li { margin: 4px 0; }
    .article-modal .article-content hr { border: none; border-top: 1px solid #ddd6ca; margin: 16px 0; }
    .article-modal .article-content a { color: #8B4513; text-decoration: underline; }

    /* Pricing */
    .pricing-section { padding: 48px 0 80px; background: #fff; } /* 上方留白收紧，标题在区块间隙中接近上下居中 */
    .pricing-subtitle { text-align: center; font-size: 16px; color: #9a8b76; margin: -32px 0 48px; }
    .pricing-grid { display: grid; grid-template-columns: 1fr; gap: 24px; align-items: stretch; }
    @media(min-width:640px){ .pricing-grid { grid-template-columns: repeat(2, 1fr); } }
    @media(min-width:1024px){ .pricing-grid { grid-template-columns: repeat(3, 1fr); } }
    /* 手机窄屏：卡片紧凑化，缩短价格区整体高度 */
    @media(max-width:639px){
      .pricing-grid { gap: 16px; }
      .pricing-grid .price-card { padding: 22px 18px; }
      .pricing-grid .price-card h4 { font-size: 18px; }
      .pricing-grid .price-num { margin-bottom: 14px; }
      .pricing-grid .price-num .amount { font-size: 22px; }
      .pricing-grid .price-num .currency { font-size: 13px; vertical-align: 4px; }
      .pricing-grid .price-card ul { margin-bottom: 16px; }
      .pricing-grid .price-card li { font-size: 13px; padding: 5px 0 5px 22px; }
      .pricing-grid .price-card .price-cta { padding: 11px; }
    }
    .price-card { position: relative; background: #fff; border: 1px solid #ebe7e0; border-radius: 14px; padding: 32px 28px; transition: all 0.3s; display: flex; flex-direction: column; }
    .price-card:hover { transform: translateY(-4px); background: #fffdf8; border-color: #d9c7a7; box-shadow: 0 14px 32px rgba(139,69,19,0.14); }
    .price-card.recommended { border: 2px solid #8B4513; background: #fffdf8; box-shadow: 0 14px 36px rgba(139,69,19,0.18); }
    .price-badge { position: absolute; top: -14px; left: 50%; transform: translateX(-50%); background: #8B4513; color: #fff; font-size: 13px; font-weight: 600; padding: 5px 18px; border-radius: 20px; white-space: nowrap; box-shadow: 0 4px 10px rgba(139,69,19,0.3); }
    .price-card h4 { font-size: 21px; font-weight: 700; color: #3d3328; text-align: center; margin-bottom: 8px; }
    .price-card .price-desc { text-align: center; font-size: 14px; color: #9a8b76; margin-bottom: 16px; min-height: 20px; }
    .price-num { text-align: center; margin-bottom: 20px; color: #3d3328; }
    .price-num .currency { font-size: 16px; vertical-align: 5px; }
    .price-num .amount { font-size: 28px; font-weight: 700; font-family: 'Noto Serif SC', serif; }
    .price-num .unit { font-size: 14px; color: #9a8b76; }
    .price-num .old-price { display: block; font-size: 15px; color: #b5a896; text-decoration: line-through; margin-bottom: 2px; font-family: 'Noto Sans SC', sans-serif; font-weight: 400; }
    /* 限时折扣：全屏游走悬浮徽章（位置由 JS 正弦轨迹驱动） */
    .flash-banner { position: fixed; left: 0; top: 0; z-index: 60; width: 98px; box-sizing: border-box; background: linear-gradient(165deg,#c41e3a 0%,#e0652a 100%); border-radius: 16px; color: #fff; text-align: center; padding: 14px 8px 12px; box-shadow: 0 10px 26px rgba(196,30,58,.35), inset 0 0 0 1px rgba(255,255,255,.16); cursor: pointer; will-change: transform; }
    .flash-banner .fb-close { position: absolute; top: -7px; left: -7px; width: 20px; height: 20px; border-radius: 50%; border: none; background: #3d3328; color: #fff; font-size: 13px; line-height: 20px; text-align: center; cursor: pointer; box-shadow: 0 2px 6px rgba(0,0,0,.3); padding: 0; }
    .flash-banner .fb-tag { font-size: 11px; font-weight: 700; letter-spacing: .5px; background: rgba(255,255,255,.16); border-radius: 999px; padding: 4px 2px; margin-bottom: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .flash-banner .fb-zhe { font-size: 13px; margin-bottom: 8px; }
    .flash-banner .fb-zhe b { font-size: 27px; font-weight: 800; font-family: 'Noto Serif SC', serif; line-height: 1; }
    .flash-banner .fb-timer { font-size: 11px; font-variant-numeric: tabular-nums; background: rgba(0,0,0,.16); border-radius: 6px; padding: 3px 4px; margin-bottom: 7px; white-space: nowrap; }
    .flash-banner .fb-note { font-size: 10px; color: rgba(255,255,255,.85); line-height: 1.6; margin-bottom: 7px; }
    .flash-banner .fb-cta { font-size: 11px; font-weight: 700; color: #ffe9a8; letter-spacing: .5px; }
    /* 手机端：促销浮块整体缩小（高度约减30%），少挡商品内容 */
    @media(max-width:640px){ .flash-banner { width: 78px; padding: 9px 5px 8px; border-radius: 12px; } .flash-banner .fb-close { width: 18px; height: 18px; font-size: 12px; line-height: 18px; top: -6px; left: -6px; } .flash-banner .fb-tag { font-size: 10px; padding: 3px 2px; margin-bottom: 5px; } .flash-banner .fb-zhe { font-size: 11px; margin-bottom: 5px; } .flash-banner .fb-zhe b { font-size: 18px; } .flash-banner .fb-timer { font-size: 10px; padding: 2px 3px; margin-bottom: 5px; } .flash-banner .fb-note { display: none; } .flash-banner .fb-cta { font-size: 10px; } }
    .price-card ul { list-style: none; margin-bottom: 24px; flex: 1; }
    .price-card li { font-size: 14.5px; color: #5c4f40; padding: 6px 0 6px 24px; position: relative; }
    .price-card li::before { content: '✓'; position: absolute; left: 0; color: #16a34a; font-weight: 700; }
    .price-card .price-cta { display: block; text-align: center; padding: 13px; border-radius: 8px; font-size: 15px; font-weight: 600; background: #f5f3ef; color: #3d3328; border: 1px solid #ddd6ca; cursor: pointer; transition: all 0.2s; }
    .price-card .price-cta:hover { background: #ebe7e0; }
    .price-card.recommended .price-cta { background: #8B4513; color: #fff; border-color: #8B4513; }
    .price-card.recommended .price-cta:hover { background: #6d3510; }
    .price-card .price-cta.buy { background: #8B4513; color: #fff; border-color: #8B4513; }
    .price-card .price-cta.buy:hover { background: #6d3510; }
    .price-card .price-ghost { display: block; margin: 10px auto 0; font-size: 13px; color: #9a8b76; background: none; border: none; cursor: pointer; text-decoration: underline; }
    .price-card .price-ghost:hover { color: #8B4513; }
    /* 手机端价格方案折叠：默认显示前3档（含推荐档），点按钮展开全部 */
    .pricing-toggle { display: none; margin: 18px auto 0; padding: 11px 28px; border-radius: 999px; border: 1px solid #d8d2c4; background: #fff; color: #8B4513; font-size: 14px; font-weight: 600; cursor: pointer; font-family: inherit; }
    @media(max-width:767px){
      .price-card.price-extra { display: none; }
      .pricing-grid.show-all .price-card.price-extra { display: flex; }
      .pricing-toggle { display: block; }
    }

    /* 选购弹窗（首页授权价格 → 选字体加购） */
    .plan-modal-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.45); z-index: 200; align-items: center; justify-content: center; padding: 16px; }
    .plan-modal-overlay.open { display: flex; }
    .plan-modal { background: #fff; border-radius: 14px; max-width: 560px; width: 100%; max-height: 82vh; overflow-y: auto; padding: 24px; position: relative; }
    .plan-modal h3 { margin: 0 0 4px; font-size: 18px; color: #3d3328; }
    .plan-modal-tip { margin: 0 0 12px; font-size: 13px; color: #9a8b76; }
    .plan-modal-close { position: absolute; top: 12px; right: 14px; border: none; background: none; font-size: 22px; color: #9a8b76; cursor: pointer; }
    .plan-row { display: flex; align-items: center; gap: 10px; padding: 12px 0; border-top: 1px solid #f0e9de; flex-wrap: wrap; }
    .plan-row-name { flex: 1; min-width: 100px; font-size: 15px; color: #3d3328; font-weight: 500; }
    .plan-row-select { padding: 8px 10px; border: 1px solid #d9cfc2; border-radius: 8px; font-size: 13px; color: #3d3328; background: #fff; max-width: 170px; }
    .plan-row-price { font-size: 15px; color: #c41e3a; font-weight: 700; min-width: 80px; text-align: right; }
    .plan-row-btn { padding: 8px 18px; background: #c41e3a; color: #fff; border: none; border-radius: 18px; font-size: 13px; cursor: pointer; transition: background .2s; }
    .plan-row-btn:hover { background: #a01830; }
    @media(max-width:640px){
      .plan-modal-overlay { padding: 0; align-items: flex-end; }
      .plan-modal { border-radius: 14px 14px 0 0; padding: 18px 14px; align-self: flex-end; }
    }

    /* Copyright Credentials */
    .copyright-section { padding: 80px 0; background: #fff; }
    .cert-grid { display: grid; grid-template-columns: 1fr; gap: 24px; }
    @media(min-width:768px){ .cert-grid { grid-template-columns: repeat(3, 1fr); } }
    .cert-card { background: #fff; border: 1px solid #ebe7e0; border-radius: 12px; overflow: hidden; transition: all 0.3s; }
    .cert-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,0.08); }
    .cert-card img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; background: #f5f3ef; }
    .cert-card .cert-body { padding: 16px 20px 20px; }
    .cert-card h4 { font-size: 16px; font-weight: 500; color: #3d3328; margin-bottom: 6px; }
    .cert-card p { font-size: 14px; color: #9a8b76; line-height: 1.6; }

    /* Contact */
    .contact-section { padding: 80px 0; background: #fff; }

    /* 协议授权（上传协议 → 自动识别 → 生成订单） */
    .agreement-section { padding: 80px 0; background: linear-gradient(180deg, #fdfaf5 0%, #faf5ec 100%); }
    .agreement-hero { max-width: 760px; margin: 0 auto; text-align: center; }
    .agreement-icon { width: 108px; height: 108px; margin: 0 auto 18px; border-radius: 28px; background: linear-gradient(145deg, #fffdf9, #f7ecdc); border: 1px solid #eee0ca; box-shadow: 0 10px 30px rgba(160,120,60,0.14), inset 0 1px 0 #fff; display: flex; align-items: center; justify-content: center; }
    .agreement-icon svg { width: 76px; height: 76px; }
    .agreement-section .section-title { margin-bottom: 14px; }
    .agreement-subtitle { font-size: 15.5px; color: #8a7a68; line-height: 1.9; margin: 0 0 26px; }
    .agreement-steps { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px; margin-bottom: 30px; }
    .ag-step { display: inline-flex; align-items: center; gap: 7px; background: #fff; border: 1px solid #ecdfcc; border-radius: 999px; padding: 7px 15px 7px 8px; font-size: 13.5px; font-weight: 600; color: #6b5b45; box-shadow: 0 2px 8px rgba(160,120,60,0.08); }
    .ag-step-no { width: 22px; height: 22px; border-radius: 50%; background: #c41e3a; color: #fff; font-size: 12.5px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
    .ag-step-arrow { color: #cbb794; font-size: 15px; }
    .agreement-upload { border: 2px dashed #d9c4a4; border-radius: 18px; background: rgba(255,255,255,0.75); padding: 40px 24px; cursor: pointer; transition: all 0.25s; }
    .agreement-upload:hover, .agreement-upload.dragover { border-color: #c41e3a; background: #fff; box-shadow: 0 8px 26px rgba(196,30,58,0.10); transform: translateY(-2px); }
    .ag-up-icon { font-size: 40px; margin-bottom: 10px; }
    .ag-up-text { font-size: 17px; font-weight: 600; color: #3d3328; margin-bottom: 6px; }
    .ag-up-tip { font-size: 13px; color: #a08f7c; }
    .agreement-loading { display: flex; align-items: center; justify-content: center; gap: 12px; padding: 26px 0 4px; font-size: 14.5px; color: #8a7a68; }
    .ag-spinner { width: 26px; height: 26px; border: 3px solid #ead9c0; border-top-color: #c41e3a; border-radius: 50%; animation: agSpin 0.9s linear infinite; }
    @keyframes agSpin { to { transform: rotate(360deg); } }
    .agreement-template { margin-top: 18px; font-size: 13.5px; color: #a08f7c; }
    .agreement-template a { color: #8B4513; font-weight: 600; text-decoration: underline; }
    .agreement-result { margin-top: 26px; background: #fff; border: 1px solid #ecdfcc; border-radius: 18px; padding: 26px 28px; text-align: left; box-shadow: 0 12px 34px rgba(160,120,60,0.10); }
    .ag-result-title { font-size: 15px; font-weight: 600; color: #3d3328; margin-bottom: 18px; }
    .ag-form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 18px; }
    .ag-field.wide { grid-column: 1 / -1; }
    .ag-field label { display: block; font-size: 13px; color: #6b5b45; margin-bottom: 6px; }
    .ag-field label i { color: #c41e3a; font-style: normal; }
    .ag-field input, .ag-field select { width: 100%; padding: 11px 13px; border: 1px solid #ddd2bf; border-radius: 10px; font-size: 14px; font-family: inherit; color: #3d3328; background: #fffdf9; outline: none; transition: border-color 0.2s, box-shadow 0.2s; }
    .ag-field input:focus, .ag-field select:focus { border-color: #c41e3a; box-shadow: 0 0 0 3px rgba(196,30,58,0.08); }
    .ag-actions { display: flex; gap: 12px; margin-top: 20px; }
    .ag-submit { flex: 1; padding: 13px 0; border: none; border-radius: 12px; background: #c41e3a; color: #fff; font-size: 15.5px; font-weight: 700; cursor: pointer; font-family: inherit; transition: all 0.2s; box-shadow: 0 6px 18px rgba(196,30,58,0.28); }
    .ag-submit:hover { background: #a81730; transform: translateY(-1px); }
    .ag-submit:disabled { opacity: 0.6; cursor: not-allowed; transform: none; }
    .ag-reset { padding: 13px 22px; border: 1px solid #ddd2bf; border-radius: 12px; background: #fff; color: #6b5b45; font-size: 14px; cursor: pointer; font-family: inherit; }
    .ag-reset:hover { background: #faf5ec; }
    .ag-file-note { margin-top: 14px; font-size: 12.5px; color: #a08f7c; }
    .license-form-card { margin-top: 30px; background: #fff; border: 1px solid #ecdfcc; border-radius: 18px; padding: 32px 36px; text-align: left; box-shadow: 0 12px 34px rgba(160,120,60,0.10); }
    .license-form-title { font-size: 18px; font-weight: 700; color: #3d3328; margin-bottom: 6px; text-align: center; }
    .license-form-subtitle { font-size: 13px; color: #a08f7c; margin-bottom: 22px; text-align: center; }
    .license-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 20px; }
    .license-field.wide { grid-column: 1 / -1; }
    .license-field label { display: block; font-size: 13px; color: #6b5b45; margin-bottom: 6px; font-weight: 500; }
    .license-field label i { color: #c41e3a; font-style: normal; }
    .license-field input, .license-field select { width: 100%; padding: 12px 14px; border: 1px solid #ddd2bf; border-radius: 10px; font-size: 14px; font-family: inherit; color: #3d3328; background: #fffdf9; outline: none; transition: border-color 0.2s, box-shadow 0.2s; }
    .license-field input:focus, .license-field select:focus { border-color: #c41e3a; box-shadow: 0 0 0 3px rgba(196,30,58,0.08); }
    .license-field input::placeholder { color: #c8bba6; font-size: 13px; }
    .license-form-actions { margin-top: 24px; text-align: center; }
    .license-submit { padding: 14px 48px; border: none; border-radius: 12px; background: #c41e3a; color: #fff; font-size: 16px; font-weight: 700; cursor: pointer; font-family: inherit; transition: all 0.2s; box-shadow: 0 6px 18px rgba(196,30,58,0.28); }
    .license-submit:hover { background: #a81730; transform: translateY(-1px); }
    .license-submit:disabled { opacity: 0.6; cursor: not-allowed; transform: none; }
    .license-form-note { margin-top: 16px; font-size: 12.5px; color: #a08f7c; text-align: center; }
    /* 登录弹窗 */
    .login-modal-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.45); z-index: 200; align-items: center; justify-content: center; }
    .login-modal-overlay.show { display: flex; }
    .login-modal { background: #fff; border-radius: 18px; padding: 36px 40px; max-width: 420px; width: 90%; text-align: center; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
    .login-modal h3 { font-size: 18px; font-weight: 700; color: #3d3328; margin-bottom: 8px; }
    .login-modal p { font-size: 14px; color: #8a7a68; margin-bottom: 20px; }
    .login-modal .lm-qrcode { width: 180px; height: 180px; margin: 0 auto 16px; background: #f5f1ea; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 13px; color: #a08f7c; }
    .login-modal .lm-btn { padding: 11px 32px; border: none; border-radius: 10px; background: #c41e3a; color: #fff; font-size: 14px; font-weight: 600; cursor: pointer; font-family: inherit; }
    .login-modal .lm-btn:hover { background: #a81730; }
    @media(max-width:640px){ .license-form-grid { grid-template-columns: 1fr; } .license-form-card { padding: 24px 20px; } }

    @media(max-width:640px){ .ag-form { grid-template-columns: 1fr; } .agreement-upload { padding: 30px 16px; } }

    .contact-subtitle { text-align: center; font-size: 16px; color: #9a8b76; margin: -32px 0 48px; }
    .contact-grid { display: grid; grid-template-columns: 1fr; gap: 32px; max-width: 900px; margin: 0 auto; }
    @media(min-width:768px){ .contact-grid { grid-template-columns: 1fr 1fr; } }
    .contact-info-card { background: #faf9f7; border: 1px solid #ebe7e0; border-radius: 14px; padding: 32px; }
    .contact-info-card h4 { font-size: 18px; font-weight: 600; color: #3d3328; margin-bottom: 20px; }
    .contact-item { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 16px; font-size: 15px; color: #5c4f40; }
    .contact-item .ci-icon { font-size: 18px; flex-shrink: 0; }
    .contact-wechat-card { background: linear-gradient(135deg, #07C160, #05a354); border-radius: 14px; padding: 32px; color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
    .contact-wechat-card svg { width: 44px; height: 44px; fill: #fff; margin-bottom: 12px; }
    .contact-wechat-card h4 { font-size: 20px; font-weight: 600; margin-bottom: 8px; }
    .contact-wechat-card p { font-size: 15px; opacity: 0.95; margin-bottom: 20px; }
    .contact-wechat-card p b { letter-spacing: 1px; }
    .cwc-btn { padding: 12px 32px; background: #fff; color: #07C160; border: none; border-radius: 8px; font-size: 15px; font-weight: 600; cursor: pointer; transition: all 0.2s; }
    .cwc-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(0,0,0,0.15); }
    
    /* Features */
    .features { padding: 64px 0; background: #fff; }
    .features-grid { display: grid; grid-template-columns: 1fr; gap: 24px; }
    @media(min-width:768px){ .features-grid { grid-template-columns: repeat(3, 1fr); } }
    .feature-card { display: flex; align-items: flex-start; gap: 16px; padding: 24px; border-radius: 12px; border: 1px solid #ebe7e0; transition: box-shadow 0.2s; }
    .feature-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.06); }
    .feature-icon { width: 68px; height: 68px; border-radius: 14px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 34px; box-shadow: 0 5px 14px rgba(0,0,0,0.10); border: 1px solid rgba(0,0,0,0.05); }
    .feature-card h3 { font-weight: 700; color: #3d3328; margin-bottom: 6px; font-size: 21px; }
    .feature-card p { font-size: 14.5px; color: #9a8b76; }
    .feature-card .feature-desc { font-size: 14.5px; color: #9a8b76; line-height: 1.6; }
    .feature-card .feature-desc img { display: none !important; }
    .feature-card:has(.feature-desc img) { cursor: pointer; }
    .feature-card .feature-desc a { color: #8B4513; }
    
    /* Core Values */
    .core-values { padding: 80px 0; background: #f5f3ef; }
    .section-title { font-family: 'Noto Serif SC', serif; font-size: 30px; font-weight: 700; text-align: center; color: #3d3328; margin-bottom: 56px; }
    @media(min-width:640px){ .section-title { font-size: 36px; } }
    /* 标题专用隶书（备用，当前未启用；需用时把下面的黑体栈换回 'DNTitleLiShu' 即可） */
    @font-face { font-family: 'DNTitleLiShu'; src: url('/assets/title-lishu.woff') format('woff'); font-display: swap; }
    /* 核心价值 / 在线字体预览 / 基础字体 / 精品字体 / 授权价格 / 协议授权：标题黑体（电脑/手机一致；除在线预览随行左齐外均居中） */
    .core-values .section-title,
    .font-preview .section-title,
    .font-showcase .section-title,
    .pricing-section .section-title,
    .agreement-section .section-title { font-family: 'SimHei', 'Heiti SC', 'Microsoft YaHei', 'PingFang SC', sans-serif; text-align: center; }
    /* 在线字体预览标题与输入框同一行，标题随行左对齐 */
    .font-preview .preview-head .section-title { text-align: left; }
    /* 黑体标题在其上下内容间距中视觉居中：实测各标题上间距均大于下间距（行盒空隙+margin 结构所致），
       按区按端把文字视觉平移到间距中点；transform 不影响布局，页面节奏不变 */
    .core-values .section-title { transform: translateY(-8px); }
    #fontsSectionTitle { transform: translateY(-2px); }
    #premiumSectionTitle { transform: translateY(-15px); }
    #pricingTitle { transform: translateY(-45px); }
    @media(min-width:768px){
      .core-values .section-title { transform: translateY(-11px); }
      #fontsSectionTitle { transform: translateY(-11px); }
      #premiumSectionTitle { transform: translateY(-16px); }
      #pricingTitle { transform: translateY(-40px); }
    }
    /* 基础/精品字体的标题容器原为 flex（标题收缩为内容宽），改块级让标题真正整行居中 */
    .font-showcase .showcase-header { display: block; text-align: center; }
    .values-grid { display: grid; grid-template-columns: 1fr; gap: 32px; }
    @media(min-width:768px){ .values-grid { grid-template-columns: repeat(3, 1fr); } }
    /* 核心价值卡片与特色荣誉同款横向布局：图标居左、标题与描述居右，降低卡片高度 */
    .value-card { background: #fff; display: flex; align-items: center; gap: 16px; padding: 24px; border-radius: 12px; box-shadow: 0 1px 3px rgba(0,0,0,0.04); border: 1px solid #ebe7e0; transition: all 0.3s; }
    .value-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,0.08); }
    .value-icon { width: 68px; height: 68px; background: #fff8f0; border-radius: 14px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-size: 34px; box-shadow: 0 5px 14px rgba(0,0,0,0.10); border: 1px solid rgba(0,0,0,0.05); }
    .value-card h3 { font-size: 21px; font-weight: 700; color: #3d3328; margin-bottom: 10px; }
    .value-text { min-width: 0; }
    .value-card p { font-size: 14.5px; color: #9a8b76; line-height: 1.7; }
    .value-card .value-desc { font-size: 14.5px; color: #9a8b76; line-height: 1.7; }
    .value-card .value-desc img { display: none !important; }
    /* 富文本残留的空图片占位段和换行（图片本就不显示）一并隐藏，消除卡片底部大片空白 */
    .value-card .value-desc .rte-img-wrap, .feature-card .feature-desc .rte-img-wrap { display: none !important; }
    /* 图片来源说明文字：与图片一样在卡片里隐藏，点卡片弹出后才显示 */
    .value-card .value-desc .src-caption, .feature-card .feature-desc .src-caption { display: none !important; }
    /* 有图片的卡片（点击弹窗看大图）：卡片上整段描述都隐藏，只留图标+标题，弹出后完整显示文字/图片/网址 */
    .value-card:has(.value-desc img) .value-desc, .feature-card:has(.feature-desc img) .feature-desc { display: none !important; }
    .value-card .value-desc br, .feature-card .feature-desc br { display: none !important; }
    .value-card:has(.value-desc img) { cursor: pointer; }
    .value-card .value-desc a { color: #8B4513; }

    /* 图片画廊查看器：卡片只显示图标原样，点击卡片弹出该卡全部图片，上下滚动查看 */
    .img-lightbox { display: none; position: fixed; inset: 0; z-index: 9999; background: rgba(0,0,0,0.88); padding: 40px 24px 60px; cursor: zoom-out; overflow-y: auto; }
    .img-lightbox.open { display: block; }
    .img-lightbox .img-lightbox-inner { max-width: 860px; margin: 0 auto; display: flex; flex-direction: column; gap: 18px; color: #f5f2ec; }
    .img-lightbox img { width: 100%; border-radius: 6px; box-shadow: 0 10px 60px rgba(0,0,0,0.6); background: #fff; cursor: default; }
    /* 弹窗内的图片来源文字：白字小字居中，网址可点击直达来源 */
    .img-lightbox .src-caption { display: block !important; text-align: center; color: rgba(255,255,255,0.85); font-size: 13px; line-height: 1.6; margin: -6px 0 4px; word-break: break-all; cursor: default; }
    .img-lightbox .src-caption a { color: #f0b429; text-decoration: underline; }
    .img-lightbox .img-lightbox-close { position: fixed; top: 18px; right: 26px; font-size: 34px; color: #fff; cursor: pointer; line-height: 1; opacity: 0.8; z-index: 10000; }
    .img-lightbox .img-lightbox-close:hover { opacity: 1; }
    .img-lightbox .img-lightbox-tip { position: fixed; bottom: 16px; left: 0; right: 0; text-align: center; color: rgba(255,255,255,0.65); font-size: 13px; pointer-events: none; }
    
    /* Font Preview */
    .font-preview { padding: 80px 0; background: #fff; }
    .preview-grid { display: grid; grid-template-columns: 1fr; gap: 40px; }
    @media(min-width:1024px){ .preview-grid { grid-template-columns: 340px 1fr; } }
    /* 预览区头部：标题与输入框同一行且整组水平居中，位于预览区上方（手机端自动换行堆叠） */
    .preview-head { display: flex; align-items: center; justify-content: center; gap: 16px 28px; flex-wrap: wrap; margin-bottom: 32px; }
    .preview-head .section-title { margin: 0; flex-shrink: 0; line-height: 1.25; transform: translateY(0.036em); /* 收紧行高并补偿黑体字形视觉中心偏上，让标题文字与输入框上下完全居中（实测偏上约0.036em） */ }
    .preview-head-input { flex: 1; min-width: 260px; margin-bottom: 0 !important; }
    /* 电脑端：隐藏左侧控制列（背景色等控制），预览区通栏放到整行宽；手机端不动 */
    @media(min-width:768px){
      .font-preview .preview-grid { grid-template-columns: 1fr; }
      .font-preview .preview-grid > div:first-child { display: none; }
      /* 预览文字以标题"在线字体预览"左边缘为基准，整体右移 6 个汉字占位（6×35px）起笔 */
      .font-preview .preview-row { position: relative; padding-left: 210px; }
      .font-preview .preview-row .row-text { text-align: left; box-sizing: border-box; padding-right: 110px; }
      /* 一行展示不准换行：文字块不换行，宽度由 JS 统一（超宽时 JS 整体缩字号）；每行左端对齐 */
      .font-preview .preview-row .row-text-inner { display: inline-block; text-align: left; white-space: nowrap; }
      /* 字体名/勾选绝对定位贴右，不挤占文字行的弹性宽度 */
      .font-preview .preview-row .row-side { position: absolute; right: 22px; top: 50%; transform: translateY(-50%); }
      /* 输入框不再占满整行，限制最大宽度 */
      .font-preview .preview-head-input { flex: 0 1 520px; max-width: 520px; }
    }
    .control-group { margin-bottom: 24px; }
    .control-label { display: block; font-size: 14px; font-weight: 500; color: #5c4f40; margin-bottom: 8px; }
    .control-input { width: 100%; padding: 12px 16px; border: 1px solid #ddd6ca; border-radius: 8px; font-size: 15px; color: #3d3328; outline: none; transition: all 0.2s; }
    .control-input:focus { border-color: #8B4513; box-shadow: 0 0 0 3px rgba(139,69,19,0.1); }
    
    /* Custom Dropdown */
    .dropdown { position: relative; }
    .dropdown-btn { width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border: 1px solid #ddd6ca; border-radius: 8px; background: #fff; font-size: 15px; text-align: left; transition: all 0.2s; }
    .dropdown-btn:hover { border-color: #c9bfb0; }
    .dropdown-btn.active { border-color: #8B4513; }
    .dropdown-menu { position: absolute; top: 100%; left: 0; right: 0; margin-top: 4px; background: #fff; border: 1px solid #ebe7e0; border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,0.1); max-height: 260px; overflow-y: auto; z-index: 30; display: none; }
    .dropdown-menu.open { display: block; }
    .dropdown-item { width: 100%; padding: 12px 16px; text-align: left; font-size: 15px; color: #5c4f40; transition: all 0.15s; border: none; background: none; cursor: pointer; display: flex; align-items: center; gap: 12px; }
    .dropdown-item:hover { background: #f5f3ef; }
    .dropdown-item.selected { background: #f5f3ef; color: #8B4513; font-weight: 500; }
    .dropdown-item .check { margin-left: auto; color: #8B4513; font-size: 13px; }

    /* 示例句输入框（图2样式：可自由输入 + 右侧小箭头选预设句） */
    .sample-combo { position: relative; display: flex; width: 100%; }
    .sample-combo input[type="text"] { flex: 1; width: 100%; padding: 12px 40px 12px 16px; border: 1px solid #ddd6ca; border-radius: 8px; font-size: 15px; color: #3d3328; background: #fff; outline: none; transition: border-color 0.2s; }
    .sample-combo input[type="text"]:focus { border-color: #8B4513; }
    .sample-combo input[type="text"]::placeholder { color: #b8ab98; }
    .sample-combo #sampleDropdownBtn { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); padding: 4px 8px; border: none; background: transparent; color: #9a8b76; font-size: 13px; cursor: pointer; }
    .sample-combo #sampleDropdownBtn:hover { color: #8B4513; }
    .sample-combo #sampleDropdownMenu { display: none; position: absolute; left: 0; right: 0; top: calc(100% + 4px); margin: 0; padding: 4px 0; list-style: none; background: #fff; border: 1px solid #ebe7e0; border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,0.10); z-index: 50; max-height: 240px; overflow-y: auto; }
    .sample-combo #sampleDropdownMenu.open { display: block; }
    .sample-combo #sampleDropdownMenu li { padding: 10px 16px; font-size: 14px; color: #5c4f40; cursor: pointer; }
    .sample-combo #sampleDropdownMenu li:hover { background: #f5f3ef; color: #8B4513; }

    /* Range Slider */
    input[type="range"] { -webkit-appearance: none; appearance: none; width: 100%; height: 6px; border-radius: 3px; background: #ebe7e0; outline: none; }
    input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 20px; height: 20px; border-radius: 50%; background: #3d3328; cursor: pointer; border: 3px solid #fff; box-shadow: 0 2px 6px rgba(0,0,0,0.15); }
    input[type="range"]::-moz-range-thumb { width: 20px; height: 20px; border-radius: 50%; background: #3d3328; cursor: pointer; border: 3px solid #fff; box-shadow: 0 2px 6px rgba(0,0,0,0.15); }
    
    
    .preview-area { border-radius: 12px; border: 1px solid #ebe7e0; min-height: 360px; padding: 8px 0; transition: background 0.3s; }
    .preview-text { text-align: center; word-break: break-word; line-height: 1.6; transition: all 0.3s; }
    /* 预览区字体列表：纯展示文本框（不可点击），每行一款字体，用各自字体渲染输入文字 */
    .preview-list { width: 100%; max-height: 380px; overflow-y: auto; }
    .preview-row { display: flex; align-items: baseline; gap: 14px; padding: 10px 22px; border-bottom: 1px solid rgba(0,0,0,0.06); transition: background 0.15s; }
    .preview-row:last-child { border-bottom: none; }
    .preview-row.selected { background: rgba(139,69,19,0.08); }
    .preview-row .row-text { flex: 1; word-break: break-word; overflow-wrap: anywhere; text-wrap: balance; line-height: 1.5; transition: color 0.2s; }
    .preview-row .row-side { display: inline-flex; align-items: baseline; gap: 6px; }
    .preview-row .row-name { font-size: 12px; color: #a89f8d; white-space: nowrap; font-family: inherit; }
    .preview-row.selected .row-name { color: #8B4513; }
    .preview-row .row-check { display: none; color: #8B4513; font-size: 13px; }
    .preview-row.selected .row-check { display: inline; }
    /* 预览列表斑马线：一白一米交替，便于区分每款字体（选中行保持棕色高亮） */
    .preview-list .preview-row:nth-child(odd):not(.selected) { background: #ffffff; }
    .preview-list .preview-row:nth-child(even):not(.selected) { background: #f5f3ef; }
    /* 鼠标悬停：该行预览文字变色（参考 tukuppt 字体列表交互）；!important 用于覆盖行内颜色 */
    .preview-list .preview-row:hover .row-text { color: #E0455A !important; }
    .preview-list .preview-row:hover .row-name { color: #E0455A; }
    
    /* Font Showcase */
    .font-showcase { padding: 48px 0; background: #f5f3ef; } /* 上方留白收紧 */
    /* 基础字体与精品字体相邻时，中间只留一段间距（避免两段 padding 叠出大片空白） */
    .font-showcase + .font-showcase { padding-top: 0; }
    .showcase-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; }

    /* Font Rows（每行一款字体） */
    .font-row { padding: 26px 20px 24px; border-bottom: none; border-radius: 12px; margin-bottom: 10px; transition: background .18s ease, box-shadow .18s ease; }
    /* 相邻商品深浅交替底色，便于区分每一款字体 */
    .font-list .font-row:nth-child(odd) { background: #ffffff; }
    .font-list .font-row:nth-child(even) { background: #f5f3ef; }
    /* 鼠标放上整行提亮（白行加浮起阴影） */
    .font-list .font-row:hover { background: #ffffff; box-shadow: 0 3px 14px rgba(61,51,40,.10); }
    .font-row-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
    .font-row-name { font-size: 18px; color: #3d3328; font-weight: 700; display: flex; align-items: center; gap: 10px; cursor: pointer; }
    .font-row-name:hover { color: #8B4513; }
    .font-row-cat { font-size: 12.5px; font-weight: 400; color: #9a8b76; border: 1px solid #ddd6ca; border-radius: 4px; padding: 2px 10px; }
    .font-row-price { font-size: 28px; font-weight: 700; color: #e0455a; white-space: nowrap; }
    .font-row-price span { font-size: 13.5px; font-weight: 400; color: #9a8b76; }
    /* 字体行右侧操作区：收藏 / 获取商用授权 / 本地下载 */
    .font-row-side { display: flex; align-items: center; gap: 14px; flex: none; }
    .row-actions { display: flex; gap: 8px; align-items: center; }
    .row-btn { padding: 12px 20px; border-radius: 6px; font-size: 14px; border: 1px solid #d8d2c4; background: #fff; color: #3d3328; cursor: pointer; white-space: nowrap; font-family: "Microsoft YaHei","PingFang SC",sans-serif; transition: all 0.15s; }
    .row-btn:hover { background: #f7f4ee; box-shadow: 0 2px 8px rgba(0,0,0,.08); }
    .row-btn.primary { background: #A66A44; border-color: #A66A44; color: #FBF5EA; font-weight: 600; }
    .row-btn.primary:hover { background: #8F5836; border-color: #8F5836; box-shadow: 0 3px 10px rgba(143,88,54,.4); }
    .row-btn.fav.faved { color: #e6a23c; border-color: #e6a23c; background: #fffbe8; }
    /* 用户登录区：登录按钮 / 头像下拉 */
    .auth-btn { display: inline-block; background: #3d3328; color: #f5f3ef; padding: 7px 18px; border-radius: 999px; font-size: 13px; margin-left: 12px; transition: background 0.2s; }
    .auth-btn:hover { background: #2a231a; }
    .user-chip { position: relative; display: flex; align-items: center; gap: 8px; cursor: pointer; padding: 4px 8px 4px 4px; border-radius: 999px; margin-left: 12px; transition: background 0.2s; }
    .user-chip:hover { background: #f5f3ef; }
    .user-avatar { width: 30px; height: 30px; border-radius: 50%; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; flex: none; }
    .user-name { font-size: 13px; color: #3d3328; max-width: 90px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .user-dropdown { display: none; position: absolute; top: calc(100% + 10px); right: 0; background: #fff; border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,0.14); width: 200px; overflow: hidden; z-index: 300; cursor: default; }
    .user-dropdown.open { display: block; }
    .user-dropdown .ud-head { padding: 14px 16px; background: linear-gradient(135deg, #ffd200, #ffe06b); display: flex; gap: 10px; align-items: center; }
    .user-dropdown .ud-head .user-avatar { width: 40px; height: 40px; font-size: 17px; }
    .ud-name { font-size: 14px; font-weight: 600; color: #1a1a1a; }
    .ud-account { font-size: 11px; color: #5c4f40; margin-top: 2px; }
    .user-dropdown a.ud-item { display: block; padding: 11px 16px; font-size: 13px; color: #3d3328; transition: all 0.15s; }
    .user-dropdown a.ud-item:hover { background: #faf7f2; color: #8B4513; }
    .user-dropdown a.ud-item.ud-logout { border-top: 1px solid #f0ece4; color: #c41e3a; }
    /* 登录/注册弹窗 */
    .auth-modal-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.45); z-index: 500; align-items: center; justify-content: center; }
    .auth-modal-overlay.open { display: flex; }
    .auth-modal { position: relative; background: #fff; border-radius: 16px; width: 360px; max-width: 92vw; padding: 30px 28px 26px; box-shadow: 0 20px 60px rgba(0,0,0,0.2); }
    .auth-modal-close { position: absolute; top: 10px; right: 14px; background: none; border: none; font-size: 22px; color: #999; cursor: pointer; }
    .auth-tabs { display: flex; justify-content: center; gap: 44px; margin-bottom: 22px; border-bottom: 1px solid #f0ece4; }
    .auth-tabs button { background: none; border: none; font-size: 16px; color: #9a8b76; padding: 6px 4px 12px; cursor: pointer; border-bottom: 2px solid transparent; font-family: inherit; transition: color .2s, border-color .2s; }
    .auth-tabs button:hover { color: #3d3328; }
    .auth-tabs button.active { color: #3d3328; font-weight: 600; border-bottom-color: #ffd200; }
    .auth-modal input { width: 100%; padding: 11px 14px; border: 1px solid #ddd6ca; border-radius: 8px; font-size: 14px; margin-bottom: 12px; outline: none; font-family: inherit; }
    .auth-modal input:focus { border-color: #ffd200; }
    .auth-submit { width: 100%; padding: 12px; background: #3d3328; color: #f5f3ef; border: none; border-radius: 8px; font-size: 15px; font-weight: 600; cursor: pointer; font-family: inherit; }
    .auth-submit:hover { background: #2a231a; }
    .auth-msg { min-height: 20px; font-size: 13px; color: #c41e3a; margin-top: 10px; text-align: center; }
    .font-row-pricebox { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.row-cart-btn { width: 42px; height: 42px; border-radius: 50%; background: #fff; color: #c41e3a; border: 1.5px solid #c41e3a; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all .2s; box-shadow: 0 2px 8px rgba(196,30,58,.12); flex: none; }
.row-cart-btn:hover { background: #c41e3a; color: #fff; transform: scale(1.18); box-shadow: 0 6px 16px rgba(196,30,58,.28); }
.row-cart-btn svg { width: 21px; height: 21px; }
.dn-toast{position:fixed;left:50%;bottom:60px;transform:translateX(-50%) translateY(20px);background:#3d3328;color:#fff;padding:10px 22px;border-radius:22px;font-size:13px;opacity:0;transition:all .3s;z-index:1200;pointer-events:none;}
.dn-toast.show{opacity:1;transform:translateX(-50%);}
.font-row-preview { font-size: 72px; font-size: clamp(30px, 4.2vw, 72px) !important; line-height: 1.35; color: #3d3328; padding: 12px 14px; border-radius: 10px; cursor: pointer; overflow: hidden; white-space: nowrap; text-align: left; transition: font-size 0.2s, color 0.2s, background 0.2s; }
    /* 鼠标悬停：预览大字变色（参考 tukuppt 字体列表交互），并带浅色底 */
    .font-row-preview:hover { background: #faf7f2; color: #E0455A; }
    
    /* Footer */
    footer { background: #3d3328; color: #b5a896; }
    .footer-inner { padding: 48px 0; }
    .footer-grid { display: grid; grid-template-columns: 1fr; gap: 32px; }
    @media(min-width:768px){ .footer-grid { grid-template-columns: repeat(3, 1fr); } }
    footer h3 { font-family: 'Noto Serif SC', serif; font-size: 20px; font-weight: 700; color: #f5f3ef; margin-bottom: 12px; }
    footer h4 { font-size: 14px; font-weight: 500; color: #f5f3ef; margin-bottom: 16px; }
    footer p { font-size: 14px; color: #9a8b76; line-height: 1.6; }
    footer ul { list-style: none; }
    footer li { margin-bottom: 8px; }
    footer a { font-size: 14px; color: #9a8b76; transition: color 0.2s; }
    footer a:hover { color: #f5f3ef; }
    .footer-bottom { text-align: center; padding: 24px 0; border-top: 1px solid rgba(255,255,255,0.08); font-size: 12px; color: #7d6f5e; }
    
    /* Detail Page */
    .detail-page { display: none; background: #fff; min-height: calc(100vh - 64px); }
    .detail-page.active { display: block; }
    .breadcrumb { display: inline-flex; align-items: center; gap: 4px; font-size: 14px; color: #9a8b76; margin-bottom: 24px; }
    .breadcrumb:hover { color: #8B4513; }
    .tabs { border-bottom: 1px solid #ebe7e0; margin-bottom: 24px; overflow-x: auto; }
    .tabs-inner { display: flex; gap: 4px; min-width: max-content; }
    .tab-btn { padding: 12px 16px; font-size: 14px; font-weight: 500; color: #9a8b76; border-bottom: 2px solid transparent; background: none; cursor: pointer; transition: all 0.2s; white-space: nowrap; }
    .tab-btn:hover { color: #5c4f40; }
    .tab-btn.active { color: #8B4513; border-bottom-color: #8B4513; }
    
    /* Detail Preview Toolbar */
    .toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; padding: 16px; background: #f5f3ef; border-radius: 10px; margin-bottom: 24px; }
    .toolbar-input-group { display: flex; flex: 1; min-width: 280px; max-width: 400px; }
    .toolbar-input { flex: 1; padding: 10px 14px; border: 1px solid #ddd6ca; border-radius: 8px 0 0 8px; font-size: 14px; outline: none; }
    .toolbar-input:focus { border-color: #8B4513; }
    .toolbar-dropdown-btn { padding: 10px 14px; background: #8B4513; color: #fff; border-radius: 0 8px 8px 0; font-size: 14px; display: flex; align-items: center; gap: 4px; }
    .toolbar-dropdown-btn:hover { background: #5D2F0D; }
    .toolbar-size { display: flex; align-items: center; gap: 6px; }
    .toolbar-size button { padding: 6px 10px; color: #5c4f40; border-radius: 6px; font-size: 16px; line-height: 1; }
    .toolbar-size button:hover { background: #ebe7e0; }
    .toolbar-size input[type="range"] { width: 100px; }
    .toolbar-color { display: flex; align-items: center; gap: 6px; }
    .color-swatch { width: 22px; height: 22px; border-radius: 5px; border: 1px solid #ddd6ca; cursor: pointer; }
    .toolbar-color span { font-size: 12px; color: #9a8b76; }
    .toolbar-reset { display: flex; align-items: center; gap: 4px; padding: 8px 12px; font-size: 13px; color: #5c4f40; border-radius: 6px; }
    .toolbar-reset:hover { background: #ebe7e0; }
    
    .detail-preview-area { border-radius: 12px; border: 1px solid #ebe7e0; padding: 32px; min-height: 400px; transition: all 0.3s; }
    .detail-preview-text { margin-bottom: 24px; }
    .detail-samples { padding-top: 20px; border-top: 1px solid rgba(0,0,0,0.06); }
    .detail-samples p { margin-bottom: 12px; }
    
    .back-btn { display: inline-flex; align-items: center; gap: 6px; padding: 10px 20px; background: #8B4513; color: #fff; border-radius: 8px; font-size: 14px; margin-top: 20px; float: right; }
    .back-btn:hover { background: #5D2F0D; }
    
    /* Tab Content */
    .tab-content { display: none; }
    .tab-content.active { display: block; }
    .info-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-bottom: 16px; }
    .info-card { background: #f5f3ef; padding: 16px; border-radius: 10px; }
    .info-card span { font-size: 13px; color: #9a8b76; display: block; margin-bottom: 4px; }
    .info-card p { font-weight: 500; color: #3d3328; }
    .tag { display: inline-block; padding: 4px 12px; background: #fff; border: 1px solid #ebe7e0; border-radius: 20px; font-size: 13px; color: #5c4f40; margin: 4px; }
    .price-grid { display: grid; grid-template-columns: repeat(1, 1fr); gap: 16px; }
    @media(min-width:640px){ .price-grid { grid-template-columns: repeat(2, 1fr); } }
    @media(min-width:1024px){ .price-grid { grid-template-columns: repeat(4, 1fr); } }
    .price-card { border: 1px solid #ebe7e0; border-radius: 12px; padding: 24px; transition: all 0.2s; }
    .price-card:hover { transform: translateY(-4px); background: #fffdf8; border-color: #d9c7a7; box-shadow: 0 14px 32px rgba(139,69,19,0.14); }
    .price-card h4 { font-weight: 500; color: #3d3328; margin-bottom: 8px; }
    .price-card .price { font-size: 24px; font-weight: 700; color: #8B4513; }
    .step { display: flex; align-items: flex-start; gap: 16px; padding: 16px; background: #f5f3ef; border-radius: 10px; margin-bottom: 12px; }
    .step-num { width: 32px; height: 32px; background: #8B4513; color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 14px; flex-shrink: 0; }
    .step h4 { font-weight: 500; color: #3d3328; margin-bottom: 4px; }
    .step p { font-size: 13px; color: #9a8b76; }
    .faq-item { border: 1px solid #ebe7e0; border-radius: 10px; padding: 20px; margin-bottom: 12px; }
    .faq-item h4 { font-weight: 500; color: #3d3328; margin-bottom: 8px; }
    .faq-item p { font-size: 14px; color: #9a8b76; line-height: 1.6; }
    
    /* Responsive */
    @media(max-width:767px){
      .info-grid { grid-template-columns: 1fr; }
      /* 手机端隐藏首屏滚动海报，让客人直接看核心内容（电脑端保留） */
      .hero { display: none; }
      .hero-content { padding: 40px 0; }
      .hero h1 { font-size: 32px; }
      .hero p { font-size: 16px; }
      .cases-section, .news-section, .pricing-section, .copyright-section, .contact-section, .core-values, .font-preview, .font-showcase { padding: 48px 0; }
      /* 手机端：基础/精品/授权价格上方留白收紧，标题在间隙中接近上下居中（相邻两个字体区只留一段间距） */
      .font-showcase { padding-top: 32px; }
      .pricing-section { padding-top: 32px; }
      /* 手机端预览区卡片去掉 360px 最小高度，包住限高后的列表即可（删掉下方无展示的空白） */
      .font-preview .preview-area { min-height: 0; }
      /* 手机端删除"背景色/字体颜色"控制区，下方预览卡片上移，不留空白（控件保留在 DOM，数据链路不动） */
      .font-preview .preview-grid > div:first-child { display: none; }
      /* 手机端：各区块标题字号与头部"段宁书法字库"文字一致（20px） */
      .section-title { font-size: 20px; margin-bottom: 24px; }
      /* 字体产品区：小屏缩小字号；名称+价格同一行，按钮换到下一行，价格不再被挤出屏幕 */
      .font-row { padding: 20px 14px 16px; }
      .font-row-head { flex-wrap: wrap; align-items: baseline; gap: 8px 12px; margin-bottom: 8px; }
      .font-row-name { order: 1; flex: 1 1 auto; min-width: 0; font-size: 16px; }
      .font-row-side { display: contents; }
      .font-row-pricebox { order: 2; flex-direction: row; align-items: baseline; gap: 8px; margin-left: auto; }
      .font-row-price { font-size: 22px; }
      .row-actions { order: 3; width: 100%; justify-content: flex-end; flex-wrap: wrap; gap: 6px; }
      .font-row-preview { font-size: 30px; font-size: clamp(20px, 4.2vw, 30px) !important; white-space: nowrap; }
      .row-btn { padding: 8px 12px; font-size: 12px; }
      /* 手机端：红圈加购按钮直径与"获取商用授权"按钮高度接近（约33px） */
      .row-cart-btn { width: 33px; height: 33px; }
      .row-cart-btn svg { width: 16px; height: 16px; }
      /* 预览区列表：字体名小标注换到下一行，不挤压预览文字 */
      .preview-row { flex-wrap: wrap; gap: 4px 12px; padding: 12px 16px; }
      .preview-row .row-text { flex: 1 1 100%; }
      .preview-row .row-name { white-space: normal; }
      /* 详情页 */
      .detail-preview-area { padding: 20px 16px; min-height: 280px; }
      .toolbar-input-group { min-width: 0; max-width: 100%; flex: 1 1 100%; }
      .article-modal { padding: 26px 20px; }
      /* 特色荣誉/核心价值六张卡片：小屏缩小图标、字号、内边距与间距，明显降低卡片高度 */
      .features-grid, .values-grid { gap: 12px; }
      .feature-card { padding: 14px 16px; gap: 12px; align-items: center; }
      .feature-icon { width: 44px; height: 44px; font-size: 22px; border-radius: 10px; }
      .feature-card h3 { font-size: 16px; margin-bottom: 3px; }
      .feature-card p, .feature-card .feature-desc { font-size: 13px; line-height: 1.5; }
      .value-card { padding: 14px 16px; gap: 12px; }
      .value-icon { width: 44px; height: 44px; font-size: 22px; border-radius: 10px; }
      .value-card h3 { font-size: 16px; margin-bottom: 3px; }
      .value-card p, .value-card .value-desc { font-size: 13px; line-height: 1.55; }
      /* 手机端：隐藏特色荣誉三张卡片（羲之杯/央视案例/40年功底），电脑端保留 */
      .features { display: none; }
      /* 手机端：隐藏字体行的"本地下载"按钮，电脑端保留 */
      .row-btn[data-act="download"] { display: none; }
      /* 手机端：LOGO 图标自适应缩小、不再左移出屏幕（原 -13px 会把图标切掉一块） */
      .header-inner .logo { margin-left: 0; gap: 6px; }
      .header-inner .logo .logo-mark { width: 17px; height: 17px; }
      .header-inner .logo { font-size: 13px; }
      .header-inner { height: 45px; }
      /* 手机端：头部空白处显示小巧字体搜索框（复用电脑端搜索联想逻辑）；
         默认高度与"段宁书法字库"汉字等高，宽度随屏幕自动收缩、绝不遮挡左边文字；
         点进去输文字时，输入框悬浮于文字上向左伸长，高度不变 */
      header .container { padding: 0 10px; }
      .header-search { display: block; position: relative; flex: 0 1 104px; min-width: 34px; width: 104px; height: 26px; margin: 0 6px 0 4px; }
      .header-search-bar { position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 100%; height: 26px; border-width: 1px; background: #fff; z-index: 90; transition: width 0.25s ease, box-shadow 0.25s ease; }
      .header-search-bar input { padding: 0 4px 0 10px; font-size: 12px; }
      .header-search-bar button { width: 26px; }
      .header-search-bar button svg { width: 13px; height: 13px; }
      .header-search .sg-list { left: auto; right: 0; width: 230px; font-size: 12.5px; }
      /* 搜索框获得焦点（点进去输文字）：悬浮向左伸长约6个汉字宽，高度保持与汉字等高 */
      .header-search:focus-within .header-search-bar { width: 150px; box-shadow: 0 6px 20px rgba(60,40,20,.18); }
      .header-search:focus-within .header-search-bar input { font-size: 15px; }
      /* 手机端：在线字体预览区上下空白收紧（电脑端不变） */
      .font-preview { padding: 22px 0 20px; }
      .font-preview .preview-head { margin-bottom: 18px; }
      /* 手机端：核心价值区域整体上下高度压缩（电脑端不变） */
      .core-values { padding: 30px 0; }
      /* 手机端："核心价值"标题上下间距必须减小 */
      .core-values .section-title { margin-bottom: 16px; transform: translateY(0); }
      .values-grid { gap: 10px; }
      .value-card { padding: 12px 14px; }
      /* 手机端：字体显示区默认隐藏，点击输入框后（JS 加 .preview-open）才展示 */
      .font-preview .preview-area { display: none; }
      .font-preview.preview-open .preview-area { display: block; }
    }
  
    /* ===== 站点标志 + 购物车图标（全站统一） ===== */
    .logo{display:inline-flex;align-items:center;gap:9px;text-decoration:none;}
    .logo .logo-mark{width:36px;height:36px;flex:none;}
    .logo .logo-text{color:inherit;}
    .logo .logo-accent{color:#c41e3a;}
    .cart-link{display:inline-flex;align-items:center;gap:6px;color:#c41e3a!important;font-weight:700;text-decoration:none;}
    .cart-link svg{width:22px;height:22px;flex:none;}
    .cart-link:hover{opacity:.85;}
    @media(max-width:768px){.logo .logo-mark{width:17px;height:17px;}.logo{font-size:13px;}.header-inner{height:45px;}}

    /* 优惠活动条（后台「营销组件」控制，默认隐藏） */
    .promo-bar { display: none; align-items: center; justify-content: center; gap: 12px; background: linear-gradient(90deg,#8B4513,#a55a2a); color: #fff; font-size: 13.5px; padding: 8px 40px 8px 16px; position: sticky; top: 0; z-index: 55; text-align: center; }
    .promo-bar a { color: #ffe9c9; font-weight: 600; text-decoration: underline; white-space: nowrap; }
    .promo-bar-close { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); background: none; border: none; color: rgba(255,255,255,.75); font-size: 15px; cursor: pointer; line-height: 1; padding: 4px 6px; }
    .promo-bar-close:hover { color: #fff; }

    /* 首屏轮播：淡入淡出 + 圆点（后台「营销组件-首页轮播」控制，默认不启用） */
    .hero h1, .hero p, .hero-btn-main { transition: opacity .35s ease; }
    .hero-dots { display: flex; justify-content: center; gap: 8px; margin-top: 28px; }
    .hero-dot { width: 8px; height: 8px; border-radius: 50%; background: rgba(61,51,40,.25); cursor: pointer; transition: all .25s; border: none; padding: 0; }
    .hero-dot.active { background: #8B4513; width: 22px; border-radius: 4px; }

    /* 首页弹窗（后台「营销组件」控制，默认不弹出） */
    .popup-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.55); display: none; align-items: center; justify-content: center; z-index: 120; padding: 16px; }
    .popup-overlay.open { display: flex; }
    .popup-card { background: #fff; border-radius: 16px; max-width: 440px; width: 100%; max-height: 85vh; overflow-y: auto; position: relative; box-shadow: 0 20px 60px rgba(0,0,0,.3); animation: wechatPop .25s ease; }
    .popup-card img.popup-img { width: 100%; display: block; border-radius: 16px 16px 0 0; }
    .popup-body { padding: 24px; }
    .popup-body h3 { font-size: 19px; color: #3d3328; margin-bottom: 12px; font-weight: 600; }
    .popup-content { font-size: 14.5px; color: #5c4f40; line-height: 1.8; }
    .popup-content img { max-width: 100%; border-radius: 8px; }
    .popup-content video { max-width: 100%; border-radius: 8px; }
    .popup-close { position: absolute; top: 10px; right: 12px; width: 32px; height: 32px; border: none; background: rgba(255,255,255,.92); font-size: 17px; color: #5c4f40; cursor: pointer; border-radius: 50%; line-height: 1; z-index: 2; box-shadow: 0 2px 8px rgba(0,0,0,.15); }

    /* 新客领券弹窗（有可用优惠券时自动弹出，每次访问最多弹一次） */
    .coupon-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.55); display: none; align-items: center; justify-content: center; z-index: 130; padding: 16px; }
    .coupon-overlay.open { display: flex; }
    .coupon-card { background: linear-gradient(180deg,#fffdf9,#fff8f0); border-radius: 16px; max-width: 420px; width: 100%; position: relative; box-shadow: 0 20px 60px rgba(0,0,0,.3); animation: wechatPop .25s ease; overflow: hidden; }
    .coupon-head { background: linear-gradient(90deg,#c41e3a,#e0652a); color: #fff; text-align: center; padding: 20px 24px 16px; }
    .coupon-head .ch-title { font-size: 20px; font-weight: 700; letter-spacing: 1px; }
    .coupon-head .ch-sub { font-size: 12.5px; color: rgba(255,255,255,.85); margin-top: 4px; }
    .coupon-body { padding: 18px 20px 20px; max-height: 55vh; overflow-y: auto; }
    .coupon-ticket { display: flex; align-items: stretch; background: #fff; border: 1.5px dashed #e3a79b; border-radius: 10px; overflow: hidden; margin-bottom: 12px; }
    .coupon-ticket .ct-left { flex: none; width: 96px; background: linear-gradient(160deg,#c41e3a,#a01830); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 14px 6px; }
    .coupon-ticket .ct-offer { font-size: 24px; font-weight: 800; line-height: 1.1; font-family: 'Noto Serif SC', serif; }
    .coupon-ticket .ct-offer small { font-size: 12px; font-weight: 400; }
    .coupon-ticket .ct-cond { font-size: 10.5px; color: rgba(255,255,255,.8); margin-top: 3px; }
    .coupon-ticket .ct-right { flex: 1; padding: 12px 14px; min-width: 0; }
    .coupon-ticket .ct-name { font-size: 14px; font-weight: 600; color: #3d3328; }
    .coupon-ticket .ct-meta { font-size: 11.5px; color: #9a8b76; margin: 3px 0 8px; }
    .coupon-ticket .ct-code-row { display: flex; align-items: center; gap: 8px; }
    .coupon-ticket .ct-code { font-family: Consolas, monospace; font-size: 15px; font-weight: 700; letter-spacing: 2px; color: #c41e3a; background: #fdf3f4; border-radius: 5px; padding: 4px 10px; }
    .coupon-ticket .ct-copy { flex: none; border: none; background: #c41e3a; color: #fff; font-size: 12px; border-radius: 5px; padding: 6px 12px; cursor: pointer; }
    .coupon-ticket .ct-copy:active { transform: scale(.96); }
    .coupon-foot { text-align: center; font-size: 12px; color: #9a8b76; padding-bottom: 6px; }
    .coupon-go { display: block; width: calc(100% - 40px); margin: 12px auto 18px; border: none; background: #3d3328; color: #f5f3ef; font-size: 14.5px; font-weight: 600; border-radius: 8px; padding: 12px; cursor: pointer; }