Stabilize skill evolution layout

Author: Lliar-liar

index.html

@@ -1183,10 +1183,14 @@
       display: grid;
       grid-template-columns: minmax(0, 1.42fr) minmax(300px, 0.58fr);
       gap: 16px;
-      align-items: start;
+      align-items: stretch;
+      min-height: 520px;
     }
 
     .evolution-chart {
+      display: flex;
+      flex-direction: column;
+      min-height: 520px;
       background: var(--panel);
       border: 1px solid var(--line);
       border-radius: 16px;
@@ -1228,14 +1232,16 @@
     }
 
     .chart-scroller {
+      flex: 1;
       overflow-x: auto;
       padding: 10px 14px 0;
     }
 
     .skill-chart {
       width: 100%;
       min-width: 760px;
-      height: auto;
+      height: 100%;
+      min-height: 390px;
       display: block;
       font-family: var(--mono);
     }
@@ -1328,7 +1334,10 @@
     }
 
     .evolution-detail {
+      display: flex;
+      flex-direction: column;
       min-height: 438px;
+      height: 100%;
       padding: 20px;
       color: var(--ink);
       background: #ffffff;
@@ -1412,6 +1421,10 @@
       margin: 0;
       padding: 0;
       list-style: none;
+      overflow-y: auto;
+      min-height: 150px;
+      max-height: 184px;
+      padding-right: 4px;
     }
 
     .detail-edits li {

skillopt.html

@@ -1183,10 +1183,14 @@
       display: grid;
       grid-template-columns: minmax(0, 1.42fr) minmax(300px, 0.58fr);
       gap: 16px;
-      align-items: start;
+      align-items: stretch;
+      min-height: 520px;
     }
 
     .evolution-chart {
+      display: flex;
+      flex-direction: column;
+      min-height: 520px;
       background: var(--panel);
       border: 1px solid var(--line);
       border-radius: 16px;
@@ -1228,14 +1232,16 @@
     }
 
     .chart-scroller {
+      flex: 1;
       overflow-x: auto;
       padding: 10px 14px 0;
     }
 
     .skill-chart {
       width: 100%;
       min-width: 760px;
-      height: auto;
+      height: 100%;
+      min-height: 390px;
       display: block;
       font-family: var(--mono);
     }
@@ -1328,7 +1334,10 @@
     }
 
     .evolution-detail {
+      display: flex;
+      flex-direction: column;
       min-height: 438px;
+      height: 100%;
       padding: 20px;
       color: var(--ink);
       background: #ffffff;
@@ -1412,6 +1421,10 @@
       margin: 0;
       padding: 0;
       list-style: none;
+      overflow-y: auto;
+      min-height: 150px;
+      max-height: 184px;
+      padding-right: 4px;
     }
 
     .detail-edits li {