:root {
            --primary: #1a56db; --primary-dark: #1e3a8a; --primary-light: #3b82f6; --primary-bg: #eff6ff;
            --accent: #f59e0b; --accent-light: #fffbeb; --success: #10b981; --danger: #ef4444;
            --purple: #8b5cf6; --pink: #ec4899; --orange: #ea580c;
            --text: #1f2937; --text-secondary: #4b5563; --text-light: #6b7280; --text-lighter: #9ca3af;
            --bg: #f1f5f9; --bg-dark: #0f172a; --white: #ffffff; --card-bg: #ffffff;
            --border: #e2e8f0; --border-light: #f1f5f9;
            --shadow: 0 1px 3px rgba(0,0,0,.08); --shadow-md: 0 4px 12px rgba(0,0,0,.08); --shadow-lg: 0 10px 25px rgba(0,0,0,.1);
            --radius: 8px; --radius-lg: 12px; --radius-sm: 6px;
            --header-h: 64px; --max-width: 1280px; --section-gap: 24px;
        }
        *{margin:0;padding:0;box-sizing:border-box}
        body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif;font-size:14px;color:var(--text);background:var(--bg);line-height:1.6;min-width:1100px}
        a{text-decoration:none;color:inherit}
        img{max-width:100%}

        /* Header */
        .header{position:fixed;top:0;left:0;right:0;height:var(--header-h);background:var(--white);border-bottom:1px solid var(--border);z-index:1000;box-shadow:var(--shadow)}
        .header-inner{max-width:var(--max-width);margin:0 auto;height:100%;display:flex;align-items:center;padding:0 20px;gap:28px}
        .header-logo{flex-shrink:0;display:flex;align-items:center}
        .header-logo img{height:40px;width:auto;display:block}
        .header-nav{display:flex;align-items:center;gap:2px;flex-shrink:0}
        .nav-item{padding:8px 14px;color:var(--text);font-size:16px;font-weight:500;border-radius:0;transition:color .2s;white-space:nowrap;cursor:pointer;background:transparent}
        .nav-item:hover{color:var(--primary);background:transparent}
        .nav-item.active{color:var(--text);background:transparent}
        .header-right{display:flex;align-items:center;gap:16px;margin-left:auto;flex-shrink:0}
        .header-search{width:300px;display:flex;align-items:center;flex-shrink:0}
        .search-wrap{width:100%;display:flex;border:1px solid var(--border);border-radius:20px;overflow:hidden;transition:border-color .2s}
        .search-wrap:focus-within{border-color:var(--primary)}
        .search-input{flex:1;border:none;outline:none;padding:8px 14px;font-size:13px;color:var(--text);min-width:0}
        .search-input::placeholder{color:var(--text-lighter)}
        .search-btn{width:40px;border:none;background:var(--white);color:var(--text-light);cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:color .2s}
        .search-btn:hover{color:var(--primary)}
        .header-user{font-size:13px;color:var(--text-secondary);white-space:nowrap;cursor:pointer}
        .header-user:hover{color:var(--primary)}
        .header-user .nickname{color:var(--primary);font-weight:600}
        .header-user .logout-link{color:var(--text-light);margin-left:8px;font-size:13px}
        .header-user .logout-link:hover{color:var(--danger)}

        /* Page Body */
        .page-body{margin-top:var(--header-h)}
        .container{max-width:var(--max-width);margin:0 auto;padding:0 20px}

        /* Content Grid */
        .content-grid{display:grid;grid-template-columns:7fr 3fr;gap:20px;align-items:start;padding-top:var(--section-gap)}
        .content-grid>*{min-width:0}

        /* Left - List Area */
        .list-section{background:var(--card-bg);border-radius:var(--radius-lg);box-shadow:var(--shadow);overflow:hidden}
        .list-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border)}
        .list-header h2{font-size:18px;font-weight:700;color:var(--text)}
        /* 隐藏价格显示 */
        .card-price { display: none !important; }
        .list-header .post-btn a{display:inline-flex;align-items:center;gap:4px;padding:8px 18px;background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;border-radius:20px;font-size:13px;font-weight:500;transition:all .2s}
        .list-header .post-btn a:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}

        /* Filter Bar */
        .filter-bar{display:flex;align-items:center;gap:8px;padding:12px 20px;border-bottom:1px solid var(--border-light);flex-wrap:wrap}
        .filter-item{padding:5px 14px;border-radius:20px;font-size:13px;color:var(--text-secondary);cursor:pointer;transition:all .2s;border:1px solid transparent}
        .filter-item:hover,.filter-item.active{color:var(--primary);background:var(--primary-bg);border-color:var(--primary-light)}
        .filter-item.all{padding:5px 0;font-weight:600;color:var(--text);cursor:default}
        .filter-item.all:hover{background:none;color:var(--text)}

        /* List Items */
        .list-item{display:flex;align-items:center;gap:14px;padding:14px 20px;border-bottom:1px solid var(--border-light);cursor:pointer;transition:background .15s}
        .list-item:hover{background:#f8fafc}
        .list-item:last-child{border-bottom:none}
        .li-tag{padding:2px 10px;border-radius:4px;font-size:12px;font-weight:500;flex-shrink:0;white-space:nowrap}
        .li-tag.red{background:#fef2f2;color:var(--danger)}
        .li-tag.blue{background:var(--primary-bg);color:var(--primary)}
        .li-tag.green{background:#f0fdf4;color:var(--success)}
        .li-tag.orange{background:#fff7ed;color:var(--orange)}
        .li-tag.purple{background:#faf5ff;color:var(--purple)}
        .li-img{font-size:12px;color:var(--primary);flex-shrink:0}
        .li-title{flex:1;font-size:14px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
        .li-top{flex-shrink:0;padding:1px 6px;border-radius:4px;font-size:11px;font-weight:600;background:linear-gradient(135deg,#fef3c7,#fde68a);color:#92400e}
        .li-time{font-size:12px;color:var(--text-lighter);flex-shrink:0}
        .li-price{font-size:14px;font-weight:700;color:var(--danger);flex-shrink:0;margin-left:auto}
        .li-route{flex:1;font-size:14px;font-weight:500;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
        .li-meta{font-size:12px;color:var(--text-light);flex-shrink:0}

        /* Card Grid (market) */
        .card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:16px 20px}
        .card-item{cursor:pointer;transition:all .2s;border-radius:var(--radius);overflow:hidden;border:1px solid var(--border-light)}
        .card-item:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--primary-light)}
        .card-img{width:100%;aspect-ratio:4/3;object-fit:cover;background:#f3f4f6;display:block}
        .card-img.placeholder{display:flex;align-items:center;justify-content:center;color:var(--text-lighter);font-size:12px}
        .card-info{padding:10px}
        .card-title{font-size:14px;font-weight:500;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:6px}
        .card-meta{display:flex;justify-content:space-between;align-items:center}
        .card-price{font-size:15px;font-weight:700;color:var(--danger)}
        .card-loc{font-size:12px;color:var(--text-lighter)}

        /* Banner Section - Same as index */
        .banner-section{padding-top:var(--section-gap)}
        .banner-grid{display:grid;grid-template-columns:7fr 3fr;gap:20px;height:360px}
        .banner-grid>*{min-width:0}
        .banner-slider{position:relative;border-radius:var(--radius-lg);overflow:hidden;background:#f8fafc}
        .banner-slide{width:100%;height:100%}
        .banner-slide img{width:100%;height:100%;object-fit:cover}
        .banner-slide .placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--text-lighter);font-size:16px;background:#f1f5f9}
        .banner-title{position:absolute;bottom:0;left:0;right:0;padding:30px 16px 12px;background:linear-gradient(transparent,rgba(0,0,0,0.6));color:#fff;font-size:16px;font-weight:500;line-height:1.4;z-index:1}
        .banner-ad-tag{position:absolute;top:10px;left:10px;background:rgba(0,0,0,0.5);color:#fff;font-size:11px;padding:3px 8px;border-radius:4px;z-index:2}
        .banner-arrow{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;background:rgba(0,0,0,.4);color:#fff;border:none;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;transition:background .2s;z-index:2}
        .banner-arrow:hover{background:rgba(0,0,0,.65)}
        .banner-arrow.prev{left:12px}
        .banner-arrow.next{right:12px}
        .banner-dots{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);display:flex;gap:8px;z-index:2}
        .banner-dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.5);cursor:pointer;transition:all .3s}
        .banner-dot.active{background:#fff;width:24px;border-radius:4px}
        .banner-sidebar{display:flex;flex-direction:column;gap:12px;height:360px;overflow:hidden}
        .notice-box{background:var(--card-bg);border-radius:var(--radius);padding:12px 16px;box-shadow:var(--shadow);flex-shrink:0}
        .notice-header{font-size:14px;font-weight:600;color:var(--text);margin-bottom:8px;display:flex;align-items:center;gap:6px}
        .notice-scroll{height:28px;overflow:hidden;position:relative}
        .notice-scroll-inner{transition:transform .4s ease}
        .notice-scroll-item{display:flex;align-items:center;gap:8px;padding:4px 0;font-size:13px;color:var(--text-secondary);cursor:pointer;height:28px;line-height:20px}
        .notice-scroll-item:hover{color:var(--primary)}
        .notice-dot{width:6px;height:6px;background:var(--accent);border-radius:50%;flex-shrink:0}
        .notice-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
        .notice-time{flex-shrink:0;font-size:12px;color:var(--text-lighter);margin-left:8px}
        .login-box{background:var(--card-bg);border-radius:var(--radius);padding:14px 24px 20px;box-shadow:var(--shadow);flex:1;display:flex;flex-direction:column;min-height:0;position:relative;overflow:hidden}
        .login-qr-toggle{position:absolute;top:0;right:0;width:40px;height:40px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-light);font-size:20px;z-index:2}
        .login-qr-toggle:hover{color:var(--primary)}
        .login-panel{display:none;flex-direction:column;gap:6px;height:100%;justify-content:center;padding:4px 0}
        .login-panel.active{display:flex}
        .login-tip{color:var(--text-secondary);font-size:13px;text-align:center;margin-bottom:4px}
        .login-input-wrap{border:1px solid var(--border);border-radius:var(--radius-sm);display:flex;align-items:center;overflow:hidden;background:#fff;min-height:44px}
        .login-input-wrap input{flex:1;border:none;outline:none;padding:14px 14px;font-size:15px;color:var(--text)}
        .login-input-wrap input::placeholder{color:var(--text-lighter)}
        .login-code-btn{padding:0 12px;font-size:13px;color:var(--primary);cursor:pointer;white-space:nowrap;border-left:1px solid var(--border);height:44px;display:flex;align-items:center;background:#fff}
        .login-code-btn.disabled{color:var(--text-lighter);cursor:not-allowed}
        .login-btn-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:2px}
        .login-btn{background:var(--primary);color:#fff;border:none;border-radius:var(--radius-sm);padding:12px 28px;font-size:15px;font-weight:600;cursor:pointer;transition:background .2s;white-space:nowrap;flex-shrink:0}
        .login-btn:hover{background:var(--primary-dark)}
        .login-links{display:flex;align-items:center;gap:14px;font-size:13px}
        .login-links a{color:var(--text-light);text-decoration:none}
        .login-links a:hover{color:var(--primary)}
        .login-switch{color:var(--primary);cursor:pointer;font-size:13px}
        .login-switch:hover{text-decoration:underline}
        .qr-panel{text-align:center;padding:10px 0;justify-content:center}
        .qr-panel .qr-placeholder{width:140px;height:140px;margin:0 auto 10px;display:flex;align-items:center;justify-content:center;background:#f8fafc;border:1px dashed var(--border);border-radius:var(--radius);color:var(--text-lighter);font-size:13px}
        .qr-panel p{font-size:12px;color:var(--text-secondary)}
        .user-panel{display:none;flex-direction:column;gap:6px;height:100%}
        .user-panel.active{display:flex}
        .user-header{display:flex;align-items:center;gap:12px}
        .user-avatar{width:48px;height:48px;border-radius:50%;object-fit:cover;background:#f3f4f6;flex-shrink:0}
        .user-meta{flex:1;min-width:0}
        .user-name{font-size:16px;font-weight:600;color:var(--text);line-height:1.4}
        .user-welcome{font-size:12px;color:var(--text-light);margin-top:2px}
        .user-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;text-align:center;padding:6px 0;border-top:1px solid var(--border-light);border-bottom:1px solid var(--border-light)}
        .user-stats a{text-decoration:none;color:inherit}
        .user-stats a:hover .user-stat-num{color:var(--primary-dark)}
        .user-stat-num{font-size:17px;font-weight:700;color:var(--danger);line-height:1.3}
        .user-stat-num.green{color:var(--success)}
        .user-stat-num.blue{color:var(--primary)}
        .user-stat-num.orange{color:var(--orange)}
        .user-stat-label{font-size:12px;color:var(--text-light);margin-top:2px}
        .user-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
        .user-action-btn{display:flex;flex-direction:column;align-items:center;gap:2px;padding:5px 4px;border-radius:var(--radius-sm);cursor:pointer;transition:background .2s;font-size:12px;color:var(--text-secondary)}
        .user-action-btn:hover{background:var(--primary-bg);color:var(--primary)}
        .user-action-btn .icon,.user-action-btn .bal-top{width:32px;height:32px;display:flex;align-items:center;justify-content:center;font-size:16px}
        .user-action-btn .icon{border-radius:50%}
        .user-action-btn .icon.blue{background:var(--primary-bg);color:var(--primary)}
        .user-action-btn .icon.green{background:#f0fdf4;color:var(--success)}
        .user-action-btn .icon.orange{background:#fff7ed;color:var(--orange)}
        .user-action-btn .bal-top{font-size:13px;font-weight:700;color:var(--success);border-radius:var(--radius-sm);background:#f0fdf4;padding:0 6px;white-space:nowrap}
        .publish-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;flex-shrink:0}
        .publish-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:14px 12px;border-radius:var(--radius);font-size:15px;font-weight:600;cursor:pointer;border:none;transition:all .2s}
        .publish-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
        .publish-btn.market{background:var(--primary);color:#fff}
        .publish-btn.market:hover{background:var(--primary-dark)}
        .publish-btn.carpool{background:var(--accent);color:#fff}
        .publish-btn.carpool:hover{background:#d97706}

        /* 5列集市列表 */
        .market-table{width:100%}
        .market-row{display:flex;align-items:center;padding:12px 16px;border-bottom:1px solid var(--border-light);cursor:pointer;transition:background .15s;gap:0}
        .market-row:hover{background:#f8fafc}
        .market-row:last-child{border-bottom:none}
        .market-row.is-top{background:#f8faff}
        .market-row.is-top:hover{background:#f0f4ff}
        .market-col{padding:0 8px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
        .market-col.col-cat{width:100px;flex-direction:column;gap:4px;align-items:flex-start}
        .market-col.col-content{flex:1;min-width:0;justify-content:flex-start;gap:10px}
        .market-col.col-contact{width:85px}
        .market-col.col-phone{width:110px}
        .market-col.col-time{width:90px}
        .mc-tag{display:inline-block;padding:2px 8px;border-radius:4px;font-size:12px;font-weight:500}
        .mc-tag.red{background:#fef2f2;color:var(--danger)}
        .mc-tag.blue{background:var(--primary-bg);color:var(--primary)}
        .mc-tag.green{background:#f0fdf4;color:var(--success)}
        .mc-tag.orange{background:#fff7ed;color:var(--orange)}
        .mc-tag.purple{background:#faf5ff;color:var(--purple)}
        .mc-top{display:inline-block;padding:1px 6px;border-radius:4px;font-size:11px;font-weight:600;background:linear-gradient(135deg,#fef3c7,#fde68a);color:#92400e}
        .mc-thumb{width:50px;height:50px;border-radius:var(--radius-sm);object-fit:cover;flex-shrink:0;background:#f3f4f6}
        .mc-text{font-size:14px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
        .mc-text.wrap{white-space:normal;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
        .mc-text.red{color:var(--danger);font-weight:600}
        .mc-img-count{font-size:12px;color:var(--primary);font-weight:500}
        .mc-contact,.mc-phone,.mc-time{font-size:13px;color:var(--text-secondary);text-align:center}

        /* 拼车列表5列布局 */
        .carpool-table{width:100%}
        .carpool-row{display:flex;align-items:center;padding:12px 16px;border-bottom:1px solid var(--border-light);cursor:pointer;transition:background .15s;gap:0}
        .carpool-row:hover{background:#f8fafc}
        .carpool-row:last-child{border-bottom:none}
        .carpool-row.is-top{background:#f8faff}
        .carpool-row.is-top:hover{background:#f0f4ff}
        .carpool-col{padding:0 8px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
        .carpool-col.col-type{width:90px;flex-direction:column;gap:4px}
        .carpool-col.col-route{flex:1;min-width:0;justify-content:flex-start}
        .carpool-col.col-seats{width:90px}
        .carpool-col.col-phone{width:120px}
        .carpool-col.col-time{width:150px}
        .cp-type-tag{padding:2px 8px;border-radius:4px;font-size:12px;font-weight:600}
        .cp-type-tag.che{background:var(--primary-bg);color:var(--primary)}
        .cp-type-tag.ren{background:#fff7ed;color:var(--orange)}
        .cp-top-tag{display:inline-block;padding:1px 6px;border-radius:4px;font-size:11px;font-weight:600;background:linear-gradient(135deg,#fef3c7,#fde68a);color:#92400e}
        .cp-route{display:flex;align-items:center;gap:4px;font-size:14px;color:var(--text);overflow:hidden}
        .cp-route .cp-place{white-space:nowrap}
        .cp-route .cp-arrow{color:var(--text-lighter);flex-shrink:0}
        .cp-route .cp-waypoint{font-size:12px;color:var(--text-light);white-space:nowrap}
        .cp-seats{font-size:13px;color:var(--text-secondary);text-align:center}
        .cp-seats.full{color:var(--danger);font-weight:600}
        .cp-phone{font-size:13px;color:var(--text-secondary)}
        .cp-time{font-size:12px;color:var(--text-lighter)}

        /* Filter bar collapsible */
        .filter-item.sub{padding-left:20px;font-size:12px;color:var(--text-light)}
        .filter-item.sub::before{content:'└ '}
        .filter-item.active.sub{color:var(--primary);background:var(--primary-bg)}

        /* 拼车搜索框 */
        .carpool-search-bar{padding:12px 20px;background:#f8fafc;border-bottom:1px solid var(--border-light);display:none}
        .carpool-search-bar.active{display:block}
        .carpool-search-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
        .cs-input-wrap{flex:1;min-width:120px;display:flex;align-items:center;gap:6px}
        .cs-input-wrap.start{flex:1.2}
        .cs-input-wrap.end{flex:1.2}
        .cs-input-label{font-size:12px;color:var(--text-light);white-space:nowrap}
        .cs-input{flex:1;border:1px solid var(--border);border-radius:var(--radius-sm);padding:8px 12px;font-size:13px;color:var(--text);outline:none;min-width:80px}
        .cs-input:focus{border-color:var(--primary)}
        .cs-input::placeholder{color:var(--text-lighter)}
        .cs-search-btn{padding:8px 20px;background:var(--primary);color:#fff;border:none;border-radius:var(--radius-sm);font-size:13px;font-weight:500;cursor:pointer;white-space:nowrap}
        .cs-search-btn:hover{background:var(--primary-dark)}
        .cs-clear-btn{padding:8px 14px;background:var(--bg);color:var(--text-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:13px;cursor:pointer}
        .cs-clear-btn:hover{background:var(--border-light)}

        @media(max-width:1200px){
            .banner-grid{grid-template-columns:6fr 4fr;height:320px}
            .banner-sidebar{height:320px}
        }
        @media(max-width:768px){
            .banner-grid{grid-template-columns:1fr;height:auto}
            .banner-sidebar{height:auto;display:flex;flex-direction:row;flex-wrap:wrap}
            .notice-box,.login-box,.publish-btns{flex:1;min-width:200px}
        }

        /* Pagination */
        .pagination{display:flex;justify-content:center;align-items:center;gap:6px;padding:20px}
        .page-btn{padding:6px 14px;border-radius:var(--radius-sm);font-size:13px;color:var(--text-secondary);cursor:pointer;transition:all .2s;border:1px solid var(--border)}
        .page-btn:hover,.page-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)}
        .page-btn.disabled{opacity:.4;cursor:not-allowed}

        /* Ad Box (same as index) */
        .ad-box{background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;position:relative}
        .ad-box a{display:block}
        .ad-box img{width:100%;height:200px;display:block;object-fit:cover;transition:transform .3s}
        .ad-box:hover img{transform:scale(1.03)}

        /* Sidebar */
        .sidebar-card{background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;margin-bottom:16px}
        .sidebar-card-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--border)}
        .sidebar-card-header h3{font-size:15px;font-weight:600;color:var(--text)}
        .sidebar-card-body{padding:12px 16px}

        /* News list in sidebar */
        .sb-news-item{display:flex;gap:10px;padding:8px 0;border-bottom:1px solid var(--border-light);cursor:pointer}
        .sb-news-item:last-child{border-bottom:none}
        .sb-news-thumb{width:60px;height:42px;border-radius:6px;object-fit:cover;flex-shrink:0;background:#f3f4f6}
        .sb-news-title{font-size:13px;color:var(--text);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.4}

        /* Carpool list in sidebar */
        .sb-carpool-item{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--border-light);cursor:pointer;font-size:13px}
        .sb-carpool-item:last-child{border-bottom:none}
        .sb-cp-type{padding:1px 6px;border-radius:3px;font-size:11px;font-weight:600;flex-shrink:0}
        .sb-cp-type.che{background:#eff6ff;color:var(--primary)}
        .sb-cp-type.ren{background:#fef3c7;color:#92400e}

        /* Loading & Empty */
        .loading{padding:40px;text-align:center;color:var(--text-lighter)}
        .empty{padding:60px 20px;text-align:center;color:var(--text-lighter)}
        .empty-icon{font-size:48px;margin-bottom:12px}

        /* ====== Footer ====== */
        .footer{background:var(--bg-dark);padding:36px 20px 20px;margin-top:20px}
        .footer-inner{max-width:var(--max-width);margin:0 auto;padding:0 20px}
        .footer-main{display:flex;gap:40px;margin-bottom:24px}
        .footer-left{flex:1;min-width:0}
        .footer-left h4{color:#fff;font-size:14px;font-weight:600;margin-bottom:14px}
        .friend-links{display:flex;flex-wrap:wrap;gap:12px 20px;margin-bottom:20px}
        .friend-links a{color:rgba(255,255,255,.6);font-size:13px;transition:color .2s}
        .friend-links a:hover{color:#fff}
        .copyright{color:rgba(255,255,255,.4);font-size:12px;line-height:1.8}
        .footer-right{display:flex;gap:16px;flex-shrink:0;flex-wrap:wrap}
        .qr-item{text-align:center;flex:1;min-width:0}
        .qr-img{width:80px;height:80px;background:rgba(255,255,255,.95);border-radius:var(--radius-sm);overflow:hidden;margin-bottom:8px;display:flex;align-items:center;justify-content:center}
        .qr-img img{width:100%;height:100%;object-fit:cover;display:block}
        .qr-img .qr-placeholder{font-size:12px;color:#9ca3af}
        .qr-label{color:rgba(255,255,255,.6);font-size:12px}
        .friend-desc{color:rgba(255,255,255,.5);font-size:13px;line-height:1.6;margin-top:0}
        .friend-desc-row{display:flex;align-items:flex-start;gap:20px;margin-top:8px}
        .friend-links-text{display:flex;gap:16px;margin-top:10px}
        .friend-links-text a{color:rgba(255,255,255,.5);font-size:13px;transition:color .2s}
        .friend-links-text a:hover{color:#fff}
        .footer-bottom-info{display:flex;align-items:center;gap:8px;justify-content:center;margin-top:6px;font-size:12px;color:rgba(255,255,255,.4)}
        .footer-bottom-info span{white-space:nowrap}
        .footer-dot{opacity:.3}
        .friend-links-inline a{color:rgba(255,255,255,.5);font-size:13px;transition:color .2s}
        .friend-links-inline a:hover{color:#fff}
        .footer-bottom{margin-top:20px;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);text-align:center}
        .footer-bottom p{color:rgba(255,255,255,.35);font-size:12px}

        @media(max-width:1200px){
            .content-grid{grid-template-columns:6fr 4fr}
            .card-grid{grid-template-columns:repeat(2,1fr)}
        }
        @media(max-width:768px){
            body{min-width:auto}
            .header-nav{display:none}
            .content-grid{grid-template-columns:1fr}
            .card-grid{grid-template-columns:1fr}
        }