From f51e609481c66f0d16b8f72504c166501bcbeca5 Mon Sep 17 00:00:00 2001
From: tianhao <tianhao@metona.dev>
Date: Tue, 16 Jun 2026 14:27:44 +0800
Subject: [PATCH] =?UTF-8?q?style:=20=E5=AE=98=E7=BD=91=E7=8E=AF=E5=A2=83?=
 =?UTF-8?q?=E6=94=AF=E6=8C=81=E6=94=B9=E4=B8=BA=E5=8D=A1=E7=89=87=E7=BD=91?=
 =?UTF-8?q?=E6=A0=BC=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 site/index.html | 36 ++++++++++++++++++++++++++++++++++--
 1 file changed, 34 insertions(+), 2 deletions(-)

diff --git a/site/index.html b/site/index.html
index 5227a15..359b8e0 100644
--- a/site/index.html
+++ b/site/index.html
@@ -138,8 +138,40 @@
 
 <section class="container">
   <h2 class="section-title">环境支持</h2>
-  <p class="section-desc">Chrome 64+ / Firefox 63+ / Safari 11+ / Edge 79+ / Node.js 18+ / TypeScript 4.5+</p>
-  <p style="text-align:center;color:var(--muted);font-size:13px;margin-top:8px">依赖 Web Animations API · Pointer Events · CSS Grid · CSS Custom Properties — 所有现代浏览器原生支持</p>
+  <p class="section-desc">所有现代浏览器原生支持，无需 polyfill</p>
+  <div class="env-grid" style="display:grid; grid-template-columns:repeat(auto-fill,minmax(165px,1fr)); gap:12px;">
+    <div class="feature" style="text-align:center;padding:20px 16px;">
+      <div style="font-size:28px;margin-bottom:6px;">🌐</div>
+      <h3>Chrome</h3>
+      <p>64+</p>
+    </div>
+    <div class="feature" style="text-align:center;padding:20px 16px;">
+      <div style="font-size:28px;margin-bottom:6px;">🦊</div>
+      <h3>Firefox</h3>
+      <p>63+</p>
+    </div>
+    <div class="feature" style="text-align:center;padding:20px 16px;">
+      <div style="font-size:28px;margin-bottom:6px;">🧭</div>
+      <h3>Safari</h3>
+      <p>11+</p>
+    </div>
+    <div class="feature" style="text-align:center;padding:20px 16px;">
+      <div style="font-size:28px;margin-bottom:6px;">🪟</div>
+      <h3>Edge</h3>
+      <p>79+</p>
+    </div>
+    <div class="feature" style="text-align:center;padding:20px 16px;">
+      <div style="font-size:28px;margin-bottom:6px;">📦</div>
+      <h3>Node.js</h3>
+      <p>18+</p>
+    </div>
+    <div class="feature" style="text-align:center;padding:20px 16px;">
+      <div style="font-size:28px;margin-bottom:6px;">📘</div>
+      <h3>TypeScript</h3>
+      <p>4.5+</p>
+    </div>
+  </div>
+  <p style="text-align:center;color:var(--muted);font-size:13px;margin-top:16px">核心依赖：Web Animations API · Pointer Events · CSS Grid · CSS Custom Properties</p>
 </section>
 
 <section class="container">