feat: add signature quality period trends

src/styles/global.css

@@ -6767,6 +6767,101 @@
   font-size: 13px;
 }
 
+.signature-business-quality-table {
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-md);
+  overflow: auto;
+}
+
+.signature-business-quality-table table {
+  border-collapse: collapse;
+  min-width: 820px;
+  width: 100%;
+}
+
+.signature-business-quality-table th,
+.signature-business-quality-table td {
+  border-bottom: 1px solid var(--color-border);
+  padding: var(--space-3);
+  text-align: left;
+  vertical-align: middle;
+}
+
+.signature-business-quality-table thead th {
+  background: var(--color-surface-muted);
+  color: var(--color-text-muted);
+  font-size: 13px;
+}
+
+.signature-business-quality-table tbody tr:last-child > * {
+  border-bottom: 0;
+}
+
+.signature-business-quality-metric {
+  background: transparent;
+  border: 0;
+  cursor: pointer;
+  display: grid;
+  gap: 3px;
+  padding: 0;
+  text-align: left;
+}
+
+.signature-business-quality-metric strong {
+  color: var(--color-text-strong);
+}
+
+.signature-business-quality-metric span {
+  font-weight: 600;
+}
+
+.signature-business-quality-metric small {
+  color: var(--color-primary);
+}
+
+.signature-business-quality-metric:hover small {
+  text-decoration: underline;
+}
+
+.signature-quality-trend {
+  background: var(--color-surface);
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-xl);
+  box-shadow: var(--shadow-lg);
+  left: 50%;
+  max-width: 880px;
+  padding: var(--space-5);
+  position: absolute;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  width: min(88%, 880px);
+  z-index: 2;
+}
+
+.signature-quality-trend__heading {
+  align-items: flex-start;
+  display: flex;
+  justify-content: space-between;
+}
+
+.signature-quality-trend__heading h3,
+.signature-quality-trend__heading p {
+  margin: 0;
+}
+
+.signature-quality-trend__heading p {
+  color: var(--color-text-muted);
+  margin-top: var(--space-1);
+}
+
+.signature-quality-trend__heading button {
+  background: transparent;
+  border: 0;
+  color: var(--color-text-muted);
+  cursor: pointer;
+  padding: var(--space-2);
+}
+
 .signature-carrier-grid {
   display: grid;
   gap: var(--space-3);