feat: add MTP benchmark page with dedicated data summary and visualization components

docs/assets/mtp.css

@@ -0,0 +1,111 @@
+.description {
+    font-size: 13px;
+    color: var(--ink);
+    max-width: 800px;
+    line-height: 1.5;
+    margin-top: 12px;
+}
+
+.description a {
+    color: var(--accent);
+    text-decoration: none;
+}
+
+.description a:hover {
+    text-decoration: underline;
+}
+
+.mtp-layout-inner {
+    max-width: 1050px;
+    margin-left: auto !important;
+    margin-right: auto !important;
+    width: 100%;
+}
+
+.mtp-table {
+    width: 100%;
+    min-width: auto;
+    font-size: 14px;
+}
+
+.mtp-table.hidden {
+    display: none;
+}
+
+.mtp-table th {
+    text-align: left;
+    vertical-align: bottom;
+    padding: 12px 16px;
+    font-size: 13px;
+}
+
+.mtp-table td {
+    padding: 12px 16px;
+}
+
+.mtp-table th.metric-col {
+    text-align: right;
+    width: 120px;
+}
+
+.mtp-table td.metric-col {
+    text-align: right;
+    font-feature-settings: "tnum";
+    font-weight: 600;
+}
+
+.mtp-table td.metric-col .measure {
+    font-size: 15px;
+}
+
+.mtp-table th.model, .mtp-table td.model {
+    width: 320px;
+}
+
+.mtp-table th .sub {
+    font-weight: 400;
+    font-size: 11px;
+    color: var(--muted);
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+}
+
+.speedup-badge {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    padding: 2px 8px;
+    border-radius: 6px;
+    font-size: 12px;
+    font-weight: 700;
+}
+
+.speedup-high {
+    background: #d7f5e3;
+    color: #025333;
+}
+
+.speedup-med {
+    background: #eef9ff;
+    color: #0a517a;
+}
+
+.speedup-low {
+    background: #fdf2f8;
+    color: #9d174d;
+}
+
+.toolbox-pill {
+    display: inline-flex;
+    align-items: center;
+    padding: 2px 8px;
+    border-radius: 999px;
+    font-size: 11px;
+    background: #f1f5ff;
+    color: #1d4ed8;
+}
+
+.toolbox-pill.radv {
+    background: #fdf2f8;
+    color: #9d174d;
+}