diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx
index da2bdac..c748aec 100644
--- a/frontend/src/App.jsx
+++ b/frontend/src/App.jsx
@@ -2876,14 +2876,19 @@ function structuredBattleEvents(eventLog) {
   ].sort((a, b) => Number(a.time || 0) - Number(b.time || 0))
 }
 
+function chatTypeClass(type, senderClassName) {
+  return String(type || 'ALL').toUpperCase() === 'ALL' ? 'text-warning' : senderClassName
+}
+
 function parseFormattedChatLine(line) {
-  const match = String(line || '').match(/^([+-]?)(\[\d{2}:\d{2}\]\s+\[[^\]]+\]\s+)\[[^\]]*\]\s+`([^`]*)`:\s?(.*)$/)
+  const match = String(line || '').match(/^([+-]?)(\[\d{2}:\d{2}\])\s+\[([^\]]+)\]\s+\[[^\]]*\]\s+`([^`]*)`:\s?(.*)$/)
   if (!match) return null
   return {
     prefix: match[1],
-    head: match[2],
-    name: match[3],
-    message: match[4],
+    time: match[2],
+    type: match[3],
+    name: match[4],
+    message: match[5],
   }
 }
 
@@ -3127,10 +3132,13 @@ function FormattedChatLine({ line, players }) {
   const className = player?.className || battleLineColor(parsed.prefix)
   const team = player?.team || '??'
   const name = player?.name || parsed.name
+  const typeClassName = chatTypeClass(parsed.type, className)
 
   return (
-    <div className={`whitespace-pre-wrap ${className}`}>
-      {parsed.head}[{team}] `{name}`: {parsed.message}
+    <div className="whitespace-pre-wrap">
+      <span className="text-text-soft">{parsed.time} </span>
+      <span className={typeClassName}>[{parsed.type}]</span>
+      <span className={className}> [{team}] `{name}`: {parsed.message}</span>
     </div>
   )
 }
@@ -3166,9 +3174,13 @@ function BattleEventLine({ event, players }) {
 
 function ChatEventLine({ event, players }) {
   const player = logPlayer(players, event.uid)
+  const type = event.type || 'ALL'
+  const typeClassName = chatTypeClass(type, player.className)
   return (
-    <div className={`whitespace-pre-wrap ${player.className}`}>
-      [{formatLogTime(event.time)}] [{event.type || 'ALL'}] [{player.team}] `{player.name}`: {event.message || ''}
+    <div className="whitespace-pre-wrap">
+      <span className="text-text-soft">[{formatLogTime(event.time)}] </span>
+      <span className={typeClassName}>[{type}]</span>
+      <span className={player.className}> [{player.team}] `{player.name}`: {event.message || ''}</span>
     </div>
   )
 }