Initial import of Forge app

client/src/components/charts/SlaHeatmap/SlaHeatmap.module.scss

@@ -0,0 +1,63 @@
+@use '../../../styles/variables' as *;
+
+.card {
+  background: var(--surface);
+  border: 1px solid var(--border);
+  border-radius: $radius-lg;
+  padding: $s-5;
+  box-shadow: var(--shadow-sm);
+}
+.head { display: flex; align-items: baseline; justify-content: space-between; gap: $s-3; margin-bottom: $s-4; }
+.title { font-size: 13px; font-weight: 700; color: var(--text); }
+.sub { font-size: 11px; color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.04em; }
+
+.scroll { overflow-x: auto; }
+.table {
+  width: 100%;
+  border-collapse: separate;
+  border-spacing: 3px;
+  font-size: 12px;
+}
+.pmHead, .sizeHead, .totHead {
+  font-size: 10px;
+  font-weight: 700;
+  text-transform: uppercase;
+  letter-spacing: 0.04em;
+  color: var(--text-muted);
+  padding: 2px 6px;
+  text-align: center;
+  white-space: nowrap;
+}
+.pmHead { text-align: left; }
+.sizeHead { display: table-cell; }
+.sizeChip {
+  display: inline-block;
+  min-width: 26px;
+  padding: 1px 6px;
+  border-radius: 4px;
+  color: #fff;
+  font-weight: 700;
+}
+.norm { display: block; margin-top: 2px; font-size: 9px; color: var(--text-dim); font-weight: 500; }
+
+.pm {
+  text-align: left;
+  font-weight: 600;
+  color: var(--text);
+  white-space: nowrap;
+  max-width: 170px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  padding-right: $s-2;
+}
+.cell, .total {
+  text-align: center;
+  border-radius: 4px;
+  padding: 4px 8px;
+  min-width: 52px;
+  background: var(--surface-alt);
+}
+.total { background: var(--primary-bg); }
+.primary { display: block; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; }
+.meta { display: block; font-size: 10px; color: var(--text-muted); }
+.dot { color: var(--text-dim); }