Tighten QWord ribbon layout

src/styles.css

@@ -439,8 +439,7 @@ button {
   min-width: 100%;
   height: 118px;
   min-height: 118px;
-  overflow-x: auto;
-  overflow-y: hidden;
+  overflow: hidden;
   background: #ffffff;
 }
 
@@ -452,7 +451,7 @@ button {
   height: 118px;
   min-height: 118px;
   min-width: 0;
-  padding: 8px 10px 4px;
+  padding: 7px 8px 4px;
   border-right: 1px solid #d6dde8;
 }
 
@@ -474,23 +473,23 @@ button {
 }
 
 .word-file-group {
-  flex: 0 0 76px;
+  flex: 0 0 68px;
   grid-template-columns: minmax(0, 1fr);
 }
 
 .word-file-actions {
   display: grid;
-  grid-template-columns: repeat(2, 28px);
+  grid-template-columns: repeat(2, 26px);
   align-content: start;
   justify-content: center;
-  gap: 6px;
+  gap: 5px;
 }
 
 .word-icon-command {
   display: grid;
   place-items: center;
-  width: 28px;
-  height: 28px;
+  width: 26px;
+  height: 26px;
   border: 1px solid transparent;
   border-radius: 4px;
   background: #ffffff;
@@ -504,7 +503,7 @@ button {
 }
 
 .word-clipboard-group {
-  flex: 0 0 150px;
+  flex: 0 1 136px;
   grid-template-columns: auto auto;
 }
 
@@ -522,7 +521,7 @@ button {
   place-items: center;
   align-content: center;
   gap: 4px;
-  min-width: 66px;
+  min-width: 58px;
   min-height: 70px;
   border: 1px solid transparent;
   border-radius: 4px;
@@ -549,6 +548,7 @@ button {
   display: inline-flex;
   align-items: center;
   gap: 6px;
+  max-width: 100%;
   min-height: 22px;
   border: 1px solid transparent;
   border-radius: 4px;
@@ -556,11 +556,14 @@ button {
   color: var(--text);
   cursor: pointer;
   font-size: 12px;
+  overflow: hidden;
+  text-overflow: ellipsis;
   white-space: nowrap;
 }
 
 .word-font-group {
-  flex: 0 0 266px;
+  flex: 1 1 226px;
+  min-width: 214px;
   grid-template-rows: 28px 28px minmax(0, 1fr) 18px;
   grid-template-columns: minmax(0, 1fr);
 }
@@ -573,7 +576,7 @@ button {
 
 .word-font-select {
   min-width: 0;
-  flex: 1 1 170px;
+  flex: 1 1 132px;
 }
 
 .word-font-size-select {
@@ -606,7 +609,7 @@ button {
 }
 
 .word-paragraph-group {
-  flex: 0 0 170px;
+  flex: 0 1 154px;
   grid-template-rows: 28px 28px minmax(0, 1fr) 18px;
   grid-template-columns: minmax(0, 1fr);
 }
@@ -621,7 +624,8 @@ button {
 }
 
 .word-styles-group {
-  flex: 0 0 360px;
+  flex: 1 1 238px;
+  min-width: 190px;
   grid-template-columns: minmax(0, 1fr);
 }
 
@@ -636,7 +640,7 @@ button {
 .word-style-gallery button {
   display: grid;
   align-content: center;
-  flex: 0 0 82px;
+  flex: 0 0 78px;
   min-height: 64px;
   padding: 6px 8px;
   border: 1px solid #d6dde8;
@@ -645,17 +649,23 @@ button {
   color: #334155;
   cursor: pointer;
   font-size: 12px;
+  overflow: hidden;
   text-align: left;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 .word-style-gallery button span {
   color: #1e5fa7;
-  font-size: 20px;
+  font-size: 18px;
   line-height: 1.1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 .word-insert-group {
-  flex: 0 0 96px;
+  flex: 0 0 86px;
   grid-template-columns: minmax(0, 1fr);
 }
 
@@ -665,7 +675,7 @@ button {
 }
 
 .word-edit-group {
-  flex: 0 0 132px;
+  flex: 0 0 118px;
   grid-template-columns: minmax(0, 1fr);
 }
 
@@ -683,8 +693,12 @@ button {
 
 .word-ribbon .compact-command {
   height: 28px;
+  min-width: 0;
   padding: 0 8px;
   font-size: 12px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 .hidden-file-input {