diff --git a/oneinai.html b/oneinai.html
index a92cb77..295e8fa 100644
--- a/oneinai.html
+++ b/oneinai.html
@@ -682,6 +682,8 @@
       radial-gradient(ellipse 48% 120% at 78% 0%, rgba(144, 149, 232, 0.2) 0%, transparent 62%),
       linear-gradient(112deg, #ffffff 0%, #f8fcff 48%, #f5f6ff 100%);
     box-shadow: 0 20px 60px rgba(62, 164, 236, 0.1);
+    view-timeline-name: --docs-panel;
+    view-timeline-axis: block;
   }
 
   .docs-panel .section-kicker {
@@ -948,7 +950,7 @@
     .section::after {
       animation: line-draw 1s linear both;
       animation-timeline: view();
-      animation-range: cover 55% cover 80%;
+      animation-range: cover 32% cover 58%;
     }
 
     .reveal-on-scroll {
@@ -1112,33 +1114,33 @@
 
     .docs-panel {
       animation-name: panel-unfold;
-      animation-range: entry 25% cover 62%;
+      animation-range: entry 5% entry 100%;
     }
 
     .docs-panel .section-kicker,
     .docs-panel .section-description {
       animation: detail-rise 1s linear both;
-      animation-timeline: view();
+      animation-timeline: --docs-panel;
     }
 
     .docs-panel .section-kicker {
-      animation-range: entry 30% cover 38%;
+      animation-range: entry 10% entry 55%;
     }
 
     .docs-panel .section-title {
       animation: title-reveal 1s linear both;
-      animation-timeline: view();
-      animation-range: entry 40% cover 52%;
+      animation-timeline: --docs-panel;
+      animation-range: entry 20% entry 80%;
     }
 
     .docs-panel .section-description {
-      animation-range: entry 52% cover 60%;
+      animation-range: entry 35% entry 92%;
     }
 
     .doc-link {
       animation: reveal-from-right 1s linear both;
-      animation-timeline: view();
-      animation-range: entry 65% cover 72%;
+      animation-timeline: --docs-panel;
+      animation-range: entry 45% entry 100%;
     }
 
   }