diff --git a/src/dashboard/example/components/ScoreboardPanel.vue b/src/dashboard/example/components/ScoreboardPanel.vue
index 02c81a8..5872b50 100644
--- a/src/dashboard/example/components/ScoreboardPanel.vue
+++ b/src/dashboard/example/components/ScoreboardPanel.vue
@@ -1209,8 +1209,8 @@ watch(
 
 .scoreboard-preview {
   display: grid;
-  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
-  gap: 10px;
+  grid-template-columns: minmax(0, 1fr) minmax(320px, auto) minmax(0, 1fr);
+  gap: 18px;
   padding: 16px;
   align-items: center;
 }
@@ -1222,10 +1222,10 @@ watch(
 
 .scoreboard-preview__side-inner {
   width: 100%;
-  display: grid;
-  grid-template-columns: auto minmax(0, 1fr);
+  display: flex;
   align-items: center;
-  gap: 12px;
+  justify-content: space-between;
+  gap: 14px;
 }
 
 .scoreboard-preview__side--right {
@@ -1233,7 +1233,7 @@ watch(
 }
 
 .scoreboard-preview__side--right .scoreboard-preview__side-inner {
-  grid-template-columns: minmax(0, 1fr) auto;
+  justify-content: space-between;
 }
 
 .scoreboard-preview__image-wrap {
@@ -1266,7 +1266,6 @@ watch(
 
 .scoreboard-preview__controls {
   width: min(100%, 260px);
-  justify-self: center;
   display: flex;
   flex-direction: column;
   gap: 6px;
@@ -1299,7 +1298,7 @@ watch(
   display: flex;
   align-items: center;
   justify-content: center;
-  gap: 10px;
+  gap: 18px;
 }
 
 .scoreboard-preview__score-side {
@@ -1366,8 +1365,9 @@ watch(
   }
 
   .scoreboard-preview__side-inner {
-    grid-template-columns: 1fr;
+    flex-direction: column;
     align-items: flex-start;
+    justify-content: flex-start;
   }
 
   .scoreboard-preview__side--right {
@@ -1375,7 +1375,7 @@ watch(
   }
 
   .scoreboard-preview__side--right .scoreboard-preview__side-inner {
-    grid-template-columns: 1fr;
+    justify-content: flex-start;
   }
 }