Update research interests

Author: githajae

.well-known/com.chrome.devtools.json

@@ -0,0 +1,5 @@
+{
+  "workspace": {
+    "root": "./"
+  }
+}

_config.yml

@@ -115,6 +115,7 @@ footer:
 include:
   - .htaccess
   - _pages
+  - .well-known
 exclude:
   - "*.sublime-project"
   - "*.sublime-workspace"

_layouts/research-interests.html

@@ -245,6 +245,16 @@ <h2 class="s-title">The AI<br>Database System.</h2>
       d.classList.toggle('active', (i + 1) === activeStep);
     });
     if (activeStep >= 5) alignConnector();
+
+    /* Mobile: reset diagram panel scroll to 0 so the top-most lit element is
+       always visible.  Collapsed elements (max-height:0) occupy no space, so
+       the new element for each step naturally rises to position 0 — no offset
+       calculation needed.  Runs after class changes so the element is already
+       expanding when the panel snaps to top. */
+    if (window.innerWidth <= 900) {
+      var panel = document.querySelector('.ri-diagram-panel');
+      if (panel) panel.scrollTop = 0;
+    }
   }
 
   /* On mobile the sticky diagram panel occupies the top 40vh, so we tell

_sass/custom/_research-interests.scss

@@ -405,13 +405,24 @@ html:has(body.page--research-interests) {
   .ri-diagram-panel {
     position: sticky;
     top: 0;
-    height: 40vh;
+    height: 45vh;
     z-index: 10;
-    padding: 1.25rem 1rem;
+    padding: 1rem 1rem 0;
     border-bottom: 1px solid rgba(0, 0, 0, 0.08);
+
+    /* KEY FIX: top-align so as more elements appear they stack from the top,
+       and scroll internally so the panel never clips the relevant element */
+    align-items: flex-start;
+    overflow-y: auto;
+    overflow-x: hidden;
+    scrollbar-width: none;          /* Firefox */
+    &::-webkit-scrollbar { display: none; } /* Chrome/Safari */
   }
 
-  .arch-diagram { max-width: 300px; }
+  .arch-diagram {
+    max-width: 300px;
+    padding-bottom: 1rem; /* breathing room at bottom of scroll area */
+  }
 
   /* Slightly smaller chips to fit the smaller panel */
   .arch-agents .a-pill    { font-size: 0.7em;  padding: 0.22rem 0.55rem; }
@@ -420,7 +431,7 @@ html:has(body.page--research-interests) {
   .graph-svg              { margin-top: 0.4rem; }
 
   .ri-step {
-    min-height: 60vh; /* each step fills the remaining 60vh so observer fires */
+    min-height: 70vh; /* taller sections give the observer more time to fire */
     padding: 3rem 1.5rem;
     border-left: none;