\u8292\u79cd \u00b7 \u6536\u83b7\u4e0e\u64ad\u79cd\u7684\u65f6\u8282<\/title>\n<style>\n *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }\n \n :root {\n --gold: #ca8a04;\n --gold-light: #fbbf24;\n --gold-pale: #fef3c7;\n --gold-dark: #a16207;\n --brown: #422006;\n --brown-light: #78350f;\n --cream: #fffbeb;\n --text: #1c1917;\n --text-light: #57534e;\n --bg-hex: #292524;\n }\n\n body {\n font-family: 'Noto Serif SC', 'Songti SC', 'STSong', Georgia, serif;\n color: var(--text);\n background: var(--bg-hex);\n min-height: 100vh;\n overflow-x: hidden;\n }\n\n \/* ===== ANIMATED WHEAT BACKGROUND ===== *\/\n #wheat-canvas {\n position: fixed;\n top: 0; left: 0;\n width: 100vw; height: 100vh;\n z-index: 0;\n pointer-events: none;\n }\n\n \/* ===== LAYOUT ===== *\/\n .wrapper {\n position: relative;\n z-index: 1;\n max-width: 1000px;\n margin: 0 auto;\n padding: 40px 20px 80px;\n }\n\n \/* ===== HERO ===== *\/\n .hero {\n text-align: center;\n padding: 80px 20px 60px;\n position: relative;\n }\n .hero::after {\n content: '';\n position: absolute;\n bottom: 0; left: 10%;\n width: 80%; height: 1px;\n background: linear-gradient(90deg, transparent, var(--gold), transparent);\n }\n .hero-icon { font-size: 64px; display: block; margin-bottom: 16px; }\n .hero h1 {\n font-size: clamp(3rem, 8vw, 5rem);\n color: var(--gold-light);\n text-shadow: 0 0 40px rgba(202,138,4,0.3), 0 2px 4px rgba(0,0,0,0.5);\n letter-spacing: 0.2em;\n }\n .hero .subtitle {\n font-size: clamp(1rem, 2.5vw, 1.3rem);\n color: var(--gold);\n margin-top: 12px;\n letter-spacing: 0.3em;\n }\n .hero .date-badge {\n display: inline-block;\n margin-top: 20px;\n padding: 6px 28px;\n background: linear-gradient(135deg, rgba(202,138,4,0.2), rgba(66,32,6,0.4));\n border: 1px solid rgba(202,138,4,0.4);\n border-radius: 20px;\n color: var(--gold-pale);\n font-size: 0.9rem;\n letter-spacing: 0.15em;\n }\n\n \/* ===== SECTION ===== *\/\n section {\n margin: 60px 0;\n padding: 40px 36px;\n background: rgba(255,251,235,0.92);\n backdrop-filter: blur(12px);\n border-radius: 20px;\n border: 1px solid rgba(202,138,4,0.25);\n box-shadow: 0 8px 32px rgba(0,0,0,0.3), 0 0 0 1px rgba(202,138,4,0.1) inset;\n transition: transform 0.3s ease;\n }\n section:hover { transform: translateY(-2px); }\n\n .section-title {\n display: flex; align-items: center; gap: 12px;\n font-size: 1.6rem;\n color: var(--brown);\n margin-bottom: 28px;\n padding-bottom: 14px;\n border-bottom: 2px solid var(--gold);\n }\n .section-title .emoji { font-size: 1.5rem; }\n\n \/* ===== MEANING GRID ===== *\/\n .meaning-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 20px;\n margin-top: 10px;\n }\n .meaning-card {\n padding: 24px 18px;\n background: linear-gradient(135deg, rgba(202,138,4,0.08), rgba(66,32,6,0.05));\n border-radius: 14px;\n border: 1px solid rgba(202,138,4,0.2);\n text-align: center;\n }\n .meaning-card .icon { font-size: 32px; display: block; margin-bottom: 8px; }\n .meaning-card .label {\n font-size: 0.85rem;\n color: var(--gold-dark);\n letter-spacing: 0.1em;\n margin-bottom: 4px;\n }\n .meaning-card .value {\n font-size: 1.15rem;\n color: var(--brown);\n font-weight: 600;\n }\n\n \/* ===== \u4e09\u5019 TIMELINE ===== *\/\n .hou-timeline {\n display: flex;\n justify-content: center;\n gap: 0;\n margin-top: 16px;\n }\n .hou-step {\n flex: 1;\n text-align: center;\n position: relative;\n padding: 24px 12px;\n }\n .hou-step:not(:last-child)::after {\n content: '\u2192';\n position: absolute;\n right: -12px;\n top: 50%; transform: translateY(-50%);\n font-size: 1.5rem;\n color: var(--gold);\n }\n .hou-step .day {\n display: inline-flex;\n align-items: center; justify-content: center;\n width: 48px; height: 48px;\n border-radius: 50%;\n background: linear-gradient(135deg, var(--gold), var(--gold-dark));\n color: #fff;\n font-size: 1rem;\n font-weight: 700;\n margin: 0 auto 10px;\n }\n .hou-step .phenomenon { font-size: 1.3rem; display: block; margin-bottom: 4px; }\n .hou-step .desc { font-size: 0.85rem; color: var(--text-light); }\n\n \/* ===== CUSTOMS GRID ===== *\/\n .customs-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));\n gap: 14px;\n margin-top: 10px;\n }\n .custom-card {\n padding: 20px 12px;\n text-align: center;\n background: linear-gradient(135deg, #fff, rgba(202,138,4,0.04));\n border-radius: 14px;\n border: 1px solid rgba(202,138,4,0.15);\n transition: all 0.25s ease;\n }\n .custom-card:hover {\n background: linear-gradient(135deg, var(--gold-pale), #fff);\n border-color: var(--gold);\n transform: translateY(-4px);\n box-shadow: 0 8px 20px rgba(202,138,4,0.15);\n }\n .custom-card .icon { font-size: 30px; display: block; margin-bottom: 6px; }\n .custom-card .name { font-size: 0.95rem; color: var(--brown); font-weight: 600; }\n .custom-card .brief {\n font-size: 0.75rem;\n color: var(--text-light);\n margin-top: 4px;\n line-height: 1.4;\n }\n\n \/* ===== FOOD GRID ===== *\/\n .food-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));\n gap: 16px;\n margin-top: 10px;\n }\n .food-card {\n padding: 22px 12px;\n text-align: center;\n border-radius: 50% 50% 40% 40% \/ 60% 60% 30% 30%;\n background: linear-gradient(180deg, rgba(202,138,4,0.08), rgba(251,191,36,0.04));\n border: 1px solid rgba(202,138,4,0.12);\n transition: all 0.25s ease;\n }\n .food-card:hover {\n background: linear-gradient(180deg, rgba(202,138,4,0.2), rgba(251,191,36,0.1));\n border-color: var(--gold);\n transform: translateY(-3px);\n }\n .food-card .icon { font-size: 32px; display: block; margin-bottom: 6px; }\n .food-card .name { font-size: 1rem; color: var(--brown); font-weight: 600; }\n .food-card .note {\n font-size: 0.7rem;\n color: var(--gold-dark);\n margin-top: 4px;\n }\n\n \/* ===== PROVERBS & POEM ===== *\/\n .proverb-list { margin-top: 10px; }\n .proverb-item {\n padding: 14px 20px;\n border-left: 3px solid var(--gold);\n margin-bottom: 12px;\n background: rgba(202,138,4,0.04);\n border-radius: 0 10px 10px 0;\n }\n .proverb-item .line { font-size: 1rem; color: var(--brown); }\n .proverb-item .meaning {\n font-size: 0.8rem;\n color: var(--text-light);\n margin-top: 4px;\n }\n\n .poem-box {\n margin-top: 24px;\n padding: 28px 24px;\n background: linear-gradient(135deg, rgba(66,32,6,0.03), rgba(202,138,4,0.06));\n border-radius: 16px;\n border: 1px solid rgba(202,138,4,0.15);\n }\n .poem-box .poem-title {\n font-size: 1.1rem;\n color: var(--brown);\n font-weight: 600;\n margin-bottom: 4px;\n }\n .poem-box .poem-author {\n font-size: 0.8rem;\n color: var(--gold-dark);\n margin-bottom: 14px;\n }\n .poem-box .poem-text {\n font-size: 1rem;\n line-height: 2;\n color: var(--text);\n white-space: pre-line;\n }\n\n \/* ===== FOOTER ===== *\/\n .footer {\n text-align: center;\n margin-top: 60px;\n padding: 30px 0 10px;\n color: rgba(202,138,4,0.4);\n font-size: 0.8rem;\n position: relative;\n }\n .footer::before {\n content: '';\n position: absolute;\n top: 0; left: 20%;\n width: 60%; height: 1px;\n background: linear-gradient(90deg, transparent, rgba(202,138,4,0.3), transparent);\n }\n\n \/* ===== RESPONSIVE ===== *\/\n @media (max-width: 640px) {\n .wrapper { padding: 20px 12px 60px; }\n section { padding: 28px 18px; margin: 40px 0; }\n .meaning-grid { grid-template-columns: repeat(2, 1fr); }\n .customs-grid { grid-template-columns: repeat(3, 1fr); }\n .food-grid { grid-template-columns: repeat(2, 1fr); }\n .hou-timeline { flex-direction: column; gap: 0; }\n .hou-step:not(:last-child)::after {\n content: '\u2193';\n right: auto;\n bottom: -4px;\n top: auto;\n left: 50%; transform: translateX(-50%);\n }\n .hero { padding: 50px 16px 40px; }\n .section-title { font-size: 1.3rem; }\n }\n<\/style>\n<\/head>\n<body>\n\n\n<canvas id=\"wheat-canvas\"><\/canvas>\n\n<div class=\"wrapper\">\n\n \n <header class=\"hero\">\n <span class=\"hero-icon\">\ud83c\udf3e<\/span>\n <h1>\u8292 \u79cd<\/h1>\n <p class=\"subtitle\">Grain in Ear \u00b7 \u6536\u83b7\u4e0e\u64ad\u79cd\u5e76\u884c<\/p>\n <span class=\"date-badge\">\ud83d\udcc5 6\u67085\u65e5 \u4e8c\u5341\u56db\u8282\u6c14\u00b7\u7b2c9\u4e2a<\/span>\n <\/header>\n\n \n <section>\n <h2 class=\"section-title\"><span class=\"emoji\">\ud83c\udf3e<\/span> \u8292\u79cd\u542b\u4e49<\/h2>\n <div class=\"meaning-grid\">\n <div class=\"meaning-card\">\n <span class=\"icon\">\ud83c\udf3e<\/span>\n <div class=\"label\">\u8292 \u00b7 \u6709\u8292\u4f5c\u7269<\/div>\n <div class=\"value\">\u6536\u9ea6<\/div>\n <\/div>\n <div class=\"meaning-card\">\n <span class=\"icon\">\ud83c\udf31<\/span>\n <div class=\"label\">\u79cd \u00b7 \u64ad\u79cd<\/div>\n <div class=\"value\">\u79cd\u7a3b<\/div>\n <\/div>\n <div class=\"meaning-card\">\n <span class=\"icon\">\ud83d\udc68\u200d\ud83c\udf3e<\/span>\n <div class=\"label\">\u519c\u5fd9\u65f6\u8282<\/div>\n <div class=\"value\">\u62a2\u6536\u62a2\u79cd<\/div>\n <\/div>\n <div class=\"meaning-card\">\n <span class=\"icon\">\u2600\ufe0f<\/span>\n <div class=\"label\">\u6c14\u5019\u7279\u5f81<\/div>\n <div class=\"value\">\u9ad8\u6e29\u591a\u96e8<\/div>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section>\n <h2 class=\"section-title\"><span class=\"emoji\">\ud83e\udd97<\/span> \u8292\u79cd\u4e09\u5019<\/h2>\n <div class=\"hou-timeline\">\n <div class=\"hou-step\">\n <div class=\"day\">\u521d\u5019<\/div>\n <span class=\"phenomenon\">\ud83e\udd97 \u87b3\u8782\u751f<\/span>\n <p class=\"desc\">\u5c0f\u87b3\u8782\u7834\u5375\u800c\u51fa<\/p>\n <\/div>\n <div class=\"hou-step\">\n <div class=\"day\">\u4e8c\u5019<\/div>\n <span class=\"phenomenon\">\ud83d\udc26 \u9d59\u59cb\u9e23<\/span>\n <p class=\"desc\">\u4f2f\u52b3\u9e1f\u5f00\u59cb\u9e23\u53eb<\/p>\n <\/div>\n <div class=\"hou-step\">\n <div class=\"day\">\u4e09\u5019<\/div>\n <span class=\"phenomenon\">\ud83d\udd07 \u53cd\u820c\u65e0\u58f0<\/span>\n <p class=\"desc\">\u53cd\u820c\u9e1f\u505c\u6b62\u53d1\u58f0<\/p>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section>\n <h2 class=\"section-title\"><span class=\"emoji\">\ud83c\udf8e<\/span> \u8292\u79cd\u516d\u4fd7<\/h2>\n <div class=\"customs-grid\">\n <div class=\"custom-card\">\n <span class=\"icon\">\ud83c\udf38<\/span>\n <div class=\"name\">\u9001\u82b1\u795e<\/div>\n <p class=\"brief\">\u996f\u9001\u82b1\u795e\u5f52\u4f4d<br>\u611f\u6069\u82b1\u5f00<\/p>\n <\/div>\n <div class=\"custom-card\">\n <span class=\"icon\">\ud83c\udf75<\/span>\n <div class=\"name\">\u716e\u6885<\/div>\n <p class=\"brief\">\u9752\u6885\u716e\u9152<br>\u9178\u751c\u751f\u6d25<\/p>\n <\/div>\n <div class=\"custom-card\">\n <span class=\"icon\">\ud83c\udf31<\/span>\n <div class=\"name\">\u5b89\u82d7<\/div>\n <p class=\"brief\">\u6c34\u7a3b\u63d2\u79e7<br>\u7948\u6c42\u4e30\u6536<\/p>\n <\/div>\n <div class=\"custom-card\">\n <span class=\"icon\">\ud83d\udca6<\/span>\n <div class=\"name\">\u6253\u6ce5\u5df4\u4ed7<\/div>\n <p class=\"brief\">\u8d35\u5dde\u4f97\u65cf<br>\u4e92\u6254\u6ce5\u5df4<\/p>\n <\/div>\n <div class=\"custom-card\">\n <span class=\"icon\">\ud83c\udf3f<\/span>\n <div class=\"name\">\u6302\u827e\u8349<\/div>\n <p class=\"brief\">\u9a71\u868a\u8f9f\u90aa<br>\u51c0\u5316\u7a7a\u6c14<\/p>\n <\/div>\n <div class=\"custom-card\">\n <span class=\"icon\">\ud83d\udc55<\/span>\n <div class=\"name\">\u6652\u8863\u9632\u9709<\/div>\n <p class=\"brief\">\u66dd\u6652\u8863\u7269<br\">\u9632\u6f6e\u9632\u9709<\/p>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section>\n <h2 class=\"section-title\"><span class=\"emoji\">\ud83c\udf7d\ufe0f<\/span> \u8292\u79cd\u516d\u98df<\/h2>\n <div class=\"food-grid\">\n <div class=\"food-card\">\n <span class=\"icon\">\ud83e\udd64<\/span>\n <div class=\"name\">\u9178\u6885\u6c64<\/div>\n <p class=\"note\">\u6d88\u6691\u89e3\u6e34<\/p>\n <\/div>\n <div class=\"food-card\">\n <span class=\"icon\">\ud83e\udd52<\/span>\n <div class=\"name\">\u82e6\u74dc<\/div>\n <p class=\"note\">\u6e05\u70ed\u53bb\u706b<\/p>\n <\/div>\n <div class=\"food-card\">\n <span class=\"icon\">\ud83e\udd6c<\/span>\n <div class=\"name\">\u4e1d\u74dc<\/div>\n <p class=\"note\">\u5229\u6c34\u901a\u7edc<\/p>\n <\/div>\n <div class=\"food-card\">\n <span class=\"icon\">\ud83c\udf52<\/span>\n <div class=\"name\">\u6768\u6885<\/div>\n <p class=\"note\">\u751f\u6d25\u6b62\u6e34<\/p>\n <\/div>\n <div class=\"food-card\">\n <span class=\"icon\">\ud83c\udf3d<\/span>\n <div class=\"name\">\u9c9c\u7389\u7c73<\/div>\n <p class=\"note\">\u5065\u813e\u5f00\u80c3<\/p>\n <\/div>\n <div class=\"food-card\">\n <span class=\"icon\">\ud83c\udf75<\/span>\n <div class=\"name\">\u7eff\u8336<\/div>\n <p class=\"note\">\u63d0\u795e\u9192\u8111<\/p>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section>\n <h2 class=\"section-title\"><span class=\"emoji\">\ud83d\udcdc<\/span> \u519c\u8c1a\u4e0e\u8bd7<\/h2>\n\n <div class=\"proverb-list\">\n <div class=\"proverb-item\">\n <p class=\"line\">\ud83c\udf3e \u8292\u79cd\u4e0d\u79cd\uff0c\u518d\u79cd\u65e0\u7528<\/p>\n <p class=\"meaning\">\u8292\u79cd\u65f6\u8282\u5fc5\u987b\u5b8c\u6210\u64ad\u79cd\uff0c\u9519\u8fc7\u519c\u65f6\u5c31\u767d\u8d39\u4e86<\/p>\n <\/div>\n <div class=\"proverb-item\">\n <p class=\"line\">\ud83c\udf3e \u8292\u79cd\u5fd9\uff0c\u4e09\u4e24\u573a<\/p>\n <p class=\"meaning\">\u8292\u79cd\u65f6\u8282\u519c\u6d3b\u7d27\u8feb\uff0c\u6253\u573a\u6536\u9ea6\u8981\u62a2\u65f6\u95f4<\/p>\n <\/div>\n <div class=\"proverb-item\">\n <p class=\"line\">\ud83c\udf3e \u8292\u79cd\u683d\u85af\u91cd\u5341\u65a4\uff0c\u590f\u81f3\u683d\u85af\u5149\u6839\u6839<\/p>\n <p class=\"meaning\">\u8292\u79cd\u683d\u79cd\u7ea2\u85af\u4ea7\u91cf\u9ad8\uff0c\u518d\u665a\u5c31\u53ea\u957f\u6839\u4e86<\/p>\n <\/div>\n <div class=\"proverb-item\">\n <p class=\"line\">\ud83c\udf3e \u9ea6\u6536\u5982\u6551\u706b\uff0c\u9ea6\u6253\u5982\u9f99\u53e3\u593a\u98df<\/p>\n <p class=\"meaning\">\u6536\u9ea6\u8981\u62a2\u65f6\u95f4\uff0c\u50cf\u6551\u706b\u4e00\u6837\u7d27\u8feb<\/p>\n <\/div>\n <\/div>\n\n <div class=\"poem-box\">\n <p class=\"poem-title\">\u300a\u65f6\u96e8\u300b<\/p>\n <p class=\"poem-author\">\u2014\u2014 \u5b8b \u00b7 \u9646\u6e38<\/p>\n <p class=\"poem-text\">\u65f6\u96e8\u53ca\u8292\u79cd\uff0c\u56db\u91ce\u7686\u63d2\u79e7\u3002<br>\n\u5bb6\u5bb6\u9ea6\u996d\u7f8e\uff0c\u5904\u5904\u83f1\u6b4c\u957f\u3002<\/p>\n <\/div>\n <\/section>\n\n \n <footer class=\"footer\">\n \ud83c\udf3e \u8292\u79cd \u00b7 \u6536\u83b7\u4e0e\u64ad\u79cd\u7684\u65f6\u8282 \ud83c\udf3e\n <\/footer>\n\n<\/div>\n\n<script>\n\/\/ ===== Animated Wheat Background =====\nconst canvas = document.getElementById('wheat-canvas');\nconst ctx = canvas.getContext('2d');\nlet W, H, stalks = [];\n\nfunction resize() {\n W = canvas.width = window.innerWidth;\n H = canvas.height = window.innerHeight;\n}\n\nclass Stalk {\n constructor() { this.reset(); }\n reset() {\n this.x = Math.random() * W;\n this.y = H + 20 + Math.random() * 40;\n this.baseX = this.x;\n this.length = 100 + Math.random() * 160;\n this.angle = -Math.PI \/ 2 + (Math.random() - 0.5) * 0.3;\n this.curl = (Math.random() - 0.5) * 0.02;\n this.sway = 0.003 + Math.random() * 0.005;\n this.phase = Math.random() * Math.PI * 2;\n this.speed = 0.4 + Math.random() * 0.4;\n this.segments = 8 + Math.floor(Math.random() * 6);\n this.hasHead = Math.random() > 0.2;\n this.headSize = 6 + Math.random() * 8;\n this.headBend = (Math.random() - 0.5) * 0.4;\n this.alpha = 0.15 + Math.random() * 0.25;\n \/\/ Color: golden gradient\n this.hue = 38 + Math.random() * 15; \/\/ 38-53\n this.sat = 60 + Math.random() * 20;\n }\n draw(t) {\n const swayAmt = Math.sin(t * this.speed + this.phase) * 0.4;\n let segLen = this.length \/ this.segments;\n\n \/\/ Draw stem\n ctx.beginPath();\n let px = this.baseX + swayAmt * 0.3;\n let py = this.y;\n ctx.moveTo(px, py);\n\n for (let i = 1; i <= this.segments; i++) {\n let progress = i \/ this.segments;\n let bend = this.angle + progress * this.curl + swayAmt * (1 - progress);\n px += Math.cos(bend + swayAmt * Math.sin(progress * 3)) * segLen;\n py += Math.sin(bend + swayAmt * progress) * segLen * (this.y < H\/2 ? -1 : -1);\n ctx.lineTo(px, py);\n }\n\n ctx.strokeStyle = `hsla(${this.hue}, ${this.sat}%, ${50 + 20 * (1 - this.segments \/ 14)}%, ${this.alpha * 0.7})`;\n ctx.lineWidth = 1.2;\n ctx.stroke();\n\n \/\/ Draw wheat head (grain cluster)\n if (this.hasHead) {\n let headX = px;\n let headY = py;\n let headAngle = this.angle + this.curl + swayAmt * 0.5 + this.headBend;\n let headLen = this.headSize * 2.5;\n\n ctx.save();\n ctx.translate(headX, headY);\n ctx.rotate(headAngle + 0.2);\n\n \/\/ Draw grains (small ovals along the head)\n const grains = 4 + Math.floor(this.headSize * 0.6);\n for (let g = 0; g < grains; g++) {\n let gp = g \/ grains;\n let gx = gp * headLen;\n let gy = Math.sin(gp * Math.PI * 2) * 3;\n ctx.beginPath();\n ctx.ellipse(gx, gy, 3, 1.5, gp * 0.5, 0, Math.PI * 2);\n ctx.fillStyle = `hsla(${this.hue - 5}, ${this.sat + 10}%, ${65 - gp * 15}%, ${this.alpha + 0.15})`;\n ctx.fill();\n }\n\n \/\/ Awns (whiskers)\n ctx.strokeStyle = `hsla(${this.hue + 5}, ${this.sat}%, 70%, ${this.alpha * 0.5})`;\n ctx.lineWidth = 0.5;\n for (let a = 0; a < 3; a++) {\n let ap = 0.2 + a * 0.3;\n let ax = ap * headLen;\n ctx.beginPath();\n ctx.moveTo(ax, -2);\n ctx.lineTo(ax + 6, -8 + Math.sin(a) * 2);\n ctx.stroke();\n }\n\n ctx.restore();\n }\n }\n}\n\nfunction initStalks() {\n stalks = [];\n const count = Math.floor(W * 0.12);\n for (let i = 0; i < count; i++) {\n stalks.push(new Stalk());\n }\n}\n\nlet time = 0;\nfunction animate() {\n time += 0.016;\n ctx.clearRect(0, 0, W, H);\n ctx.globalCompositeOperation = 'source-over';\n\n stalks.forEach(s => s.draw(time));\n\n \/\/ Subtle ground gradient\n const grad = ctx.createLinearGradient(0, H, 0, H - 60);\n grad.addColorStop(0, 'rgba(202,138,4,0.03)');\n grad.addColorStop(1, 'transparent');\n ctx.fillStyle = grad;\n ctx.fillRect(0, H - 60, W, 60);\n\n requestAnimationFrame(animate);\n}\n\nwindow.addEventListener('resize', () => { resize(); initStalks(); });\nresize();\ninitStalks();\nanimate();\n<\/script>\n\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"\u8292\u79cd \u00b7 \u6536\u83b7\u4e0e\u64ad\u79cd\u7684\u65f6\u8282 \ud83c\udf3e \u8292 \u79cd Grain in Ear \u00b7 \u6536\u83b7\u4e0e\u64ad\u79cd\u5e76\u884c \ud83d\udcc5 6\u67085\u65e5 \u4e8c\u5341\u56db\u8282\u6c14 […]","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"wp-custom-template-2","format":"standard","meta":{"footnotes":""},"categories":[7],"tags":[],"class_list":["post-1992","post","type-post","status-publish","format-standard","hentry","category-qushi"],"_links":{"self":[{"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/posts\/1992","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/comments?post=1992"}],"version-history":[{"count":1,"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/posts\/1992\/revisions"}],"predecessor-version":[{"id":1995,"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/posts\/1992\/revisions\/1995"}],"wp:attachment":[{"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/media?parent=1992"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/categories?post=1992"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/tags?post=1992"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":1992,"date":"2026-06-05T02:25:49","date_gmt":"2026-06-04T18:25:49","guid":{"rendered":"https:\/\/www.365ycs.com\/index.php\/2026\/06\/05\/%e8%8a%92%e7%a7%8d-%e6%94%b6%e8%8e%b7%e4%b8%8e%e6%92%ad%e7%a7%8d%e7%9a%84%e6%97%b6%e8%8a%82\/"},"modified":"2026-06-17T17:36:12","modified_gmt":"2026-06-17T09:36:12","slug":"%e8%8a%92%e7%a7%8d-%e6%94%b6%e8%8e%b7%e4%b8%8e%e6%92%ad%e7%a7%8d%e7%9a%84%e6%97%b6%e8%8a%82","status":"publish","type":"post","link":"https:\/\/www.365ycs.com\/index.php\/2026\/06\/05\/%e8%8a%92%e7%a7%8d-%e6%94%b6%e8%8e%b7%e4%b8%8e%e6%92%ad%e7%a7%8d%e7%9a%84%e6%97%b6%e8%8a%82\/","title":{"rendered":"\u8292\u79cd \u2014 \u6536\u83b7\u4e0e\u64ad\u79cd\u7684\u65f6\u8282"},"content":{"rendered":"\n\n\n\n\n\n\u8292\u79cd \u00b7 \u6536\u83b7\u4e0e\u64ad\u79cd\u7684\u65f6\u8282<\/title>\n<style>\n *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }\n \n :root {\n --gold: #ca8a04;\n --gold-light: #fbbf24;\n --gold-pale: #fef3c7;\n --gold-dark: #a16207;\n --brown: #422006;\n --brown-light: #78350f;\n --cream: #fffbeb;\n --text: #1c1917;\n --text-light: #57534e;\n --bg-hex: #292524;\n }\n\n body {\n font-family: 'Noto Serif SC', 'Songti SC', 'STSong', Georgia, serif;\n color: var(--text);\n background: var(--bg-hex);\n min-height: 100vh;\n overflow-x: hidden;\n }\n\n \/* ===== ANIMATED WHEAT BACKGROUND ===== *\/\n #wheat-canvas {\n position: fixed;\n top: 0; left: 0;\n width: 100vw; height: 100vh;\n z-index: 0;\n pointer-events: none;\n }\n\n \/* ===== LAYOUT ===== *\/\n .wrapper {\n position: relative;\n z-index: 1;\n max-width: 1000px;\n margin: 0 auto;\n padding: 40px 20px 80px;\n }\n\n \/* ===== HERO ===== *\/\n .hero {\n text-align: center;\n padding: 80px 20px 60px;\n position: relative;\n }\n .hero::after {\n content: '';\n position: absolute;\n bottom: 0; left: 10%;\n width: 80%; height: 1px;\n background: linear-gradient(90deg, transparent, var(--gold), transparent);\n }\n .hero-icon { font-size: 64px; display: block; margin-bottom: 16px; }\n .hero h1 {\n font-size: clamp(3rem, 8vw, 5rem);\n color: var(--gold-light);\n text-shadow: 0 0 40px rgba(202,138,4,0.3), 0 2px 4px rgba(0,0,0,0.5);\n letter-spacing: 0.2em;\n }\n .hero .subtitle {\n font-size: clamp(1rem, 2.5vw, 1.3rem);\n color: var(--gold);\n margin-top: 12px;\n letter-spacing: 0.3em;\n }\n .hero .date-badge {\n display: inline-block;\n margin-top: 20px;\n padding: 6px 28px;\n background: linear-gradient(135deg, rgba(202,138,4,0.2), rgba(66,32,6,0.4));\n border: 1px solid rgba(202,138,4,0.4);\n border-radius: 20px;\n color: var(--gold-pale);\n font-size: 0.9rem;\n letter-spacing: 0.15em;\n }\n\n \/* ===== SECTION ===== *\/\n section {\n margin: 60px 0;\n padding: 40px 36px;\n background: rgba(255,251,235,0.92);\n backdrop-filter: blur(12px);\n border-radius: 20px;\n border: 1px solid rgba(202,138,4,0.25);\n box-shadow: 0 8px 32px rgba(0,0,0,0.3), 0 0 0 1px rgba(202,138,4,0.1) inset;\n transition: transform 0.3s ease;\n }\n section:hover { transform: translateY(-2px); }\n\n .section-title {\n display: flex; align-items: center; gap: 12px;\n font-size: 1.6rem;\n color: var(--brown);\n margin-bottom: 28px;\n padding-bottom: 14px;\n border-bottom: 2px solid var(--gold);\n }\n .section-title .emoji { font-size: 1.5rem; }\n\n \/* ===== MEANING GRID ===== *\/\n .meaning-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 20px;\n margin-top: 10px;\n }\n .meaning-card {\n padding: 24px 18px;\n background: linear-gradient(135deg, rgba(202,138,4,0.08), rgba(66,32,6,0.05));\n border-radius: 14px;\n border: 1px solid rgba(202,138,4,0.2);\n text-align: center;\n }\n .meaning-card .icon { font-size: 32px; display: block; margin-bottom: 8px; }\n .meaning-card .label {\n font-size: 0.85rem;\n color: var(--gold-dark);\n letter-spacing: 0.1em;\n margin-bottom: 4px;\n }\n .meaning-card .value {\n font-size: 1.15rem;\n color: var(--brown);\n font-weight: 600;\n }\n\n \/* ===== \u4e09\u5019 TIMELINE ===== *\/\n .hou-timeline {\n display: flex;\n justify-content: center;\n gap: 0;\n margin-top: 16px;\n }\n .hou-step {\n flex: 1;\n text-align: center;\n position: relative;\n padding: 24px 12px;\n }\n .hou-step:not(:last-child)::after {\n content: '\u2192';\n position: absolute;\n right: -12px;\n top: 50%; transform: translateY(-50%);\n font-size: 1.5rem;\n color: var(--gold);\n }\n .hou-step .day {\n display: inline-flex;\n align-items: center; justify-content: center;\n width: 48px; height: 48px;\n border-radius: 50%;\n background: linear-gradient(135deg, var(--gold), var(--gold-dark));\n color: #fff;\n font-size: 1rem;\n font-weight: 700;\n margin: 0 auto 10px;\n }\n .hou-step .phenomenon { font-size: 1.3rem; display: block; margin-bottom: 4px; }\n .hou-step .desc { font-size: 0.85rem; color: var(--text-light); }\n\n \/* ===== CUSTOMS GRID ===== *\/\n .customs-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));\n gap: 14px;\n margin-top: 10px;\n }\n .custom-card {\n padding: 20px 12px;\n text-align: center;\n background: linear-gradient(135deg, #fff, rgba(202,138,4,0.04));\n border-radius: 14px;\n border: 1px solid rgba(202,138,4,0.15);\n transition: all 0.25s ease;\n }\n .custom-card:hover {\n background: linear-gradient(135deg, var(--gold-pale), #fff);\n border-color: var(--gold);\n transform: translateY(-4px);\n box-shadow: 0 8px 20px rgba(202,138,4,0.15);\n }\n .custom-card .icon { font-size: 30px; display: block; margin-bottom: 6px; }\n .custom-card .name { font-size: 0.95rem; color: var(--brown); font-weight: 600; }\n .custom-card .brief {\n font-size: 0.75rem;\n color: var(--text-light);\n margin-top: 4px;\n line-height: 1.4;\n }\n\n \/* ===== FOOD GRID ===== *\/\n .food-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));\n gap: 16px;\n margin-top: 10px;\n }\n .food-card {\n padding: 22px 12px;\n text-align: center;\n border-radius: 50% 50% 40% 40% \/ 60% 60% 30% 30%;\n background: linear-gradient(180deg, rgba(202,138,4,0.08), rgba(251,191,36,0.04));\n border: 1px solid rgba(202,138,4,0.12);\n transition: all 0.25s ease;\n }\n .food-card:hover {\n background: linear-gradient(180deg, rgba(202,138,4,0.2), rgba(251,191,36,0.1));\n border-color: var(--gold);\n transform: translateY(-3px);\n }\n .food-card .icon { font-size: 32px; display: block; margin-bottom: 6px; }\n .food-card .name { font-size: 1rem; color: var(--brown); font-weight: 600; }\n .food-card .note {\n font-size: 0.7rem;\n color: var(--gold-dark);\n margin-top: 4px;\n }\n\n \/* ===== PROVERBS & POEM ===== *\/\n .proverb-list { margin-top: 10px; }\n .proverb-item {\n padding: 14px 20px;\n border-left: 3px solid var(--gold);\n margin-bottom: 12px;\n background: rgba(202,138,4,0.04);\n border-radius: 0 10px 10px 0;\n }\n .proverb-item .line { font-size: 1rem; color: var(--brown); }\n .proverb-item .meaning {\n font-size: 0.8rem;\n color: var(--text-light);\n margin-top: 4px;\n }\n\n .poem-box {\n margin-top: 24px;\n padding: 28px 24px;\n background: linear-gradient(135deg, rgba(66,32,6,0.03), rgba(202,138,4,0.06));\n border-radius: 16px;\n border: 1px solid rgba(202,138,4,0.15);\n }\n .poem-box .poem-title {\n font-size: 1.1rem;\n color: var(--brown);\n font-weight: 600;\n margin-bottom: 4px;\n }\n .poem-box .poem-author {\n font-size: 0.8rem;\n color: var(--gold-dark);\n margin-bottom: 14px;\n }\n .poem-box .poem-text {\n font-size: 1rem;\n line-height: 2;\n color: var(--text);\n white-space: pre-line;\n }\n\n \/* ===== FOOTER ===== *\/\n .footer {\n text-align: center;\n margin-top: 60px;\n padding: 30px 0 10px;\n color: rgba(202,138,4,0.4);\n font-size: 0.8rem;\n position: relative;\n }\n .footer::before {\n content: '';\n position: absolute;\n top: 0; left: 20%;\n width: 60%; height: 1px;\n background: linear-gradient(90deg, transparent, rgba(202,138,4,0.3), transparent);\n }\n\n \/* ===== RESPONSIVE ===== *\/\n @media (max-width: 640px) {\n .wrapper { padding: 20px 12px 60px; }\n section { padding: 28px 18px; margin: 40px 0; }\n .meaning-grid { grid-template-columns: repeat(2, 1fr); }\n .customs-grid { grid-template-columns: repeat(3, 1fr); }\n .food-grid { grid-template-columns: repeat(2, 1fr); }\n .hou-timeline { flex-direction: column; gap: 0; }\n .hou-step:not(:last-child)::after {\n content: '\u2193';\n right: auto;\n bottom: -4px;\n top: auto;\n left: 50%; transform: translateX(-50%);\n }\n .hero { padding: 50px 16px 40px; }\n .section-title { font-size: 1.3rem; }\n }\n<\/style>\n<\/head>\n<body>\n\n\n<canvas id=\"wheat-canvas\"><\/canvas>\n\n<div class=\"wrapper\">\n\n \n <header class=\"hero\">\n <span class=\"hero-icon\">\ud83c\udf3e<\/span>\n <h1>\u8292 \u79cd<\/h1>\n <p class=\"subtitle\">Grain in Ear \u00b7 \u6536\u83b7\u4e0e\u64ad\u79cd\u5e76\u884c<\/p>\n <span class=\"date-badge\">\ud83d\udcc5 6\u67085\u65e5 \u4e8c\u5341\u56db\u8282\u6c14\u00b7\u7b2c9\u4e2a<\/span>\n <\/header>\n\n \n <section>\n <h2 class=\"section-title\"><span class=\"emoji\">\ud83c\udf3e<\/span> \u8292\u79cd\u542b\u4e49<\/h2>\n <div class=\"meaning-grid\">\n <div class=\"meaning-card\">\n <span class=\"icon\">\ud83c\udf3e<\/span>\n <div class=\"label\">\u8292 \u00b7 \u6709\u8292\u4f5c\u7269<\/div>\n <div class=\"value\">\u6536\u9ea6<\/div>\n <\/div>\n <div class=\"meaning-card\">\n <span class=\"icon\">\ud83c\udf31<\/span>\n <div class=\"label\">\u79cd \u00b7 \u64ad\u79cd<\/div>\n <div class=\"value\">\u79cd\u7a3b<\/div>\n <\/div>\n <div class=\"meaning-card\">\n <span class=\"icon\">\ud83d\udc68\u200d\ud83c\udf3e<\/span>\n <div class=\"label\">\u519c\u5fd9\u65f6\u8282<\/div>\n <div class=\"value\">\u62a2\u6536\u62a2\u79cd<\/div>\n <\/div>\n <div class=\"meaning-card\">\n <span class=\"icon\">\u2600\ufe0f<\/span>\n <div class=\"label\">\u6c14\u5019\u7279\u5f81<\/div>\n <div class=\"value\">\u9ad8\u6e29\u591a\u96e8<\/div>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section>\n <h2 class=\"section-title\"><span class=\"emoji\">\ud83e\udd97<\/span> \u8292\u79cd\u4e09\u5019<\/h2>\n <div class=\"hou-timeline\">\n <div class=\"hou-step\">\n <div class=\"day\">\u521d\u5019<\/div>\n <span class=\"phenomenon\">\ud83e\udd97 \u87b3\u8782\u751f<\/span>\n <p class=\"desc\">\u5c0f\u87b3\u8782\u7834\u5375\u800c\u51fa<\/p>\n <\/div>\n <div class=\"hou-step\">\n <div class=\"day\">\u4e8c\u5019<\/div>\n <span class=\"phenomenon\">\ud83d\udc26 \u9d59\u59cb\u9e23<\/span>\n <p class=\"desc\">\u4f2f\u52b3\u9e1f\u5f00\u59cb\u9e23\u53eb<\/p>\n <\/div>\n <div class=\"hou-step\">\n <div class=\"day\">\u4e09\u5019<\/div>\n <span class=\"phenomenon\">\ud83d\udd07 \u53cd\u820c\u65e0\u58f0<\/span>\n <p class=\"desc\">\u53cd\u820c\u9e1f\u505c\u6b62\u53d1\u58f0<\/p>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section>\n <h2 class=\"section-title\"><span class=\"emoji\">\ud83c\udf8e<\/span> \u8292\u79cd\u516d\u4fd7<\/h2>\n <div class=\"customs-grid\">\n <div class=\"custom-card\">\n <span class=\"icon\">\ud83c\udf38<\/span>\n <div class=\"name\">\u9001\u82b1\u795e<\/div>\n <p class=\"brief\">\u996f\u9001\u82b1\u795e\u5f52\u4f4d<br>\u611f\u6069\u82b1\u5f00<\/p>\n <\/div>\n <div class=\"custom-card\">\n <span class=\"icon\">\ud83c\udf75<\/span>\n <div class=\"name\">\u716e\u6885<\/div>\n <p class=\"brief\">\u9752\u6885\u716e\u9152<br>\u9178\u751c\u751f\u6d25<\/p>\n <\/div>\n <div class=\"custom-card\">\n <span class=\"icon\">\ud83c\udf31<\/span>\n <div class=\"name\">\u5b89\u82d7<\/div>\n <p class=\"brief\">\u6c34\u7a3b\u63d2\u79e7<br>\u7948\u6c42\u4e30\u6536<\/p>\n <\/div>\n <div class=\"custom-card\">\n <span class=\"icon\">\ud83d\udca6<\/span>\n <div class=\"name\">\u6253\u6ce5\u5df4\u4ed7<\/div>\n <p class=\"brief\">\u8d35\u5dde\u4f97\u65cf<br>\u4e92\u6254\u6ce5\u5df4<\/p>\n <\/div>\n <div class=\"custom-card\">\n <span class=\"icon\">\ud83c\udf3f<\/span>\n <div class=\"name\">\u6302\u827e\u8349<\/div>\n <p class=\"brief\">\u9a71\u868a\u8f9f\u90aa<br>\u51c0\u5316\u7a7a\u6c14<\/p>\n <\/div>\n <div class=\"custom-card\">\n <span class=\"icon\">\ud83d\udc55<\/span>\n <div class=\"name\">\u6652\u8863\u9632\u9709<\/div>\n <p class=\"brief\">\u66dd\u6652\u8863\u7269<br\">\u9632\u6f6e\u9632\u9709<\/p>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section>\n <h2 class=\"section-title\"><span class=\"emoji\">\ud83c\udf7d\ufe0f<\/span> \u8292\u79cd\u516d\u98df<\/h2>\n <div class=\"food-grid\">\n <div class=\"food-card\">\n <span class=\"icon\">\ud83e\udd64<\/span>\n <div class=\"name\">\u9178\u6885\u6c64<\/div>\n <p class=\"note\">\u6d88\u6691\u89e3\u6e34<\/p>\n <\/div>\n <div class=\"food-card\">\n <span class=\"icon\">\ud83e\udd52<\/span>\n <div class=\"name\">\u82e6\u74dc<\/div>\n <p class=\"note\">\u6e05\u70ed\u53bb\u706b<\/p>\n <\/div>\n <div class=\"food-card\">\n <span class=\"icon\">\ud83e\udd6c<\/span>\n <div class=\"name\">\u4e1d\u74dc<\/div>\n <p class=\"note\">\u5229\u6c34\u901a\u7edc<\/p>\n <\/div>\n <div class=\"food-card\">\n <span class=\"icon\">\ud83c\udf52<\/span>\n <div class=\"name\">\u6768\u6885<\/div>\n <p class=\"note\">\u751f\u6d25\u6b62\u6e34<\/p>\n <\/div>\n <div class=\"food-card\">\n <span class=\"icon\">\ud83c\udf3d<\/span>\n <div class=\"name\">\u9c9c\u7389\u7c73<\/div>\n <p class=\"note\">\u5065\u813e\u5f00\u80c3<\/p>\n <\/div>\n <div class=\"food-card\">\n <span class=\"icon\">\ud83c\udf75<\/span>\n <div class=\"name\">\u7eff\u8336<\/div>\n <p class=\"note\">\u63d0\u795e\u9192\u8111<\/p>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section>\n <h2 class=\"section-title\"><span class=\"emoji\">\ud83d\udcdc<\/span> \u519c\u8c1a\u4e0e\u8bd7<\/h2>\n\n <div class=\"proverb-list\">\n <div class=\"proverb-item\">\n <p class=\"line\">\ud83c\udf3e \u8292\u79cd\u4e0d\u79cd\uff0c\u518d\u79cd\u65e0\u7528<\/p>\n <p class=\"meaning\">\u8292\u79cd\u65f6\u8282\u5fc5\u987b\u5b8c\u6210\u64ad\u79cd\uff0c\u9519\u8fc7\u519c\u65f6\u5c31\u767d\u8d39\u4e86<\/p>\n <\/div>\n <div class=\"proverb-item\">\n <p class=\"line\">\ud83c\udf3e \u8292\u79cd\u5fd9\uff0c\u4e09\u4e24\u573a<\/p>\n <p class=\"meaning\">\u8292\u79cd\u65f6\u8282\u519c\u6d3b\u7d27\u8feb\uff0c\u6253\u573a\u6536\u9ea6\u8981\u62a2\u65f6\u95f4<\/p>\n <\/div>\n <div class=\"proverb-item\">\n <p class=\"line\">\ud83c\udf3e \u8292\u79cd\u683d\u85af\u91cd\u5341\u65a4\uff0c\u590f\u81f3\u683d\u85af\u5149\u6839\u6839<\/p>\n <p class=\"meaning\">\u8292\u79cd\u683d\u79cd\u7ea2\u85af\u4ea7\u91cf\u9ad8\uff0c\u518d\u665a\u5c31\u53ea\u957f\u6839\u4e86<\/p>\n <\/div>\n <div class=\"proverb-item\">\n <p class=\"line\">\ud83c\udf3e \u9ea6\u6536\u5982\u6551\u706b\uff0c\u9ea6\u6253\u5982\u9f99\u53e3\u593a\u98df<\/p>\n <p class=\"meaning\">\u6536\u9ea6\u8981\u62a2\u65f6\u95f4\uff0c\u50cf\u6551\u706b\u4e00\u6837\u7d27\u8feb<\/p>\n <\/div>\n <\/div>\n\n <div class=\"poem-box\">\n <p class=\"poem-title\">\u300a\u65f6\u96e8\u300b<\/p>\n <p class=\"poem-author\">\u2014\u2014 \u5b8b \u00b7 \u9646\u6e38<\/p>\n <p class=\"poem-text\">\u65f6\u96e8\u53ca\u8292\u79cd\uff0c\u56db\u91ce\u7686\u63d2\u79e7\u3002<br>\n\u5bb6\u5bb6\u9ea6\u996d\u7f8e\uff0c\u5904\u5904\u83f1\u6b4c\u957f\u3002<\/p>\n <\/div>\n <\/section>\n\n \n <footer class=\"footer\">\n \ud83c\udf3e \u8292\u79cd \u00b7 \u6536\u83b7\u4e0e\u64ad\u79cd\u7684\u65f6\u8282 \ud83c\udf3e\n <\/footer>\n\n<\/div>\n\n<script>\n\/\/ ===== Animated Wheat Background =====\nconst canvas = document.getElementById('wheat-canvas');\nconst ctx = canvas.getContext('2d');\nlet W, H, stalks = [];\n\nfunction resize() {\n W = canvas.width = window.innerWidth;\n H = canvas.height = window.innerHeight;\n}\n\nclass Stalk {\n constructor() { this.reset(); }\n reset() {\n this.x = Math.random() * W;\n this.y = H + 20 + Math.random() * 40;\n this.baseX = this.x;\n this.length = 100 + Math.random() * 160;\n this.angle = -Math.PI \/ 2 + (Math.random() - 0.5) * 0.3;\n this.curl = (Math.random() - 0.5) * 0.02;\n this.sway = 0.003 + Math.random() * 0.005;\n this.phase = Math.random() * Math.PI * 2;\n this.speed = 0.4 + Math.random() * 0.4;\n this.segments = 8 + Math.floor(Math.random() * 6);\n this.hasHead = Math.random() > 0.2;\n this.headSize = 6 + Math.random() * 8;\n this.headBend = (Math.random() - 0.5) * 0.4;\n this.alpha = 0.15 + Math.random() * 0.25;\n \/\/ Color: golden gradient\n this.hue = 38 + Math.random() * 15; \/\/ 38-53\n this.sat = 60 + Math.random() * 20;\n }\n draw(t) {\n const swayAmt = Math.sin(t * this.speed + this.phase) * 0.4;\n let segLen = this.length \/ this.segments;\n\n \/\/ Draw stem\n ctx.beginPath();\n let px = this.baseX + swayAmt * 0.3;\n let py = this.y;\n ctx.moveTo(px, py);\n\n for (let i = 1; i <= this.segments; i++) {\n let progress = i \/ this.segments;\n let bend = this.angle + progress * this.curl + swayAmt * (1 - progress);\n px += Math.cos(bend + swayAmt * Math.sin(progress * 3)) * segLen;\n py += Math.sin(bend + swayAmt * progress) * segLen * (this.y < H\/2 ? -1 : -1);\n ctx.lineTo(px, py);\n }\n\n ctx.strokeStyle = `hsla(${this.hue}, ${this.sat}%, ${50 + 20 * (1 - this.segments \/ 14)}%, ${this.alpha * 0.7})`;\n ctx.lineWidth = 1.2;\n ctx.stroke();\n\n \/\/ Draw wheat head (grain cluster)\n if (this.hasHead) {\n let headX = px;\n let headY = py;\n let headAngle = this.angle + this.curl + swayAmt * 0.5 + this.headBend;\n let headLen = this.headSize * 2.5;\n\n ctx.save();\n ctx.translate(headX, headY);\n ctx.rotate(headAngle + 0.2);\n\n \/\/ Draw grains (small ovals along the head)\n const grains = 4 + Math.floor(this.headSize * 0.6);\n for (let g = 0; g < grains; g++) {\n let gp = g \/ grains;\n let gx = gp * headLen;\n let gy = Math.sin(gp * Math.PI * 2) * 3;\n ctx.beginPath();\n ctx.ellipse(gx, gy, 3, 1.5, gp * 0.5, 0, Math.PI * 2);\n ctx.fillStyle = `hsla(${this.hue - 5}, ${this.sat + 10}%, ${65 - gp * 15}%, ${this.alpha + 0.15})`;\n ctx.fill();\n }\n\n \/\/ Awns (whiskers)\n ctx.strokeStyle = `hsla(${this.hue + 5}, ${this.sat}%, 70%, ${this.alpha * 0.5})`;\n ctx.lineWidth = 0.5;\n for (let a = 0; a < 3; a++) {\n let ap = 0.2 + a * 0.3;\n let ax = ap * headLen;\n ctx.beginPath();\n ctx.moveTo(ax, -2);\n ctx.lineTo(ax + 6, -8 + Math.sin(a) * 2);\n ctx.stroke();\n }\n\n ctx.restore();\n }\n }\n}\n\nfunction initStalks() {\n stalks = [];\n const count = Math.floor(W * 0.12);\n for (let i = 0; i < count; i++) {\n stalks.push(new Stalk());\n }\n}\n\nlet time = 0;\nfunction animate() {\n time += 0.016;\n ctx.clearRect(0, 0, W, H);\n ctx.globalCompositeOperation = 'source-over';\n\n stalks.forEach(s => s.draw(time));\n\n \/\/ Subtle ground gradient\n const grad = ctx.createLinearGradient(0, H, 0, H - 60);\n grad.addColorStop(0, 'rgba(202,138,4,0.03)');\n grad.addColorStop(1, 'transparent');\n ctx.fillStyle = grad;\n ctx.fillRect(0, H - 60, W, 60);\n\n requestAnimationFrame(animate);\n}\n\nwindow.addEventListener('resize', () => { resize(); initStalks(); });\nresize();\ninitStalks();\nanimate();\n<\/script>\n\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"\u8292\u79cd \u00b7 \u6536\u83b7\u4e0e\u64ad\u79cd\u7684\u65f6\u8282 \ud83c\udf3e \u8292 \u79cd Grain in Ear \u00b7 \u6536\u83b7\u4e0e\u64ad\u79cd\u5e76\u884c \ud83d\udcc5 6\u67085\u65e5 \u4e8c\u5341\u56db\u8282\u6c14 […]","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"wp-custom-template-2","format":"standard","meta":{"footnotes":""},"categories":[7],"tags":[],"class_list":["post-1992","post","type-post","status-publish","format-standard","hentry","category-qushi"],"_links":{"self":[{"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/posts\/1992","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/comments?post=1992"}],"version-history":[{"count":1,"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/posts\/1992\/revisions"}],"predecessor-version":[{"id":1995,"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/posts\/1992\/revisions\/1995"}],"wp:attachment":[{"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/media?parent=1992"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/categories?post=1992"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.365ycs.com\/index.php\/wp-json\/wp\/v2\/tags?post=1992"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}