Simplify system settings layout

docs/PLAN.md

@@ -29,3 +29,4 @@ Updated: 2026-04-02
 13. Added Docker build/compose runtime that compiles 3proxy in-container and starts the panel with a managed 3proxy process.
 14. Added backend tests for config rendering and user-management API edge cases.
 15. Added editable System settings with shared validation, a system update API, service/port conflict protection, and UI coverage for local save flows.
+16. Simplified the System tab layout by removing the redundant Runtime card and collapsing those fields into a compact settings section.

docs/PROJECT_INDEX.md

@@ -24,7 +24,7 @@ Updated: 2026-04-02
 
 - `src/main.tsx`: application bootstrap
 - `src/App.tsx`: authenticated panel shell with API-backed dashboard/user flows and validated local fallback mutations
-- `src/SystemTab.tsx`: editable runtime/system form for host, modes, and managed services
+- `src/SystemTab.tsx`: editable system settings and managed services form with compact panel-level controls
 - `src/App.test.tsx`: login-gate, modal interaction, pause/resume, delete-confirm, and system-save UI tests
 - `src/app.css`: full panel styling
 - `src/data/mockDashboard.ts`: default panel state and frontend fallback snapshot

src/SystemTab.tsx

@@ -41,11 +41,10 @@ export default function SystemTab({ snapshot, onSaveSystem }: SystemTabProps) {
 
   return (
     <form className="system-editor" onSubmit={handleSubmit}>
-      <section className="page-grid system-grid">
-        <article className="panel-card">
+      <section className="page-grid single-column system-grid">
+        <article className="panel-card system-settings-card">
           <div className="card-header">
-            <h2>Runtime</h2>
-            <span className="status-pill idle">editable</span>
+            <h2>Panel settings</h2>
           </div>
           <div className="system-fields">
             <label className="field-group">
@@ -78,8 +77,8 @@ export default function SystemTab({ snapshot, onSaveSystem }: SystemTabProps) {
             </label>
           </div>
           <p className="system-hint">
-            Saving writes a new generated config and keeps existing user assignments on enabled assignable
-            services only.
+            These values describe how the panel generates and reloads the 3proxy config. Saving keeps
+            existing users attached only to enabled assignable services.
           </p>
         </article>
 

src/app.css

@@ -546,6 +546,10 @@ tbody tr:last-child td {
   display: block;
 }
 
+.system-settings-card {
+  gap: 12px;
+}
+
 .system-fields,
 .service-editor-grid {
   display: grid;