ChatGo – \u9759\u6001\u804a\u5929<\/title>\n <style>\n :root {\n --bg-primary: #000000;\n --bg-secondary: #0d0d0d;\n --bg-tertiary: #161616;\n --bg-elevated: #1f1f1f;\n --border-subtle: #262626;\n --border-strong: #3a3a3a;\n --text-primary: #f5f5f5;\n --text-secondary: #a8a8a8;\n --text-tertiary: #737373;\n --text-inverse: #0a0a0a;\n --accent: #ffffff;\n --accent-muted: #d4d4d4;\n --radius-sm: 6px;\n --radius-md: 10px;\n --radius-lg: 14px;\n --radius-full: 9999px;\n --transition-fast: 120ms ease;\n --transition-base: 240ms cubic-bezier(0.25, 0.46, 0.45, 0.94);\n --font-mono: 'SF Mono', 'Fira Code', 'JetBrains Mono', 'Consolas', monospace;\n --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif;\n }\n\n * { margin: 0; padding: 0; box-sizing: border-box; }\n\n body {\n font-family: var(--font-sans);\n background: var(--bg-primary);\n color: var(--text-primary);\n height: 100vh;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n -webkit-font-smoothing: antialiased;\n }\n\n .grid-overlay {\n position: fixed;\n inset: 0;\n background-image:\n linear-gradient(rgba(255,255,255,0.015) 1px, transparent 1px),\n linear-gradient(90deg, rgba(255,255,255,0.015) 1px, transparent 1px);\n background-size: 48px 48px;\n pointer-events: none;\n z-index: 0;\n }\n\n .header {\n position: relative;\n z-index: 10;\n height: 56px;\n background: rgba(0,0,0,0.85);\n backdrop-filter: blur(16px);\n border-bottom: 1px solid var(--border-subtle);\n display: flex;\n align-items: center;\n flex-shrink: 0;\n }\n\n .header-inner {\n width: 100%;\n max-width: 900px;\n margin: 0 auto;\n padding: 0 20px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n .brand { display: flex; align-items: center; gap: 10px; user-select: none; }\n\n .brand-mark {\n width: 26px; height: 26px;\n border: 1.5px solid var(--accent);\n border-radius: var(--radius-sm);\n display: flex; align-items: center; justify-content: center;\n font-family: var(--font-mono); font-size: 10px; font-weight: 700;\n color: var(--accent);\n }\n\n .brand-name { font-size: 15px; font-weight: 600; letter-spacing: 0.3px; }\n .brand-dev {\n font-size: 10px;\n color: var(--text-tertiary);\n font-family: var(--font-mono);\n border-left: 1px solid var(--border-subtle);\n padding-left: 12px;\n }\n\n .main {\n position: relative;\n z-index: 1;\n flex: 1;\n max-width: 900px;\n width: 100%;\n margin: 0 auto;\n padding: 16px 20px 12px;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n }\n\n .conversation {\n flex: 1;\n overflow-y: auto;\n padding: 4px 0 8px;\n scrollbar-width: thin;\n scrollbar-color: var(--border-strong) transparent;\n }\n .conversation::-webkit-scrollbar { width: 4px; }\n .conversation::-webkit-scrollbar-track { background: transparent; }\n .conversation::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 2px; }\n\n .message-row {\n display: flex;\n gap: 12px;\n padding: 10px 12px;\n animation: msgIn 0.25s cubic-bezier(0.22,1,0.36,1) both;\n }\n @keyframes msgIn {\n from { opacity: 0; transform: translateY(8px); }\n to { opacity: 1; transform: translateY(0); }\n }\n .message-row.user { flex-direction: row-reverse; }\n\n .message-avatar {\n width: 28px; height: 28px; border-radius: var(--radius-sm);\n flex-shrink: 0; display: flex; align-items: center; justify-content: center;\n font-size: 10px; font-weight: 700; font-family: var(--font-mono);\n border: 1px solid var(--border-subtle); background: var(--bg-tertiary);\n color: var(--text-secondary); user-select: none;\n }\n .message-row.user .message-avatar {\n background: var(--accent); color: var(--text-inverse); border-color: var(--accent);\n }\n\n .message-body { max-width: 78%; display: flex; flex-direction: column; gap: 4px; }\n\n .message-text {\n font-size: 13.5px; line-height: 1.75; color: var(--text-primary);\n padding: 10px 14px; background: var(--bg-tertiary);\n border: 1px solid var(--border-subtle); border-radius: var(--radius-md);\n word-break: break-word; white-space: pre-wrap;\n }\n .message-row.user .message-text { background: var(--bg-elevated); border-color: var(--border-strong); }\n\n .message-meta {\n font-size: 9px; color: var(--text-tertiary); font-family: var(--font-mono);\n letter-spacing: 0.4px; padding: 0 4px; text-transform: uppercase;\n }\n .message-row.user .message-meta { text-align: right; }\n\n .composer-wrap { padding: 8px 0 10px; flex-shrink: 0; }\n\n .composer {\n display: flex; align-items: flex-end; gap: 10px;\n background: var(--bg-tertiary); border: 1px solid var(--border-subtle);\n border-radius: var(--radius-lg); padding: 10px 12px;\n transition: border-color var(--transition-base), box-shadow var(--transition-base);\n }\n .composer:focus-within {\n border-color: var(--border-strong);\n box-shadow: 0 0 0 3px rgba(255,255,255,0.04);\n }\n\n .composer-input {\n flex: 1; background: transparent; border: none; outline: none;\n color: var(--text-primary); font-size: 13.5px; font-family: var(--font-sans);\n line-height: 1.6; resize: none; min-height: 28px; max-height: 120px; padding: 4px 0;\n }\n .composer-input::placeholder { color: var(--text-tertiary); }\n\n .composer-send {\n width: 32px; height: 32px; border-radius: var(--radius-sm);\n background: var(--accent); border: none; cursor: pointer;\n display: flex; align-items: center; justify-content: center;\n flex-shrink: 0; transition: all var(--transition-fast);\n }\n .composer-send:hover { background: var(--accent-muted); transform: scale(1.04); }\n .composer-send:active { transform: scale(0.95); }\n .composer-send svg { width: 15px; height: 15px; fill: var(--text-inverse); }\n\n .suggestions { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }\n .suggestion-chip {\n padding: 5px 12px; background: transparent; border: 1px solid var(--border-subtle);\n border-radius: var(--radius-full); color: var(--text-secondary);\n font-size: 11px; font-family: var(--font-mono); letter-spacing: 0.3px;\n cursor: pointer; transition: all var(--transition-base); white-space: nowrap;\n }\n .suggestion-chip:hover {\n background: var(--bg-tertiary); border-color: var(--border-strong); color: var(--text-primary);\n }\n\n @media (max-width: 640px) {\n .main { padding: 12px 10px 8px; }\n .message-body { max-width: 85%; }\n .header-inner { padding: 0 12px; }\n .brand-dev { display: none; }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"grid-overlay\"><\/div>\n\n <header class=\"header\">\n <div class=\"header-inner\">\n <div class=\"brand\">\n <div class=\"brand-mark\">AI<\/div>\n <span class=\"brand-name\">ChatGo<\/span>\n <span class=\"brand-dev\">by Air<\/span>\n <\/div>\n <\/div>\n <\/header>\n\n <main class=\"main\">\n <section class=\"conversation\" id=\"conversation\"><\/section>\n\n <section class=\"composer-wrap\">\n <div class=\"composer\">\n <textarea id=\"composerInput\" class=\"composer-input\" placeholder=\"\u8f93\u5165\u6d88\u606f...\" rows=\"1\" maxlength=\"2000\" autofocus><\/textarea>\n <button id=\"sendBtn\" class=\"composer-send\" title=\"\u53d1\u9001\">\n <svg viewBox=\"0 0 24 24\"><path d=\"M2.01 21L23 12 2.01 3 2 10l15 2-15 2z\"\/><\/svg>\n <\/button>\n <\/div>\n <div class=\"suggestions\">\n <button class=\"suggestion-chip\" data-text=\"\u4f60\u597d\">\/ \u4f60\u597d<\/button>\n <button class=\"suggestion-chip\" data-text=\"\u4f60\u662f\u8c01\">\/ \u4f60\u662f\u8c01<\/button>\n <button class=\"suggestion-chip\" data-text=\"\u518d\u89c1\">\/ \u518d\u89c1<\/button>\n <button class=\"suggestion-chip\" data-text=\"\u6e05\u7a7a\">\/ \u6e05\u7a7a<\/button>\n <\/div>\n <\/section>\n <\/main>\n\n <script>\n (function() {\n 'use strict';\n\n const conversation = document.getElementById('conversation');\n const composerInput = document.getElementById('composerInput');\n const sendBtn = document.getElementById('sendBtn');\n const suggestionChips = document.querySelectorAll('.suggestion-chip');\n\n let isTyping = false;\n\n function formatTime() {\n const d = new Date();\n return String(d.getHours()).padStart(2,'0') + ':' + String(d.getMinutes()).padStart(2,'0');\n }\n\n function scrollToBottom(smooth) {\n if (smooth) conversation.scrollTo({ top: conversation.scrollHeight, behavior: 'smooth' });\n else conversation.scrollTop = conversation.scrollHeight;\n }\n\n function adjustTextareaHeight() {\n composerInput.style.height = 'auto';\n composerInput.style.height = Math.min(composerInput.scrollHeight, 120) + 'px';\n }\n\n function createMessageRow(text, isUser) {\n const row = document.createElement('div');\n row.className = 'message-row' + (isUser ? ' user' : '');\n const avatar = document.createElement('div');\n avatar.className = 'message-avatar';\n avatar.textContent = isUser ? 'U' : 'AI';\n const body = document.createElement('div');\n body.className = 'message-body';\n const textEl = document.createElement('div');\n textEl.className = 'message-text';\n textEl.textContent = text;\n const meta = document.createElement('span');\n meta.className = 'message-meta';\n meta.textContent = formatTime();\n body.appendChild(textEl);\n body.appendChild(meta);\n row.appendChild(avatar);\n row.appendChild(body);\n return row;\n }\n\n function addUserMessage(text) {\n conversation.appendChild(createMessageRow(text, true));\n scrollToBottom(true);\n }\n\n function addAIMessage(text) {\n conversation.appendChild(createMessageRow(text, false));\n scrollToBottom(true);\n }\n\n function createTypingRow() {\n const row = document.createElement('div');\n row.className = 'message-row';\n row.id = 'typing-row';\n const avatar = document.createElement('div');\n avatar.className = 'message-avatar';\n avatar.textContent = 'AI';\n const body = document.createElement('div');\n body.className = 'message-body';\n const dots = document.createElement('div');\n dots.className = 'message-text';\n dots.style.display = 'flex';\n dots.style.gap = '5px';\n dots.style.alignItems = 'center';\n dots.style.padding = '16px 14px';\n for (let i = 0; i < 3; i++) {\n const dot = document.createElement('span');\n dot.style.cssText = 'width:5px;height:5px;border-radius:50%;background:#737373;animation:tb 1.2s infinite;';\n if (i === 1) dot.style.animationDelay = '0.15s';\n if (i === 2) dot.style.animationDelay = '0.3s';\n dots.appendChild(dot);\n }\n body.appendChild(dots);\n row.appendChild(avatar);\n row.appendChild(body);\n conversation.appendChild(row);\n scrollToBottom(true);\n }\n\n function removeTypingRow() {\n const row = document.getElementById('typing-row');\n if (row) row.remove();\n }\n\n function generateStaticReply(text) {\n const t = text.trim();\n if (\/\u4f60\u597d|hi|hello|\u55e8\/i.test(t)) return '\u4f60\u597d\uff01\u5f88\u9ad8\u5174\u89c1\u5230\u4f60\u3002';\n if (\/\u4f60\u662f\u8c01|\u4f60\u53eb\u4ec0\u4e48\/i.test(t)) return '\u6211\u662f ChatGo\uff0c\u4e00\u4e2a\u9759\u6001\u804a\u5929\u6f14\u793a\u3002';\n if (\/\u518d\u89c1|bye|\u62dc\u62dc\/i.test(t)) return '\u518d\u89c1\uff01\u4e0b\u6b21\u518d\u804a\u3002';\n if (\/\u8c22\u8c22|\u611f\u8c22\/i.test(t)) return '\u4e0d\u5ba2\u6c14\uff01';\n if (\/\u65f6\u95f4|\u51e0\u70b9\/i.test(t)) return '\u73b0\u5728\u662f ' + new Date().toLocaleTimeString('zh-CN');\n if (\/\u6e05\u7a7a|clear\/i.test(t)) { clearAll(); return null; }\n return '\u4f60\u8bf4\u7684\u662f\uff1a\u300c' + t + '\u300d\u3002\u8fd9\u662f\u4e00\u4e2a\u9759\u6001\u804a\u5929\uff0c\u6ca1\u6709\u63a5\u5165 AI\u3002';\n }\n\n function clearAll() {\n while (conversation.firstChild) {\n conversation.removeChild(conversation.firstChild);\n }\n addAIMessage('\u5bf9\u8bdd\u5df2\u6e05\u7a7a\u3002');\n }\n\n function handleSend() {\n const text = composerInput.value.trim();\n if (!text || isTyping) return;\n\n addUserMessage(text);\n composerInput.value = '';\n adjustTextareaHeight();\n\n if (\/\u6e05\u7a7a|clear\/i.test(text)) {\n setTimeout(clearAll, 300);\n return;\n }\n\n isTyping = true;\n sendBtn.disabled = true;\n createTypingRow();\n\n setTimeout(function() {\n removeTypingRow();\n const reply = generateStaticReply(text);\n if (reply) addAIMessage(reply);\n isTyping = false;\n sendBtn.disabled = false;\n composerInput.focus();\n }, 800 + Math.random() * 600);\n }\n\n sendBtn.addEventListener('click', handleSend);\n\n composerInput.addEventListener('keydown', function(e) {\n if (e.key === 'Enter' && !e.shiftKey) {\n e.preventDefault();\n handleSend();\n }\n });\n\n composerInput.addEventListener('input', adjustTextareaHeight);\n\n suggestionChips.forEach(function(chip) {\n chip.addEventListener('click', function() {\n const text = chip.getAttribute('data-text');\n if (text === '\u6e05\u7a7a') {\n clearAll();\n return;\n }\n composerInput.value = text;\n adjustTextareaHeight();\n composerInput.focus();\n handleSend();\n });\n });\n\n conversation.addEventListener('click', function(e) {\n if (e.target === conversation) composerInput.focus();\n });\n\n \/\/ \u521d\u59cb\u6b22\u8fce\n addAIMessage('\u4f60\u597d\u3002\u6211\u662f ChatGo\uff0c\u7531 Air \u5f00\u53d1\u3002\u8fd9\u662f\u4e00\u4e2a\u9759\u6001\u804a\u5929\u6f14\u793a\uff0c\u8f93\u5165\u6d88\u606f\u5f00\u59cb\u3002');\n composerInput.focus();\n })();\n <\/script>\n<\/body>\n<\/html>\nAir\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>ChatGo – \u9759\u6001\u804a\u5929 AI ChatGo by Air \/ \u4f60\u597d \/ \u4f60\u662f\u8c01 \/ \u518d\u89c1 \/ […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"footnotes":""},"class_list":["post-42","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/canva.xin\/index.php?rest_route=\/wp\/v2\/pages\/42","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/canva.xin\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/canva.xin\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/canva.xin\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/canva.xin\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=42"}],"version-history":[{"count":6,"href":"https:\/\/canva.xin\/index.php?rest_route=\/wp\/v2\/pages\/42\/revisions"}],"predecessor-version":[{"id":49,"href":"https:\/\/canva.xin\/index.php?rest_route=\/wp\/v2\/pages\/42\/revisions\/49"}],"wp:attachment":[{"href":"https:\/\/canva.xin\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=42"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":42,"date":"2026-08-24T17:33:04","date_gmt":"2026-08-24T17:33:04","guid":{"rendered":"https:\/\/canva.xin\/%e7%99%bb%e8%ae%b0\/"},"modified":"2026-08-24T18:18:40","modified_gmt":"2026-08-24T18:18:40","slug":"%e7%99%bb%e8%ae%b0","status":"publish","type":"page","link":"https:\/\/canva.xin\/?page_id=42","title":{"rendered":"\u767b\u8bb0"},"content":{"rendered":"\n\n\n \n \n ChatGo – \u9759\u6001\u804a\u5929<\/title>\n <style>\n :root {\n --bg-primary: #000000;\n --bg-secondary: #0d0d0d;\n --bg-tertiary: #161616;\n --bg-elevated: #1f1f1f;\n --border-subtle: #262626;\n --border-strong: #3a3a3a;\n --text-primary: #f5f5f5;\n --text-secondary: #a8a8a8;\n --text-tertiary: #737373;\n --text-inverse: #0a0a0a;\n --accent: #ffffff;\n --accent-muted: #d4d4d4;\n --radius-sm: 6px;\n --radius-md: 10px;\n --radius-lg: 14px;\n --radius-full: 9999px;\n --transition-fast: 120ms ease;\n --transition-base: 240ms cubic-bezier(0.25, 0.46, 0.45, 0.94);\n --font-mono: 'SF Mono', 'Fira Code', 'JetBrains Mono', 'Consolas', monospace;\n --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif;\n }\n\n * { margin: 0; padding: 0; box-sizing: border-box; }\n\n body {\n font-family: var(--font-sans);\n background: var(--bg-primary);\n color: var(--text-primary);\n height: 100vh;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n -webkit-font-smoothing: antialiased;\n }\n\n .grid-overlay {\n position: fixed;\n inset: 0;\n background-image:\n linear-gradient(rgba(255,255,255,0.015) 1px, transparent 1px),\n linear-gradient(90deg, rgba(255,255,255,0.015) 1px, transparent 1px);\n background-size: 48px 48px;\n pointer-events: none;\n z-index: 0;\n }\n\n .header {\n position: relative;\n z-index: 10;\n height: 56px;\n background: rgba(0,0,0,0.85);\n backdrop-filter: blur(16px);\n border-bottom: 1px solid var(--border-subtle);\n display: flex;\n align-items: center;\n flex-shrink: 0;\n }\n\n .header-inner {\n width: 100%;\n max-width: 900px;\n margin: 0 auto;\n padding: 0 20px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n .brand { display: flex; align-items: center; gap: 10px; user-select: none; }\n\n .brand-mark {\n width: 26px; height: 26px;\n border: 1.5px solid var(--accent);\n border-radius: var(--radius-sm);\n display: flex; align-items: center; justify-content: center;\n font-family: var(--font-mono); font-size: 10px; font-weight: 700;\n color: var(--accent);\n }\n\n .brand-name { font-size: 15px; font-weight: 600; letter-spacing: 0.3px; }\n .brand-dev {\n font-size: 10px;\n color: var(--text-tertiary);\n font-family: var(--font-mono);\n border-left: 1px solid var(--border-subtle);\n padding-left: 12px;\n }\n\n .main {\n position: relative;\n z-index: 1;\n flex: 1;\n max-width: 900px;\n width: 100%;\n margin: 0 auto;\n padding: 16px 20px 12px;\n display: flex;\n flex-direction: column;\n overflow: hidden;\n }\n\n .conversation {\n flex: 1;\n overflow-y: auto;\n padding: 4px 0 8px;\n scrollbar-width: thin;\n scrollbar-color: var(--border-strong) transparent;\n }\n .conversation::-webkit-scrollbar { width: 4px; }\n .conversation::-webkit-scrollbar-track { background: transparent; }\n .conversation::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 2px; }\n\n .message-row {\n display: flex;\n gap: 12px;\n padding: 10px 12px;\n animation: msgIn 0.25s cubic-bezier(0.22,1,0.36,1) both;\n }\n @keyframes msgIn {\n from { opacity: 0; transform: translateY(8px); }\n to { opacity: 1; transform: translateY(0); }\n }\n .message-row.user { flex-direction: row-reverse; }\n\n .message-avatar {\n width: 28px; height: 28px; border-radius: var(--radius-sm);\n flex-shrink: 0; display: flex; align-items: center; justify-content: center;\n font-size: 10px; font-weight: 700; font-family: var(--font-mono);\n border: 1px solid var(--border-subtle); background: var(--bg-tertiary);\n color: var(--text-secondary); user-select: none;\n }\n .message-row.user .message-avatar {\n background: var(--accent); color: var(--text-inverse); border-color: var(--accent);\n }\n\n .message-body { max-width: 78%; display: flex; flex-direction: column; gap: 4px; }\n\n .message-text {\n font-size: 13.5px; line-height: 1.75; color: var(--text-primary);\n padding: 10px 14px; background: var(--bg-tertiary);\n border: 1px solid var(--border-subtle); border-radius: var(--radius-md);\n word-break: break-word; white-space: pre-wrap;\n }\n .message-row.user .message-text { background: var(--bg-elevated); border-color: var(--border-strong); }\n\n .message-meta {\n font-size: 9px; color: var(--text-tertiary); font-family: var(--font-mono);\n letter-spacing: 0.4px; padding: 0 4px; text-transform: uppercase;\n }\n .message-row.user .message-meta { text-align: right; }\n\n .composer-wrap { padding: 8px 0 10px; flex-shrink: 0; }\n\n .composer {\n display: flex; align-items: flex-end; gap: 10px;\n background: var(--bg-tertiary); border: 1px solid var(--border-subtle);\n border-radius: var(--radius-lg); padding: 10px 12px;\n transition: border-color var(--transition-base), box-shadow var(--transition-base);\n }\n .composer:focus-within {\n border-color: var(--border-strong);\n box-shadow: 0 0 0 3px rgba(255,255,255,0.04);\n }\n\n .composer-input {\n flex: 1; background: transparent; border: none; outline: none;\n color: var(--text-primary); font-size: 13.5px; font-family: var(--font-sans);\n line-height: 1.6; resize: none; min-height: 28px; max-height: 120px; padding: 4px 0;\n }\n .composer-input::placeholder { color: var(--text-tertiary); }\n\n .composer-send {\n width: 32px; height: 32px; border-radius: var(--radius-sm);\n background: var(--accent); border: none; cursor: pointer;\n display: flex; align-items: center; justify-content: center;\n flex-shrink: 0; transition: all var(--transition-fast);\n }\n .composer-send:hover { background: var(--accent-muted); transform: scale(1.04); }\n .composer-send:active { transform: scale(0.95); }\n .composer-send svg { width: 15px; height: 15px; fill: var(--text-inverse); }\n\n .suggestions { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }\n .suggestion-chip {\n padding: 5px 12px; background: transparent; border: 1px solid var(--border-subtle);\n border-radius: var(--radius-full); color: var(--text-secondary);\n font-size: 11px; font-family: var(--font-mono); letter-spacing: 0.3px;\n cursor: pointer; transition: all var(--transition-base); white-space: nowrap;\n }\n .suggestion-chip:hover {\n background: var(--bg-tertiary); border-color: var(--border-strong); color: var(--text-primary);\n }\n\n @media (max-width: 640px) {\n .main { padding: 12px 10px 8px; }\n .message-body { max-width: 85%; }\n .header-inner { padding: 0 12px; }\n .brand-dev { display: none; }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"grid-overlay\"><\/div>\n\n <header class=\"header\">\n <div class=\"header-inner\">\n <div class=\"brand\">\n <div class=\"brand-mark\">AI<\/div>\n <span class=\"brand-name\">ChatGo<\/span>\n <span class=\"brand-dev\">by Air<\/span>\n <\/div>\n <\/div>\n <\/header>\n\n <main class=\"main\">\n <section class=\"conversation\" id=\"conversation\"><\/section>\n\n <section class=\"composer-wrap\">\n <div class=\"composer\">\n <textarea id=\"composerInput\" class=\"composer-input\" placeholder=\"\u8f93\u5165\u6d88\u606f...\" rows=\"1\" maxlength=\"2000\" autofocus><\/textarea>\n <button id=\"sendBtn\" class=\"composer-send\" title=\"\u53d1\u9001\">\n <svg viewBox=\"0 0 24 24\"><path d=\"M2.01 21L23 12 2.01 3 2 10l15 2-15 2z\"\/><\/svg>\n <\/button>\n <\/div>\n <div class=\"suggestions\">\n <button class=\"suggestion-chip\" data-text=\"\u4f60\u597d\">\/ \u4f60\u597d<\/button>\n <button class=\"suggestion-chip\" data-text=\"\u4f60\u662f\u8c01\">\/ \u4f60\u662f\u8c01<\/button>\n <button class=\"suggestion-chip\" data-text=\"\u518d\u89c1\">\/ \u518d\u89c1<\/button>\n <button class=\"suggestion-chip\" data-text=\"\u6e05\u7a7a\">\/ \u6e05\u7a7a<\/button>\n <\/div>\n <\/section>\n <\/main>\n\n <script>\n (function() {\n 'use strict';\n\n const conversation = document.getElementById('conversation');\n const composerInput = document.getElementById('composerInput');\n const sendBtn = document.getElementById('sendBtn');\n const suggestionChips = document.querySelectorAll('.suggestion-chip');\n\n let isTyping = false;\n\n function formatTime() {\n const d = new Date();\n return String(d.getHours()).padStart(2,'0') + ':' + String(d.getMinutes()).padStart(2,'0');\n }\n\n function scrollToBottom(smooth) {\n if (smooth) conversation.scrollTo({ top: conversation.scrollHeight, behavior: 'smooth' });\n else conversation.scrollTop = conversation.scrollHeight;\n }\n\n function adjustTextareaHeight() {\n composerInput.style.height = 'auto';\n composerInput.style.height = Math.min(composerInput.scrollHeight, 120) + 'px';\n }\n\n function createMessageRow(text, isUser) {\n const row = document.createElement('div');\n row.className = 'message-row' + (isUser ? ' user' : '');\n const avatar = document.createElement('div');\n avatar.className = 'message-avatar';\n avatar.textContent = isUser ? 'U' : 'AI';\n const body = document.createElement('div');\n body.className = 'message-body';\n const textEl = document.createElement('div');\n textEl.className = 'message-text';\n textEl.textContent = text;\n const meta = document.createElement('span');\n meta.className = 'message-meta';\n meta.textContent = formatTime();\n body.appendChild(textEl);\n body.appendChild(meta);\n row.appendChild(avatar);\n row.appendChild(body);\n return row;\n }\n\n function addUserMessage(text) {\n conversation.appendChild(createMessageRow(text, true));\n scrollToBottom(true);\n }\n\n function addAIMessage(text) {\n conversation.appendChild(createMessageRow(text, false));\n scrollToBottom(true);\n }\n\n function createTypingRow() {\n const row = document.createElement('div');\n row.className = 'message-row';\n row.id = 'typing-row';\n const avatar = document.createElement('div');\n avatar.className = 'message-avatar';\n avatar.textContent = 'AI';\n const body = document.createElement('div');\n body.className = 'message-body';\n const dots = document.createElement('div');\n dots.className = 'message-text';\n dots.style.display = 'flex';\n dots.style.gap = '5px';\n dots.style.alignItems = 'center';\n dots.style.padding = '16px 14px';\n for (let i = 0; i < 3; i++) {\n const dot = document.createElement('span');\n dot.style.cssText = 'width:5px;height:5px;border-radius:50%;background:#737373;animation:tb 1.2s infinite;';\n if (i === 1) dot.style.animationDelay = '0.15s';\n if (i === 2) dot.style.animationDelay = '0.3s';\n dots.appendChild(dot);\n }\n body.appendChild(dots);\n row.appendChild(avatar);\n row.appendChild(body);\n conversation.appendChild(row);\n scrollToBottom(true);\n }\n\n function removeTypingRow() {\n const row = document.getElementById('typing-row');\n if (row) row.remove();\n }\n\n function generateStaticReply(text) {\n const t = text.trim();\n if (\/\u4f60\u597d|hi|hello|\u55e8\/i.test(t)) return '\u4f60\u597d\uff01\u5f88\u9ad8\u5174\u89c1\u5230\u4f60\u3002';\n if (\/\u4f60\u662f\u8c01|\u4f60\u53eb\u4ec0\u4e48\/i.test(t)) return '\u6211\u662f ChatGo\uff0c\u4e00\u4e2a\u9759\u6001\u804a\u5929\u6f14\u793a\u3002';\n if (\/\u518d\u89c1|bye|\u62dc\u62dc\/i.test(t)) return '\u518d\u89c1\uff01\u4e0b\u6b21\u518d\u804a\u3002';\n if (\/\u8c22\u8c22|\u611f\u8c22\/i.test(t)) return '\u4e0d\u5ba2\u6c14\uff01';\n if (\/\u65f6\u95f4|\u51e0\u70b9\/i.test(t)) return '\u73b0\u5728\u662f ' + new Date().toLocaleTimeString('zh-CN');\n if (\/\u6e05\u7a7a|clear\/i.test(t)) { clearAll(); return null; }\n return '\u4f60\u8bf4\u7684\u662f\uff1a\u300c' + t + '\u300d\u3002\u8fd9\u662f\u4e00\u4e2a\u9759\u6001\u804a\u5929\uff0c\u6ca1\u6709\u63a5\u5165 AI\u3002';\n }\n\n function clearAll() {\n while (conversation.firstChild) {\n conversation.removeChild(conversation.firstChild);\n }\n addAIMessage('\u5bf9\u8bdd\u5df2\u6e05\u7a7a\u3002');\n }\n\n function handleSend() {\n const text = composerInput.value.trim();\n if (!text || isTyping) return;\n\n addUserMessage(text);\n composerInput.value = '';\n adjustTextareaHeight();\n\n if (\/\u6e05\u7a7a|clear\/i.test(text)) {\n setTimeout(clearAll, 300);\n return;\n }\n\n isTyping = true;\n sendBtn.disabled = true;\n createTypingRow();\n\n setTimeout(function() {\n removeTypingRow();\n const reply = generateStaticReply(text);\n if (reply) addAIMessage(reply);\n isTyping = false;\n sendBtn.disabled = false;\n composerInput.focus();\n }, 800 + Math.random() * 600);\n }\n\n sendBtn.addEventListener('click', handleSend);\n\n composerInput.addEventListener('keydown', function(e) {\n if (e.key === 'Enter' && !e.shiftKey) {\n e.preventDefault();\n handleSend();\n }\n });\n\n composerInput.addEventListener('input', adjustTextareaHeight);\n\n suggestionChips.forEach(function(chip) {\n chip.addEventListener('click', function() {\n const text = chip.getAttribute('data-text');\n if (text === '\u6e05\u7a7a') {\n clearAll();\n return;\n }\n composerInput.value = text;\n adjustTextareaHeight();\n composerInput.focus();\n handleSend();\n });\n });\n\n conversation.addEventListener('click', function(e) {\n if (e.target === conversation) composerInput.focus();\n });\n\n \/\/ \u521d\u59cb\u6b22\u8fce\n addAIMessage('\u4f60\u597d\u3002\u6211\u662f ChatGo\uff0c\u7531 Air \u5f00\u53d1\u3002\u8fd9\u662f\u4e00\u4e2a\u9759\u6001\u804a\u5929\u6f14\u793a\uff0c\u8f93\u5165\u6d88\u606f\u5f00\u59cb\u3002');\n composerInput.focus();\n })();\n <\/script>\n<\/body>\n<\/html>\nAir\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>ChatGo – \u9759\u6001\u804a\u5929 AI ChatGo by Air \/ \u4f60\u597d \/ \u4f60\u662f\u8c01 \/ \u518d\u89c1 \/ […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"footnotes":""},"class_list":["post-42","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/canva.xin\/index.php?rest_route=\/wp\/v2\/pages\/42","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/canva.xin\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/canva.xin\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/canva.xin\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/canva.xin\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=42"}],"version-history":[{"count":6,"href":"https:\/\/canva.xin\/index.php?rest_route=\/wp\/v2\/pages\/42\/revisions"}],"predecessor-version":[{"id":49,"href":"https:\/\/canva.xin\/index.php?rest_route=\/wp\/v2\/pages\/42\/revisions\/49"}],"wp:attachment":[{"href":"https:\/\/canva.xin\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=42"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}