Formatted webpage with correct faction member calls

static/styles.css

@@ -4,43 +4,77 @@ body {
     color: #f0f0f0;
     margin: 0;
     padding: 0;
+    min-height: 100vh;
 }
 
 .container {
-    max-width: 800px;
+    width: 95%;
+    max-width: 1300px;
     margin: 2rem auto;
-    padding: 2rem;
+}
+
+/* Top Bar with Title + Interval Box */
+.top-bar {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 2rem;
+}
+
+.interval-box {
+    background-color: #3a3a4d;
+    padding: 0.75rem 1rem;
+    border-radius: 10px;
+    display: flex;
+    flex-direction: column;
+    gap: 0.4rem;
+}
+
+.interval-box label {
+    font-size: 0.9rem;
+    color: #ffcc66;
+}
+
+.interval-box input {
+    padding: 0.5rem;
+    border-radius: 6px;
+    border: none;
+}
+
+/* Horizontal Faction Row */
+.faction-row {
+    display: flex;
+    flex-direction: row !important;
+    justify-content: space-between;
+    gap: 2rem;
+}
+
+/* Each Faction Card */
+.faction-card {
+    flex: 1;
     background-color: #2c2c3e;
+    padding: 1.5rem;
     border-radius: 12px;
     box-shadow: 0 0 20px rgba(0,0,0,0.5);
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+    width: 100%;
+    max-width: 600px;
 }
 
-h1 {
-    text-align: center;
-    color: #ffcc00;
-}
-
-.faction-section {
-    background-color: #3a3a4d;
-    margin: 1.5rem 0;
-    padding: 1rem 1.5rem;
-    border-radius: 8px;
-}
-
-.faction-section h2 {
+.faction-card h2 {
     color: #66ccff;
 }
 
 input[type="number"] {
-    padding: 0.5rem;
-    margin-right: 0.5rem;
+    padding: 0.7rem;
     border-radius: 6px;
     border: none;
-    width: 150px;
 }
 
 button {
-    padding: 0.5rem 1rem;
+    padding: 0.7rem 1rem;
     border-radius: 6px;
     border: none;
     background-color: #66ccff;