Restore safety cutoff to 800F, faster PID loop timing, enhanced simple UI with stats/charts/flight controls, compact TTY display

piNail2/static/style.css

@@ -212,6 +212,76 @@ body.ui-simple .app-footer {
     margin-top: 8px;
 }
 
+.simple-flight-controls {
+    display: flex;
+    gap: 8px;
+    margin-top: 8px;
+}
+
+.simple-stats {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 6px;
+    margin: 10px 0;
+}
+
+.simple-stat {
+    font-size: 0.74rem;
+    border: 1px solid var(--border);
+    border-radius: 6px;
+    padding: 5px 7px;
+    color: var(--text-dim);
+    background: rgba(0, 0, 0, 0.25);
+}
+
+.simple-stat strong {
+    color: var(--text);
+    font-variant-numeric: tabular-nums;
+}
+
+.simple-alert {
+    margin-top: 6px;
+    margin-bottom: 6px;
+    font-size: 0.73rem;
+    color: var(--text-dim);
+    border-left: 2px solid var(--border);
+    padding-left: 8px;
+    min-height: 18px;
+}
+
+.simple-alert.warn {
+    color: #f5b041;
+    border-left-color: #f5b041;
+}
+
+.simple-alert.bad {
+    color: var(--accent-red);
+    border-left-color: var(--accent-red);
+}
+
+.simple-chart-wrap {
+    background: var(--bg-card);
+    border: 1px solid var(--border);
+    border-radius: var(--radius);
+    padding: 12px;
+    margin-bottom: 12px;
+    height: 280px;
+    box-shadow: inset 0 0 0 1px rgba(211, 84, 0, 0.12);
+}
+
+.simple-chart-wrap h3 {
+    font-size: 0.82rem;
+    text-transform: uppercase;
+    color: var(--text-dim);
+    margin-bottom: 8px;
+    letter-spacing: 0.05em;
+}
+
+.simple-chart-wrap canvas {
+    width: 100% !important;
+    height: calc(100% - 26px) !important;
+}
+
 .power-mini {
     border-radius: 999px;
     border: 1px solid var(--border);
@@ -681,6 +751,13 @@ button:disabled {
     width: 70px;
 }
 
+#control-loop-size,
+#flight-takeoff-seconds,
+#flight-descent-seconds,
+#flight-descent-target {
+    width: 112px;
+}
+
 /* Status Bar */
 .status-bar {
     display: flex;
@@ -783,6 +860,10 @@ button:disabled {
         grid-template-columns: 1fr;
     }
 
+    .simple-chart-wrap {
+        height: 220px;
+    }
+
     .chart-section {
         height: 220px;
     }