diff --git a/styles.css b/styles.css
index b2ed6cc..bda98f6 100644
--- a/styles.css
+++ b/styles.css
@@ -438,12 +438,12 @@ body {
   justify-content: space-between;
   align-items: center;
   padding: 0.75rem 1.5rem;
-  background: var(--bg-tertiary);
-  border-radius: 12px;
+  background: var(--bg-secondary);
+  border-radius: 16px;
   border: 1px solid var(--border-light);
-  width: 100%;
-  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
   min-height: 70px;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
+  gap: 1rem;
 }
 
 /* Left Side: Turn Info + Text */
@@ -453,12 +453,28 @@ body {
   justify-content: center;
   align-items: flex-start;
   gap: 0.25rem;
+  flex: 1;
+  min-width: 0; /* Important for text truncation in flex item */
 }
 
 .turn-display {
   display: flex;
   align-items: center;
-  gap: 1rem;
+  gap: 0.75rem;
+}
+
+.turn-display .label {
+  color: var(--text-secondary);
+  font-size: 0.9rem;
+  font-weight: 500;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+}
+
+.turn-display .current-player {
+  font-size: 1.25rem;
+  font-weight: 700;
+  color: var(--text-primary);
 }
 
 .status-text-small {
@@ -466,6 +482,13 @@ body {
   color: var(--text-secondary);
   font-weight: 500;
   margin-top: 2px;
+  
+  /* Text Truncation */
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  display: block;
 }
 
 /* Right Side: Identity */