{"id":132,"date":"2026-01-13T09:58:37","date_gmt":"2026-01-13T01:58:37","guid":{"rendered":"https:\/\/ryanren.top\/?page_id=132"},"modified":"2026-05-11T16:55:07","modified_gmt":"2026-05-11T08:55:07","slug":"lxw","status":"publish","type":"page","link":"https:\/\/ryanren.top\/index.php\/lxw\/","title":{"rendered":"\u8054\u7cfb\u6211"},"content":{"rendered":"\n<!DOCTYPE html>\n<html lang=\"zh-CN\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>\u8054\u7cfb\u6211 \u00b7 RyanRen<\/title>\n    <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n    <style>\n        * { margin: 0; padding: 0; box-sizing: border-box; }\n\n        body {\n            background: #ffffff;\n            color: #1d1d1f;\n            font-family: -apple-system, BlinkMacSystemFont, \"SF Pro Display\", \"SF Pro Text\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;\n            -webkit-font-smoothing: antialiased;\n            line-height: 1.5;\n        }\n\n        \/* \u2500\u2500\u2500 Hero \u2500\u2500\u2500 *\/\n        .hero {\n            min-height: 55vh;\n            display: flex;\n            flex-direction: column;\n            justify-content: center;\n            align-items: center;\n            text-align: center;\n            padding: 5rem 1.5rem 3rem;\n            background: linear-gradient(180deg, #f5f5f7 0%, #ffffff 100%);\n        }\n\n        .hero-eyebrow {\n            font-size: 0.9rem;\n            font-weight: 500;\n            color: #86868b;\n            letter-spacing: 0.05em;\n            text-transform: uppercase;\n            margin-bottom: 1rem;\n        }\n\n        .hero-title {\n            font-size: clamp(2.5rem, 6vw, 4.2rem);\n            font-weight: 700;\n            letter-spacing: -0.035em;\n            line-height: 1.08;\n            max-width: 680px;\n            margin-bottom: 1.2rem;\n            color: #1d1d1f;\n        }\n\n        .hero-sub {\n            font-size: clamp(1rem, 2vw, 1.25rem);\n            font-weight: 400;\n            color: #6e6e73;\n            max-width: 480px;\n            line-height: 1.6;\n        }\n\n        \/* \u2500\u2500\u2500 Primary Contacts \u2500\u2500\u2500 *\/\n        .contacts-section {\n            max-width: 860px;\n            margin: 0 auto;\n            padding: 2rem 1.5rem 5rem;\n        }\n\n        .section-label {\n            font-size: 0.75rem;\n            font-weight: 600;\n            color: #86868b;\n            letter-spacing: 0.12em;\n            text-transform: uppercase;\n            margin-bottom: 1.2rem;\n        }\n\n        .contact-grid {\n            display: grid;\n            grid-template-columns: repeat(3, 1fr);\n            gap: 1rem;\n        }\n\n        .contact-item {\n            position: relative;\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            text-align: center;\n            padding: 2.5rem 1.5rem;\n            background: #ffffff;\n            border: 1px solid #d2d2d7;\n            border-radius: 20px;\n            text-decoration: none;\n            color: #1d1d1f;\n            transition: all 0.35s cubic-bezier(0.25, 0.1, 0.25, 1);\n        }\n\n        .contact-item:hover {\n            border-color: #b8b8bf;\n            box-shadow: 0 12px 40px -12px rgba(0, 0, 0, 0.15);\n            transform: translateY(-4px);\n        }\n\n        \/* \u63a8\u8350\u5fbd\u7ae0 *\/\n        .contact-item.recommended::after {\n            content: \"\u63a8\u8350\";\n            position: absolute;\n            top: -1px;\n            right: 20px;\n            background: #0071e3;\n            color: #fff;\n            font-size: 0.65rem;\n            font-weight: 600;\n            padding: 0.25rem 0.75rem;\n            border-radius: 0 0 10px 10px;\n            letter-spacing: 0.03em;\n        }\n\n        .contact-icon {\n            font-size: 2.8rem;\n            margin-bottom: 1rem;\n            transition: transform 0.3s ease;\n        }\n\n        .contact-item:hover .contact-icon {\n            transform: scale(1.08);\n        }\n\n        .contact-item.wechat .contact-icon { color: #07c160; }\n        .contact-item.qq .contact-icon { color: #12b7f5; }\n        .contact-item.email .contact-icon { color: #6e6e73; }\n\n        .contact-name {\n            font-size: 1.1rem;\n            font-weight: 600;\n            color: #1d1d1f;\n            margin-bottom: 0.3rem;\n        }\n\n        .contact-hint {\n            font-size: 0.78rem;\n            color: #86868b;\n        }\n\n        \/* \u2500\u2500\u2500 \u4e8c\u7ef4\u7801\u60ac\u6d6e \u2500\u2500\u2500 *\/\n        .qr-popup {\n            display: none;\n            position: absolute;\n            bottom: calc(100% + 16px);\n            left: 50%;\n            transform: translateX(-50%);\n            width: 240px;\n            height: 240px;\n            background: #fff;\n            border-radius: 20px;\n            padding: 14px;\n            box-shadow: 0 25px 70px -15px rgba(0, 0, 0, 0.22), 0 0 0 1px rgba(0,0,0,0.05);\n            z-index: 100;\n        }\n\n        .qr-popup img {\n            width: 100%;\n            height: 100%;\n            object-fit: contain;\n            border-radius: 10px;\n        }\n\n        .qr-popup-text {\n            font-size: 0.65rem;\n            color: #86868b;\n            text-align: center;\n            margin-top: 0.5rem;\n            font-weight: 500;\n        }\n\n        .qr-popup::after {\n            content: '';\n            position: absolute;\n            top: 100%;\n            left: 50%;\n            transform: translateX(-50%);\n            border: 9px solid transparent;\n            border-top-color: #fff;\n        }\n\n        .contact-item:hover .qr-popup {\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            animation: fadeUp 0.25s ease;\n            cursor: pointer;\n        }\n\n        \/* \u79fb\u52a8\u7aef\u7981\u7528 hover\uff0c\u6539\u4e3a\u70b9\u51fb *\/\n        @media (hover: hover) and (pointer: fine) {\n            .contact-item:hover .qr-popup { display: none; }\n        }\n\n        @keyframes fadeUp {\n            from { opacity: 0; transform: translateX(-50%) translateY(8px); }\n            to { opacity: 1; transform: translateX(-50%) translateY(0); }\n        }\n\n        \/* \u2500\u2500\u2500 Divider \u2500\u2500\u2500 *\/\n        .divider {\n            height: 1px;\n            background: linear-gradient(90deg, transparent, #d2d2d7, transparent);\n            margin: 3.5rem 0 3rem;\n        }\n\n        \/* \u2500\u2500\u2500 Social Platforms \u2500\u2500\u2500 *\/\n        .social-grid {\n            display: grid;\n            grid-template-columns: repeat(6, 1fr);\n            gap: 0.75rem;\n        }\n\n        .social-item {\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            padding: 1.25rem 0.5rem;\n            border-radius: 16px;\n            background: #fafafa;\n            border: 1px solid #e8e8ed;\n            text-decoration: none;\n            color: #1d1d1f;\n            transition: all 0.3s ease;\n            cursor: pointer;\n        }\n\n        .social-item:hover {\n            background: #f0f0f5;\n            border-color: #c8c8cf;\n            transform: translateY(-3px);\n            box-shadow: 0 6px 20px -8px rgba(0, 0, 0, 0.12);\n        }\n\n        .social-icon {\n            font-size: 1.6rem;\n            margin-bottom: 0.5rem;\n            color: #515154;\n            transition: color 0.2s;\n        }\n\n        .social-item:hover .social-icon { color: #1d1d1f; }\n\n        .social-label {\n            font-size: 0.72rem;\n            color: #86868b;\n            font-weight: 500;\n        }\n\n        .social-item:hover .social-label { color: #515154; }\n\n        \/* \u5e73\u53f0\u54c1\u724c\u8272 *\/\n        .social-item.xhs:hover .social-icon { color: #fe2c55; }\n        .social-item.weibo:hover .social-icon { color: #e6162d; }\n        .social-item.bilibili:hover .social-icon { color: #fb7299; }\n        .social-item.kuaishou:hover .social-icon { color: #00c6ff; }\n        .social-item.discord:hover .social-icon { color: #5865f2; }\n        .social-item.instagram:hover .social-icon { color: #e4405f; }\n        .social-item.tiktok:hover .social-icon { color: #000; }\n        .social-item.facebook:hover .social-icon { color: #1877f2; }\n        .social-item.twitter:hover .social-icon { color: #1da1f2; }\n\n        \/* \u2500\u2500\u2500 Footer \u2500\u2500\u2500 *\/\n        .site-footer {\n            border-top: 1px solid #d2d2d7;\n            padding: 2.5rem 1.5rem;\n            text-align: center;\n        }\n\n        .footer-links {\n            display: flex;\n            gap: 0.6rem;\n            justify-content: center;\n            flex-wrap: wrap;\n            margin-bottom: 1.2rem;\n        }\n\n        .footer-links a {\n            display: inline-flex;\n            align-items: center;\n            gap: 0.3rem;\n            padding: 0.3rem 0.9rem;\n            border: 1px solid #d2d2d7;\n            border-radius: 980px;\n            font-size: 0.7rem;\n            color: #6e6e73;\n            text-decoration: none;\n            transition: all 0.2s;\n            background: #fafafa;\n        }\n\n        .footer-links a:hover {\n            background: #f0f0f5;\n            color: #1d1d1f;\n            border-color: #b8b8bf;\n        }\n\n        .footer-links img {\n            width: 13px;\n            height: 13px;\n        }\n\n        .copyright {\n            font-size: 0.75rem;\n            color: #86868b;\n        }\n\n        .copyright a {\n            color: #0071e3;\n            text-decoration: none;\n        }\n\n        .copyright a:hover {\n            text-decoration: underline;\n        }\n\n        \/* \u2500\u2500\u2500 \u79fb\u52a8\u7aef\u6a21\u6001\u6846 \u2500\u2500\u2500 *\/\n        #qrModal {\n            display: none;\n            position: fixed;\n            inset: 0;\n            background: rgba(0, 0, 0, 0.5);\n            backdrop-filter: blur(8px);\n            -webkit-backdrop-filter: blur(8px);\n            align-items: center;\n            justify-content: center;\n            z-index: 2000;\n        }\n\n        #qrModal > div {\n            background: #fff;\n            padding: 1.5rem;\n            border-radius: 24px;\n            text-align: center;\n            max-width: 320px;\n            box-shadow: 0 30px 80px -20px rgba(0,0,0,0.45);\n        }\n\n        #qrModal img {\n            width: 240px;\n            height: 240px;\n            object-fit: contain;\n            border-radius: 14px;\n        }\n\n        #qrModal p {\n            margin-top: 1rem;\n            font-size: 0.8rem;\n            color: #86868b;\n        }\n\n        \/* \u2500\u2500\u2500 Animations \u2500\u2500\u2500 *\/\n        .fade-in {\n            opacity: 0;\n            transform: translateY(18px);\n            animation: fadeIn 0.8s cubic-bezier(0.25, 0.1, 0.25, 1) forwards;\n        }\n\n        .delay-1 { animation-delay: 0.1s; }\n        .delay-2 { animation-delay: 0.2s; }\n        .delay-3 { animation-delay: 0.3s; }\n        .delay-4 { animation-delay: 0.4s; }\n\n        @keyframes fadeIn {\n            to { opacity: 1; transform: translateY(0); }\n        }\n\n        \/* \u2500\u2500\u2500 Responsive \u2500\u2500\u2500 *\/\n        @media (max-width: 768px) {\n            .contact-grid {\n                grid-template-columns: 1fr;\n                gap: 0.8rem;\n            }\n            .contact-item {\n                flex-direction: row;\n                padding: 1.5rem;\n                text-align: left;\n                gap: 1.2rem;\n            }\n            .contact-icon {\n                font-size: 2.2rem;\n                margin-bottom: 0;\n            }\n            .qr-popup { display: none !important; }\n            .social-grid {\n                grid-template-columns: repeat(3, 1fr);\n            }\n            .contact-item.recommended::after {\n                top: 50%;\n                right: 1rem;\n                transform: translateY(-50%);\n                border-radius: 8px;\n            }\n        }\n\n        @media (max-width: 480px) {\n            .social-grid {\n                grid-template-columns: repeat(3, 1fr);\n            }\n        }\n    <\/style>\n<\/head>\n<body>\n\n<!-- Hero -->\n<section class=\"hero\">\n    <p class=\"hero-eyebrow fade-in\">RyanRen \u00b7 \u8054\u7cfb\u6211<\/p>\n    <h1 class=\"hero-title fade-in delay-1\">\u9009\u62e9\u6700\u4fbf\u6377\u7684\u65b9\u5f0f<br>\u968f\u65f6\u4e0e\u6211\u8fde\u63a5<\/h1>\n    <p class=\"hero-sub fade-in delay-2\">\u7a7a\u95f4\u8bbe\u8ba1 \u00b7 \u54c1\u724c\u6807\u51c6\u5316 \u00b7 \u9879\u76ee\u5408\u4f5c<\/p>\n<\/section>\n\n<!-- Contacts -->\n<div class=\"contacts-section\">\n    <p class=\"section-label fade-in delay-2\">\u6838\u5fc3\u8054\u7cfb\u65b9\u5f0f<\/p>\n\n    <div class=\"contact-grid fade-in delay-3\">\n        <!-- \u5fae\u4fe1 -->\n        <a href=\"javascript:void(0);\" class=\"contact-item wechat recommended\" data-qr=\"https:\/\/ryanren.top\/wp-content\/uploads\/2026\/01\/424272e04eb71ac15fd2aad2a5c48d19-e1768271859392.jpg\" id=\"qrWechat\">\n            <i class=\"fab fa-weixin contact-icon\"><\/i>\n            <div>\n                <div class=\"contact-name\">\u5fae\u4fe1<\/div>\n                <div class=\"contact-hint\">\u626b\u7801\u6dfb\u52a0 \u00b7 \u63a8\u8350<\/div>\n            <\/div>\n            <div class=\"qr-popup\">\n                <img decoding=\"async\" data-src=\"https:\/\/ryanren.top\/wp-content\/uploads\/2026\/01\/424272e04eb71ac15fd2aad2a5c48d19-e1768271859392.jpg\" alt=\"\u5fae\u4fe1\u4e8c\u7ef4\u7801\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" class=\"lazyload\" style=\"--smush-placeholder-width: 1074px; --smush-placeholder-aspect-ratio: 1074\/1074;\">\n                <span class=\"qr-popup-text\">\ud83d\udc46 \u70b9\u51fb\u67e5\u770b\u5927\u56fe<\/span>\n            <\/div>\n        <\/a>\n\n        <!-- QQ -->\n        <a href=\"javascript:void(0);\" class=\"contact-item qq\" data-qr=\"https:\/\/ryanren.top\/wp-content\/uploads\/2026\/01\/c811405e117ef195ce371d715f1ac31f-e1768271844110.jpg\" id=\"qrQQ\">\n            <i class=\"fab fa-qq contact-icon\"><\/i>\n            <div>\n                <div class=\"contact-name\">QQ<\/div>\n                <div class=\"contact-hint\">\u626b\u7801\u6dfb\u52a0<\/div>\n            <\/div>\n            <div class=\"qr-popup\">\n                <img decoding=\"async\" data-src=\"https:\/\/ryanren.top\/wp-content\/uploads\/2026\/01\/c811405e117ef195ce371d715f1ac31f-e1768271844110.jpg\" alt=\"QQ\u4e8c\u7ef4\u7801\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" class=\"lazyload\" style=\"--smush-placeholder-width: 956px; --smush-placeholder-aspect-ratio: 956\/956;\">\n                <span class=\"qr-popup-text\">\ud83d\udc46 \u70b9\u51fb\u67e5\u770b\u5927\u56fe<\/span>\n            <\/div>\n        <\/a>\n\n        <!-- \u90ae\u7bb1 -->\n        <a href=\"mailto:zhi20yuan10@qq.com\" class=\"contact-item email\">\n            <i class=\"fas fa-envelope contact-icon\"><\/i>\n            <div>\n                <div class=\"contact-name\">\u90ae\u7bb1<\/div>\n                <div class=\"contact-hint\">\u70b9\u51fb\u53d1\u9001<\/div>\n            <\/div>\n        <\/a>\n    <\/div>\n\n    <div class=\"divider\"><\/div>\n\n    <!-- Social Platforms -->\n    <p class=\"section-label fade-in\">\u793e\u4ea4\u5e73\u53f0<\/p>\n\n    <div class=\"social-grid fade-in delay-1\">\n        <a href=\"https:\/\/xhslink.com\/m\/Ap5mAFczFnH\" target=\"_blank\" class=\"social-item xhs\">\n            <i class=\"fas fa-heart social-icon\"><\/i>\n            <span class=\"social-label\">\u5c0f\u7ea2\u4e66<\/span>\n        <\/a>\n        <a href=\"https:\/\/m.weibo.cn\/profile\/5579464626\" target=\"_blank\" class=\"social-item weibo\">\n            <i class=\"fab fa-weibo social-icon\"><\/i>\n            <span class=\"social-label\">\u5fae\u535a<\/span>\n        <\/a>\n        <a href=\"javascript:void(0);\" class=\"social-item tiktok\" data-qr=\"https:\/\/ryanren.top\/wp-content\/uploads\/2026\/01\/29fe8d4241f1e4c15ad67203fa853557-e1768271822100.jpg\">\n            <i class=\"fab fa-tiktok social-icon\"><\/i>\n            <span class=\"social-label\">\u6296\u97f3<\/span>\n        <\/a>\n        <a href=\"https:\/\/space.bilibili.com\/15026762\" target=\"_blank\" class=\"social-item bilibili\">\n            <i class=\"fas fa-video social-icon\"><\/i>\n            <span class=\"social-label\">\u54d4\u54e9\u54d4\u54e9<\/span>\n        <\/a>\n        <a href=\"https:\/\/v.kuaishou.com\/KLffGEm1\" target=\"_blank\" class=\"social-item kuaishou\">\n            <i class=\"fas fa-play-circle social-icon\"><\/i>\n            <span class=\"social-label\">\u5feb\u624b<\/span>\n        <\/a>\n        <a href=\"https:\/\/instagram.com\/zhi20yuan10\" target=\"_blank\" class=\"social-item instagram\">\n            <i class=\"fab fa-instagram social-icon\"><\/i>\n            <span class=\"social-label\">Instagram<\/span>\n        <\/a>\n        <a href=\"https:\/\/twitter.com\/starsmaxzy\" target=\"_blank\" class=\"social-item twitter\">\n            <i class=\"fab fa-twitter social-icon\"><\/i>\n            <span class=\"social-label\">Twitter<\/span>\n        <\/a>\n        <a href=\"https:\/\/facebook.com\/zhi20yuan10\" target=\"_blank\" class=\"social-item facebook\">\n            <i class=\"fab fa-facebook-f social-icon\"><\/i>\n            <span class=\"social-label\">Facebook<\/span>\n        <\/a>\n        <a href=\"https:\/\/discord.gg\/your-invite-code\" target=\"_blank\" class=\"social-item discord\">\n            <i class=\"fab fa-discord social-icon\"><\/i>\n            <span class=\"social-label\">Discord<\/span>\n        <\/a>\n    <\/div>\n<\/div>\n\n<!-- Footer -->\n<div class=\"site-footer\">\n    <div class=\"footer-links\">\n        <a href=\"https:\/\/beian.miit.gov.cn\/\" target=\"_blank\">\n            <i class=\"fas fa-shield-alt\"><\/i> \u9c81ICP\u59072026001577\u53f7-1\n        <\/a>\n        <a href=\"https:\/\/beian.mps.gov.cn\/#\/query\/webSearch?code=37172402000457\" target=\"_blank\">\n            <img decoding=\"async\" data-src=\"https:\/\/www.beian.gov.cn\/img\/ghs.png\" alt=\"\u516c\u5b89\u5907\u6848\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" class=\"lazyload\"> \u9c81\u516c\u7f51\u5b89\u590737172402000457\u53f7\n        <\/a>\n    <\/div>\n    <div class=\"copyright\">\n        \u00a9 2026 RyanRen \u00b7 <a href=\"https:\/\/ryanren.top\">\u8fd4\u56de\u9996\u9875<\/a>\n    <\/div>\n<\/div>\n\n<!-- Mobile QR Modal -->\n<div id=\"qrModal\" onclick=\"closeModal(event)\">\n    <div>\n        <img decoding=\"async\" id=\"modalImage\" src=\"\" alt=\"\u4e8c\u7ef4\u7801\">\n        <p>\u70b9\u51fb\u7a7a\u767d\u5173\u95ed<\/p>\n    <\/div>\n<\/div>\n\n<script>\n(function() {\n    const modal = document.getElementById('qrModal');\n    const modalImg = document.getElementById('modalImage');\n\n    window.closeModal = function(e) {\n        if (e.target === modal) {\n            modal.style.display = 'none';\n            modalImg.src = '';\n        }\n    };\n\n    \/\/ \u70b9\u51fb\u6574\u4e2a contact-item \u5f39\u51fa\u5927\u56fe\uff08\u684c\u9762\u7aef\uff09\n    document.querySelectorAll('.contact-item[data-qr]').forEach(item => {\n        item.addEventListener('click', function(e) {\n            \/\/ \u5982\u679c\u70b9\u4e86\u94fe\u63a5\u9ed8\u8ba4\u884c\u4e3a\u5c31\u7b97\u4e86\n            const qr = this.getAttribute('data-qr');\n            if (qr) {\n                modalImg.src = qr;\n                modal.style.display = 'flex';\n            }\n        });\n    });\n\n    \/\/ \u79fb\u52a8\u7aef hover \u4e0d\u9700\u8981\uff0c\u4ea4\u7ed9\u70b9\u51fb\n    const isMobile = \/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini\/i.test(navigator.userAgent);\n    if (isMobile) {\n        document.querySelectorAll('[data-qr]').forEach(item => {\n            item.addEventListener('mouseenter', function() {\n                \/\/ \u79fb\u52a8\u7aef\u7981\u7528 hover \u5f39\u7a97\n                const popup = this.querySelector('.qr-popup');\n                if (popup) popup.style.display = 'none';\n            });\n        });\n    }\n})();\n<\/script>\n\n<\/body>\n<\/html>\n\n\n<!-- \u5f15\u5165 Font Awesome\uff08\u5982\u679c\u9875\u9762\u5df2\u6709\u53ef\u7701\u7565\uff09 -->\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n\n<!-- \u5f15\u5165 Coze SDK -->\n<script src=\"https:\/\/lf-cdn.coze.cn\/obj\/unpkg\/flow-platform\/chat-app-sdk\/1.2.0-beta.19\/libs\/cn\/index.js\"><\/script>\n\n<!-- \u6c14\u6ce1\u63d0\u793a\u6837\u5f0f -->\n<style>\n.chat-guide-bubble {\n    position: fixed;\n    bottom: 100px;\n    right: 30px;\n    background: #ffffff;\n    border-radius: 30px 30px 30px 8px;\n    padding: 12px 20px;\n    padding-right: 40px;\n    box-shadow: 0 10px 25px rgba(0,0,0,0.2), 0 0 0 1px rgba(0,0,0,0.05);\n    font-size: 1rem;\n    color: #1e2b3a;\n    font-weight: 500;\n    z-index: 9999;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    animation: bubbleFloat 2s infinite ease-in-out;\n    pointer-events: none;\n}\n.chat-guide-bubble::after {\n    content: '';\n    position: absolute;\n    bottom: -10px;\n    right: 20px;\n    width: 0;\n    height: 0;\n    border-left: 12px solid transparent;\n    border-right: 12px solid transparent;\n    border-top: 12px solid #ffffff;\n    filter: drop-shadow(0 2px 2px rgba(0,0,0,0.1));\n}\n.chat-guide-bubble i:not(.bubble-close) {\n    color: #07C160;\n    font-size: 1.2rem;\n}\n.bubble-close {\n    position: absolute;\n    top: 8px;\n    right: 12px;\n    color: #999;\n    font-size: 1rem;\n    cursor: pointer;\n    transition: color 0.2s;\n    pointer-events: auto;\n    z-index: 10000;\n}\n.bubble-close:hover {\n    color: #333;\n}\n@keyframes bubbleFloat {\n    0% { transform: translateY(0); }\n    50% { transform: translateY(-5px); }\n    100% { transform: translateY(0); }\n}\n@media (max-width: 768px) {\n    .chat-guide-bubble {\n        bottom: 90px;\n        right: 20px;\n        padding: 8px 16px;\n        padding-right: 35px;\n        font-size: 0.9rem;\n    }\n    .bubble-close {\n        top: 5px;\n        right: 10px;\n    }\n}\n<\/style>\n\n<!-- \u6c14\u6ce1\u63d0\u793a HTML -->\n<div id=\"chatGuideBubble\" class=\"chat-guide-bubble\">\n    <i class=\"fas fa-comment-dots\"><\/i>\n    <span>\u6211\u662f\u4efb\u5fd7\u8fdc\u7684AI\u52a9\u7406 \u4efb\u4f55\u95ee\u9898\u53ef\u4ee5\u95ee\u6211\u270b\ufe0f<\/span>\n    <i class=\"fas fa-times bubble-close\" id=\"closeBubbleBtn\"><\/i>\n<\/div>\n\n<!-- \u5173\u95ed\u6c14\u6ce1\u811a\u672c -->\n<script>\ndocument.getElementById('closeBubbleBtn').addEventListener('click', function() {\n    var bubble = document.getElementById('chatGuideBubble');\n    if (bubble) bubble.style.display = 'none';\n});\n<\/script>\n\n<!-- \u667a\u80fd\u4f53\u521d\u59cb\u5316 -->\n<script>\n  new CozeWebSDK.WebChatClient({\n    config: {\n      bot_id: '7612944427740463142',\n    },\n    componentProps: {\n      title: 'Coze',\n    },\n    auth: {\n      type: 'token',\n      token: 'pat_eNR3YjtCD3eEWRv53Zd21lPTGlL633ht0hdzHlXbvQYHrGwgOzi8BAGMil29wlsQ',\n      onRefreshToken: function () {\n        return 'pat_eNR3YjtCD3eEWRv53Zd21lPTGlL633ht0hdzHlXbvQYHrGwgOzi8BAGMil29wlsQ'\n      }\n    }\n  });\n<\/script>","protected":false},"excerpt":{"rendered":"<p>\u8054\u7cfb\u6211 \u00b7 RyanRen RyanRen \u00b7 \u8054\u7cfb\u6211 \u9009\u62e9\u6700\u4fbf\u6377\u7684\u65b9\u5f0f\u968f\u65f6\u4e0e\u6211\u8fde\u63a5 \u7a7a\u95f4\u8bbe\u8ba1 \u00b7 \u54c1\u724c\u6807\u51c6\u5316 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"blank","meta":{"footnotes":""},"class_list":["post-132","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ryanren.top\/index.php\/wp-json\/wp\/v2\/pages\/132","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ryanren.top\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ryanren.top\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ryanren.top\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ryanren.top\/index.php\/wp-json\/wp\/v2\/comments?post=132"}],"version-history":[{"count":30,"href":"https:\/\/ryanren.top\/index.php\/wp-json\/wp\/v2\/pages\/132\/revisions"}],"predecessor-version":[{"id":1292,"href":"https:\/\/ryanren.top\/index.php\/wp-json\/wp\/v2\/pages\/132\/revisions\/1292"}],"wp:attachment":[{"href":"https:\/\/ryanren.top\/index.php\/wp-json\/wp\/v2\/media?parent=132"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}