@chrisdudek/yg 5.4.0 → 5.4.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/bin.js +267 -54
- package/dist/templates/portal/app.css +278 -0
- package/dist/templates/portal/shell.css +257 -0
- package/dist/templates/portal/shell.html +39 -0
- package/dist/templates/portal/tokens.css +269 -0
- package/dist/templates/portal/views-audit.css +108 -0
- package/dist/templates/portal/views-flows.css +258 -0
- package/dist/templates/portal/views-panel.css +249 -0
- package/dist/templates/portal/views-relations.css +218 -0
- package/dist/templates/portal/views-rulebook.css +279 -0
- package/dist/templates/portal/views-start.css +208 -0
- package/dist/templates/portal/views.css +340 -0
- package/package.json +4 -2
|
@@ -0,0 +1,269 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Design tokens + base + the honest status palette.
|
|
3
|
+
*
|
|
4
|
+
* The visual language's foundation: Radix Slate neutrals + Radix Blue accent as CSS custom
|
|
5
|
+
* properties (light is :root, dark is [data-theme="dark"], so theming "just works"), the
|
|
6
|
+
* base body/type/focus rules, and the HONEST STATUS PALETTE — every state rendered with
|
|
7
|
+
* color + glyph + border-style, never color alone (accessibility). The only saturated color
|
|
8
|
+
* on the page is a state. The shell/component layouts live in sibling files; this file is
|
|
9
|
+
* the source of truth a renderer's state classes resolve against.
|
|
10
|
+
*/
|
|
11
|
+
|
|
12
|
+
:root {
|
|
13
|
+
--bg: #fcfcfd;
|
|
14
|
+
--surface-1: #f9f9fb;
|
|
15
|
+
--surface-2: #f0f0f3;
|
|
16
|
+
--surface-3: #e8e8ec;
|
|
17
|
+
--surface-4: #e0e1e6;
|
|
18
|
+
--border-subtle: #d9d9e0;
|
|
19
|
+
--border: #cdced6;
|
|
20
|
+
--border-strong: #b9bbc6;
|
|
21
|
+
--text-muted: #676b73;
|
|
22
|
+
--text-secondary: #60646c;
|
|
23
|
+
--text-primary: #1c2024;
|
|
24
|
+
--accent: #0090ff;
|
|
25
|
+
--accent-hover: #0588f0;
|
|
26
|
+
--accent-text: #0d74ce;
|
|
27
|
+
--focus-ring: #5eb1ef;
|
|
28
|
+
--verified: #208368;
|
|
29
|
+
--verified-bg: #e6f7ed;
|
|
30
|
+
--refused: #ce2c31;
|
|
31
|
+
--refused-bg: #feebec;
|
|
32
|
+
--unverified: #9a6700;
|
|
33
|
+
--unverified-bg: #fff7c2;
|
|
34
|
+
--norule: #60646c;
|
|
35
|
+
--norule-bg: #f0f0f3;
|
|
36
|
+
--waived: #8e4ec6;
|
|
37
|
+
--waived-bg: #f7edfe;
|
|
38
|
+
--live: #0d74ce;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
[data-theme='dark'] {
|
|
42
|
+
--bg: #111113;
|
|
43
|
+
--surface-1: #18191b;
|
|
44
|
+
--surface-2: #212225;
|
|
45
|
+
--surface-3: #272a2d;
|
|
46
|
+
--surface-4: #2e3135;
|
|
47
|
+
--border-subtle: #363a3f;
|
|
48
|
+
--border: #43484e;
|
|
49
|
+
--border-strong: #5a6168;
|
|
50
|
+
--text-muted: #8b8f96;
|
|
51
|
+
--text-secondary: #b0b4ba;
|
|
52
|
+
--text-primary: #edeef0;
|
|
53
|
+
--accent: #0090ff;
|
|
54
|
+
--accent-hover: #3b9eff;
|
|
55
|
+
--accent-text: #70b8ff;
|
|
56
|
+
--focus-ring: #2870bd;
|
|
57
|
+
--verified: #3dd9a4;
|
|
58
|
+
--verified-bg: #0f2e22;
|
|
59
|
+
--refused: #ff9592;
|
|
60
|
+
--refused-bg: #3b1219;
|
|
61
|
+
--unverified: #ffca16;
|
|
62
|
+
--unverified-bg: #302008;
|
|
63
|
+
--norule: #b0b4ba;
|
|
64
|
+
--norule-bg: #212225;
|
|
65
|
+
--waived: #bf7af0;
|
|
66
|
+
--waived-bg: #2b1c3b;
|
|
67
|
+
--live: #70b8ff;
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
* {
|
|
71
|
+
box-sizing: border-box;
|
|
72
|
+
}
|
|
73
|
+
html,
|
|
74
|
+
body {
|
|
75
|
+
margin: 0;
|
|
76
|
+
}
|
|
77
|
+
body {
|
|
78
|
+
background: var(--bg);
|
|
79
|
+
color: var(--text-primary);
|
|
80
|
+
font: 14px/1.45 Inter, ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
|
|
81
|
+
}
|
|
82
|
+
.mono,
|
|
83
|
+
.chip-count,
|
|
84
|
+
.tree-type {
|
|
85
|
+
font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
|
|
86
|
+
font-feature-settings: 'tnum', 'liga';
|
|
87
|
+
}
|
|
88
|
+
:focus-visible {
|
|
89
|
+
outline: 2px solid var(--focus-ring);
|
|
90
|
+
outline-offset: 1px;
|
|
91
|
+
border-radius: 4px;
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
/* ── Honest status palette — color + glyph + border, never color alone ──── */
|
|
95
|
+
.state-glyph {
|
|
96
|
+
display: inline-grid;
|
|
97
|
+
place-items: center;
|
|
98
|
+
width: 22px;
|
|
99
|
+
height: 22px;
|
|
100
|
+
border-radius: 6px;
|
|
101
|
+
font-size: 13px;
|
|
102
|
+
font-weight: 700;
|
|
103
|
+
flex: none;
|
|
104
|
+
}
|
|
105
|
+
.state-verified {
|
|
106
|
+
color: var(--verified);
|
|
107
|
+
}
|
|
108
|
+
.state-glyph.state-verified {
|
|
109
|
+
background: var(--verified-bg);
|
|
110
|
+
border: 2px solid var(--verified);
|
|
111
|
+
}
|
|
112
|
+
.state-refused {
|
|
113
|
+
color: var(--refused);
|
|
114
|
+
}
|
|
115
|
+
.state-glyph.state-refused {
|
|
116
|
+
background: var(--refused-bg);
|
|
117
|
+
border: 2px solid var(--refused);
|
|
118
|
+
}
|
|
119
|
+
.state-unverified {
|
|
120
|
+
color: var(--unverified);
|
|
121
|
+
}
|
|
122
|
+
.state-glyph.state-unverified {
|
|
123
|
+
background: var(--unverified-bg);
|
|
124
|
+
border: 2px dashed var(--unverified);
|
|
125
|
+
}
|
|
126
|
+
.state-no-rule {
|
|
127
|
+
color: var(--norule);
|
|
128
|
+
}
|
|
129
|
+
.state-glyph.state-no-rule {
|
|
130
|
+
background: var(--norule-bg);
|
|
131
|
+
border: 2px dotted var(--norule);
|
|
132
|
+
}
|
|
133
|
+
.state-warning {
|
|
134
|
+
color: var(--unverified);
|
|
135
|
+
}
|
|
136
|
+
.state-glyph.state-warning {
|
|
137
|
+
background: var(--unverified-bg);
|
|
138
|
+
border: 2px dashed var(--unverified);
|
|
139
|
+
}
|
|
140
|
+
.state-not-applicable {
|
|
141
|
+
color: var(--text-muted);
|
|
142
|
+
}
|
|
143
|
+
.state-glyph.state-not-applicable {
|
|
144
|
+
background: var(--surface-2);
|
|
145
|
+
border: 1px solid var(--border-subtle);
|
|
146
|
+
}
|
|
147
|
+
.state-suppressed {
|
|
148
|
+
color: var(--waived);
|
|
149
|
+
}
|
|
150
|
+
.state-glyph.state-suppressed {
|
|
151
|
+
background: var(--waived-bg);
|
|
152
|
+
border: 2px dashed var(--waived);
|
|
153
|
+
}
|
|
154
|
+
.state-draft {
|
|
155
|
+
color: var(--text-muted);
|
|
156
|
+
}
|
|
157
|
+
.state-glyph.state-draft {
|
|
158
|
+
background: var(--surface-2);
|
|
159
|
+
border: 2px dotted var(--text-muted);
|
|
160
|
+
}
|
|
161
|
+
.state-boundary {
|
|
162
|
+
color: var(--refused);
|
|
163
|
+
}
|
|
164
|
+
.state-glyph.state-boundary {
|
|
165
|
+
background: var(--refused-bg);
|
|
166
|
+
border: 2px solid var(--refused);
|
|
167
|
+
background-image: repeating-linear-gradient(
|
|
168
|
+
45deg,
|
|
169
|
+
var(--refused-bg),
|
|
170
|
+
var(--refused-bg) 3px,
|
|
171
|
+
transparent 3px,
|
|
172
|
+
transparent 6px
|
|
173
|
+
);
|
|
174
|
+
}
|
|
175
|
+
|
|
176
|
+
/* ── Legend — the honest key, as ONE pinned collapsible bottom bar ───────── */
|
|
177
|
+
.legend-h {
|
|
178
|
+
font-size: 11px;
|
|
179
|
+
text-transform: uppercase;
|
|
180
|
+
letter-spacing: 0.6px;
|
|
181
|
+
color: var(--text-muted);
|
|
182
|
+
margin: 0;
|
|
183
|
+
}
|
|
184
|
+
.legend-bar {
|
|
185
|
+
/* Pinned once to the bottom of the viewport, full width, above the stage content. The stage
|
|
186
|
+
reserves matching bottom padding so its last row never hides behind the collapsed bar. */
|
|
187
|
+
position: fixed;
|
|
188
|
+
left: 0;
|
|
189
|
+
right: 0;
|
|
190
|
+
bottom: 0;
|
|
191
|
+
z-index: 30;
|
|
192
|
+
background: var(--surface-1);
|
|
193
|
+
border-top: 1px solid var(--border);
|
|
194
|
+
box-shadow: 0 -2px 8px -4px rgba(0, 0, 0, 0.18);
|
|
195
|
+
padding: 8px 22px;
|
|
196
|
+
max-height: 70vh;
|
|
197
|
+
overflow-y: auto;
|
|
198
|
+
}
|
|
199
|
+
.legend-bar-head {
|
|
200
|
+
display: flex;
|
|
201
|
+
align-items: center;
|
|
202
|
+
gap: 14px;
|
|
203
|
+
flex-wrap: wrap;
|
|
204
|
+
}
|
|
205
|
+
.legend-toggle {
|
|
206
|
+
display: inline-flex;
|
|
207
|
+
align-items: center;
|
|
208
|
+
gap: 7px;
|
|
209
|
+
flex: none;
|
|
210
|
+
border: 0;
|
|
211
|
+
background: none;
|
|
212
|
+
font: inherit;
|
|
213
|
+
cursor: pointer;
|
|
214
|
+
padding: 2px 0;
|
|
215
|
+
color: var(--text-secondary);
|
|
216
|
+
}
|
|
217
|
+
.legend-caret {
|
|
218
|
+
font-size: 10px;
|
|
219
|
+
color: var(--text-muted);
|
|
220
|
+
}
|
|
221
|
+
.legend-chips {
|
|
222
|
+
display: flex;
|
|
223
|
+
flex-wrap: wrap;
|
|
224
|
+
gap: 6px 12px;
|
|
225
|
+
align-items: center;
|
|
226
|
+
}
|
|
227
|
+
.legend-chip {
|
|
228
|
+
display: inline-flex;
|
|
229
|
+
align-items: center;
|
|
230
|
+
gap: 6px;
|
|
231
|
+
font-size: 12px;
|
|
232
|
+
color: var(--text-secondary);
|
|
233
|
+
}
|
|
234
|
+
.legend-chip .state-glyph {
|
|
235
|
+
width: 18px;
|
|
236
|
+
height: 18px;
|
|
237
|
+
font-size: 11px;
|
|
238
|
+
}
|
|
239
|
+
.legend-chip-l {
|
|
240
|
+
white-space: nowrap;
|
|
241
|
+
}
|
|
242
|
+
/* The full descriptions are hidden until the bar is expanded. */
|
|
243
|
+
.legend-grid {
|
|
244
|
+
display: none;
|
|
245
|
+
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
|
|
246
|
+
gap: 10px;
|
|
247
|
+
margin-top: 12px;
|
|
248
|
+
}
|
|
249
|
+
.legend-bar.legend-open .legend-grid {
|
|
250
|
+
display: grid;
|
|
251
|
+
}
|
|
252
|
+
.legend-item {
|
|
253
|
+
display: flex;
|
|
254
|
+
align-items: center;
|
|
255
|
+
gap: 12px;
|
|
256
|
+
border: 1px solid var(--border-subtle);
|
|
257
|
+
border-radius: 10px;
|
|
258
|
+
padding: 10px 12px;
|
|
259
|
+
background: var(--bg);
|
|
260
|
+
}
|
|
261
|
+
.legend-text b {
|
|
262
|
+
font-weight: 600;
|
|
263
|
+
}
|
|
264
|
+
.legend-text span {
|
|
265
|
+
display: block;
|
|
266
|
+
color: var(--text-muted);
|
|
267
|
+
font-size: 12px;
|
|
268
|
+
margin-top: 1px;
|
|
269
|
+
}
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Phase-5 audit-depth styles — the portable-export bar, the file-aware freshness strip on the
|
|
3
|
+
* landing, and the node panel's provenance pins + freshness banner. Kept in its own focused
|
|
4
|
+
* file so the larger view stylesheets stay under the focused-file cap. Tokens come from
|
|
5
|
+
* tokens.css; the only saturated color is a state, resolved through the shared state classes —
|
|
6
|
+
* nothing here invents a green.
|
|
7
|
+
*/
|
|
8
|
+
|
|
9
|
+
/* ── Portable export bar (Coverage & Audit + Suppressions) ─────────────────── */
|
|
10
|
+
.exp-bar {
|
|
11
|
+
display: flex;
|
|
12
|
+
flex-wrap: wrap;
|
|
13
|
+
align-items: center;
|
|
14
|
+
gap: 8px;
|
|
15
|
+
margin: 12px 0 18px;
|
|
16
|
+
}
|
|
17
|
+
.exp-lbl {
|
|
18
|
+
color: var(--text-secondary);
|
|
19
|
+
font-size: 12px;
|
|
20
|
+
margin-right: 4px;
|
|
21
|
+
}
|
|
22
|
+
.exp-btn {
|
|
23
|
+
border: 1px solid var(--border);
|
|
24
|
+
border-radius: 8px;
|
|
25
|
+
background: var(--surface-1);
|
|
26
|
+
color: var(--text-primary);
|
|
27
|
+
font-size: 12px;
|
|
28
|
+
padding: 6px 12px;
|
|
29
|
+
cursor: pointer;
|
|
30
|
+
}
|
|
31
|
+
.exp-btn:hover {
|
|
32
|
+
background: var(--surface-2);
|
|
33
|
+
}
|
|
34
|
+
.exp-btn:focus-visible {
|
|
35
|
+
outline: 2px solid var(--accent);
|
|
36
|
+
outline-offset: 2px;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
/* ── V1 file-aware freshness strip (the heartbeat) ─────────────────────────── */
|
|
40
|
+
.ov-fresh {
|
|
41
|
+
border: 1px dashed var(--state-unverified-border, var(--border));
|
|
42
|
+
border-left-width: 4px;
|
|
43
|
+
border-radius: 12px;
|
|
44
|
+
background: var(--surface-1);
|
|
45
|
+
padding: 14px 16px;
|
|
46
|
+
margin-bottom: 16px;
|
|
47
|
+
}
|
|
48
|
+
.ov-fresh-head {
|
|
49
|
+
display: flex;
|
|
50
|
+
align-items: center;
|
|
51
|
+
gap: 8px;
|
|
52
|
+
font-size: 15px;
|
|
53
|
+
}
|
|
54
|
+
.ov-fresh-sub {
|
|
55
|
+
color: var(--text-secondary);
|
|
56
|
+
font-size: 12.5px;
|
|
57
|
+
line-height: 1.5;
|
|
58
|
+
margin: 6px 0 10px;
|
|
59
|
+
}
|
|
60
|
+
.ov-fresh-chips {
|
|
61
|
+
display: flex;
|
|
62
|
+
flex-wrap: wrap;
|
|
63
|
+
gap: 6px;
|
|
64
|
+
}
|
|
65
|
+
.ov-fresh-chip {
|
|
66
|
+
display: inline-flex;
|
|
67
|
+
align-items: center;
|
|
68
|
+
gap: 6px;
|
|
69
|
+
border: 1px solid var(--border);
|
|
70
|
+
border-radius: 999px;
|
|
71
|
+
background: var(--surface-2);
|
|
72
|
+
color: var(--text-primary);
|
|
73
|
+
font-size: 11.5px;
|
|
74
|
+
padding: 4px 10px;
|
|
75
|
+
cursor: pointer;
|
|
76
|
+
}
|
|
77
|
+
.ov-fresh-chip:focus-visible {
|
|
78
|
+
outline: 2px solid var(--accent);
|
|
79
|
+
outline-offset: 2px;
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
/* ── Node panel: provenance pins + freshness banner ────────────────────────── */
|
|
83
|
+
.pan-prov {
|
|
84
|
+
display: flex;
|
|
85
|
+
flex-wrap: wrap;
|
|
86
|
+
gap: 8px;
|
|
87
|
+
margin: 8px 0 4px;
|
|
88
|
+
font-size: 11px;
|
|
89
|
+
color: var(--text-muted);
|
|
90
|
+
}
|
|
91
|
+
.pan-prov-k {
|
|
92
|
+
border: 1px solid var(--border);
|
|
93
|
+
border-radius: 6px;
|
|
94
|
+
padding: 2px 7px;
|
|
95
|
+
background: var(--surface-2);
|
|
96
|
+
}
|
|
97
|
+
.pan-fresh {
|
|
98
|
+
display: flex;
|
|
99
|
+
align-items: flex-start;
|
|
100
|
+
gap: 8px;
|
|
101
|
+
border: 1px dashed var(--state-unverified-border, var(--border));
|
|
102
|
+
border-radius: 10px;
|
|
103
|
+
padding: 10px 12px;
|
|
104
|
+
margin: 8px 0;
|
|
105
|
+
font-size: 12px;
|
|
106
|
+
line-height: 1.45;
|
|
107
|
+
color: var(--text-secondary);
|
|
108
|
+
}
|
|
@@ -0,0 +1,258 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* V7 Flows + V8 Suppressions styles.
|
|
3
|
+
*
|
|
4
|
+
* The business-language flow lens (V7: gallery + detail, three honest flow states) and the
|
|
5
|
+
* risk-first waiver inventory (V8). Tokens come from tokens.css; every verdict / waived color is
|
|
6
|
+
* resolved through the shared state classes (`.state-*`), so this file invents no green — a flow
|
|
7
|
+
* pill and a participant dot read their treatment from the shared honest-state model.
|
|
8
|
+
*/
|
|
9
|
+
|
|
10
|
+
/* ── V7 Flows ────────────────────────────────────────────────────────────── */
|
|
11
|
+
.fl-layout {
|
|
12
|
+
display: grid;
|
|
13
|
+
grid-template-columns: 290px 1fr;
|
|
14
|
+
gap: 18px;
|
|
15
|
+
}
|
|
16
|
+
.fl-gallery {
|
|
17
|
+
display: flex;
|
|
18
|
+
flex-direction: column;
|
|
19
|
+
gap: 10px;
|
|
20
|
+
}
|
|
21
|
+
.fl-card {
|
|
22
|
+
text-align: left;
|
|
23
|
+
border: 1px solid var(--border-subtle);
|
|
24
|
+
border-radius: 10px;
|
|
25
|
+
padding: 12px 14px;
|
|
26
|
+
background: var(--surface-1);
|
|
27
|
+
font: inherit;
|
|
28
|
+
cursor: pointer;
|
|
29
|
+
}
|
|
30
|
+
.fl-card-sel {
|
|
31
|
+
border-color: var(--accent);
|
|
32
|
+
box-shadow: inset 2px 0 0 var(--accent);
|
|
33
|
+
}
|
|
34
|
+
.fl-card-top {
|
|
35
|
+
display: flex;
|
|
36
|
+
align-items: center;
|
|
37
|
+
gap: 8px;
|
|
38
|
+
}
|
|
39
|
+
.fl-card-top b {
|
|
40
|
+
font-weight: 600;
|
|
41
|
+
}
|
|
42
|
+
.fl-card-d {
|
|
43
|
+
color: var(--text-muted);
|
|
44
|
+
font-size: 12px;
|
|
45
|
+
margin-top: 3px;
|
|
46
|
+
line-height: 1.45;
|
|
47
|
+
}
|
|
48
|
+
.fl-state {
|
|
49
|
+
margin-left: auto;
|
|
50
|
+
font-size: 10px;
|
|
51
|
+
font-weight: 700;
|
|
52
|
+
border-radius: 5px;
|
|
53
|
+
padding: 1px 7px;
|
|
54
|
+
border: 1px solid currentColor;
|
|
55
|
+
}
|
|
56
|
+
.fl-detail {
|
|
57
|
+
border: 1px solid var(--border-subtle);
|
|
58
|
+
border-radius: 12px;
|
|
59
|
+
background: var(--surface-1);
|
|
60
|
+
padding: 18px;
|
|
61
|
+
}
|
|
62
|
+
.fl-detail-head {
|
|
63
|
+
display: flex;
|
|
64
|
+
align-items: center;
|
|
65
|
+
gap: 10px;
|
|
66
|
+
}
|
|
67
|
+
.fl-detail-head h2 {
|
|
68
|
+
margin: 0;
|
|
69
|
+
font-size: 17px;
|
|
70
|
+
}
|
|
71
|
+
.fl-detail-head .fl-state {
|
|
72
|
+
margin-left: 0;
|
|
73
|
+
}
|
|
74
|
+
.fl-detail-d {
|
|
75
|
+
color: var(--text-secondary);
|
|
76
|
+
margin: 6px 0 16px;
|
|
77
|
+
font-size: 13px;
|
|
78
|
+
line-height: 1.55;
|
|
79
|
+
}
|
|
80
|
+
.fl-h5 {
|
|
81
|
+
margin: 14px 0 9px;
|
|
82
|
+
font-size: 11px;
|
|
83
|
+
text-transform: uppercase;
|
|
84
|
+
letter-spacing: 0.6px;
|
|
85
|
+
color: var(--text-muted);
|
|
86
|
+
}
|
|
87
|
+
.fl-parts {
|
|
88
|
+
display: flex;
|
|
89
|
+
flex-direction: column;
|
|
90
|
+
gap: 7px;
|
|
91
|
+
}
|
|
92
|
+
.fl-part {
|
|
93
|
+
display: flex;
|
|
94
|
+
align-items: center;
|
|
95
|
+
gap: 9px;
|
|
96
|
+
font: inherit;
|
|
97
|
+
font-size: 13px;
|
|
98
|
+
border: 1px solid var(--border-subtle);
|
|
99
|
+
border-radius: 8px;
|
|
100
|
+
padding: 6px 11px;
|
|
101
|
+
background: var(--bg);
|
|
102
|
+
cursor: pointer;
|
|
103
|
+
text-align: left;
|
|
104
|
+
}
|
|
105
|
+
.fl-part:hover {
|
|
106
|
+
border-color: var(--border-strong);
|
|
107
|
+
}
|
|
108
|
+
.fl-part-desc {
|
|
109
|
+
margin-left: 18px;
|
|
110
|
+
}
|
|
111
|
+
.fl-part-path {
|
|
112
|
+
min-width: 0;
|
|
113
|
+
}
|
|
114
|
+
.fl-part-tag {
|
|
115
|
+
margin-left: auto;
|
|
116
|
+
font-size: 10px;
|
|
117
|
+
color: var(--text-muted);
|
|
118
|
+
border: 1px dashed var(--border);
|
|
119
|
+
border-radius: 5px;
|
|
120
|
+
padding: 0 6px;
|
|
121
|
+
}
|
|
122
|
+
.fl-asps {
|
|
123
|
+
display: inline-flex;
|
|
124
|
+
gap: 7px;
|
|
125
|
+
flex-wrap: wrap;
|
|
126
|
+
}
|
|
127
|
+
.fl-asp {
|
|
128
|
+
font-size: 11px;
|
|
129
|
+
border: 1px solid var(--border-subtle);
|
|
130
|
+
border-radius: 5px;
|
|
131
|
+
padding: 1px 7px;
|
|
132
|
+
color: var(--text-secondary);
|
|
133
|
+
background: var(--bg);
|
|
134
|
+
cursor: pointer;
|
|
135
|
+
}
|
|
136
|
+
.fl-asp:hover {
|
|
137
|
+
border-color: var(--border-strong);
|
|
138
|
+
}
|
|
139
|
+
.fl-rel-none {
|
|
140
|
+
color: var(--text-muted);
|
|
141
|
+
font-size: 12px;
|
|
142
|
+
}
|
|
143
|
+
.fl-foot {
|
|
144
|
+
margin-top: 14px;
|
|
145
|
+
color: var(--text-muted);
|
|
146
|
+
font-size: 11.5px;
|
|
147
|
+
font-style: italic;
|
|
148
|
+
line-height: 1.5;
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
/* ── V8 Suppressions ─────────────────────────────────────────────────────── */
|
|
152
|
+
.sup-banner {
|
|
153
|
+
display: flex;
|
|
154
|
+
align-items: center;
|
|
155
|
+
gap: 9px;
|
|
156
|
+
background: var(--unverified-bg);
|
|
157
|
+
border: 1px solid color-mix(in srgb, var(--unverified) 40%, transparent);
|
|
158
|
+
color: var(--unverified);
|
|
159
|
+
border-radius: 8px;
|
|
160
|
+
padding: 8px 12px;
|
|
161
|
+
font-size: 12.5px;
|
|
162
|
+
margin-bottom: 16px;
|
|
163
|
+
font-weight: 500;
|
|
164
|
+
}
|
|
165
|
+
.sup-table {
|
|
166
|
+
width: 100%;
|
|
167
|
+
border-collapse: collapse;
|
|
168
|
+
}
|
|
169
|
+
.sup-table thead td {
|
|
170
|
+
font-size: 10px;
|
|
171
|
+
text-transform: uppercase;
|
|
172
|
+
letter-spacing: 0.5px;
|
|
173
|
+
color: var(--text-muted);
|
|
174
|
+
padding: 6px 10px;
|
|
175
|
+
border-bottom: 1px solid var(--border);
|
|
176
|
+
}
|
|
177
|
+
.sup-table tbody td {
|
|
178
|
+
padding: 10px;
|
|
179
|
+
border-bottom: 1px solid var(--border-subtle);
|
|
180
|
+
font-size: 12.5px;
|
|
181
|
+
vertical-align: top;
|
|
182
|
+
}
|
|
183
|
+
.sup-locbtn {
|
|
184
|
+
display: inline-flex;
|
|
185
|
+
align-items: center;
|
|
186
|
+
gap: 7px;
|
|
187
|
+
border: 0;
|
|
188
|
+
background: none;
|
|
189
|
+
padding: 0;
|
|
190
|
+
font: inherit;
|
|
191
|
+
cursor: pointer;
|
|
192
|
+
text-align: left;
|
|
193
|
+
}
|
|
194
|
+
.sup-locbtn:disabled {
|
|
195
|
+
cursor: default;
|
|
196
|
+
}
|
|
197
|
+
.sup-locpath {
|
|
198
|
+
color: var(--accent-text);
|
|
199
|
+
font-size: 12px;
|
|
200
|
+
}
|
|
201
|
+
.sup-asp {
|
|
202
|
+
border: 1px solid color-mix(in srgb, var(--waived) 40%, transparent);
|
|
203
|
+
color: var(--waived);
|
|
204
|
+
background: none;
|
|
205
|
+
border-radius: 5px;
|
|
206
|
+
padding: 1px 6px;
|
|
207
|
+
font-size: 11px;
|
|
208
|
+
white-space: nowrap;
|
|
209
|
+
cursor: pointer;
|
|
210
|
+
}
|
|
211
|
+
.sup-flag {
|
|
212
|
+
font-size: 10px;
|
|
213
|
+
font-weight: 700;
|
|
214
|
+
border-radius: 5px;
|
|
215
|
+
padding: 1px 7px;
|
|
216
|
+
white-space: nowrap;
|
|
217
|
+
}
|
|
218
|
+
.sup-flag-wild {
|
|
219
|
+
/* A waiver RISK flag, not a verdict — kept off the reserved refused-verdict red so a risky
|
|
220
|
+
waiver never reads as a failed check. Amber, matching the sibling unbounded-range flag. */
|
|
221
|
+
color: var(--unverified);
|
|
222
|
+
background: var(--unverified-bg);
|
|
223
|
+
}
|
|
224
|
+
.sup-flag-unb {
|
|
225
|
+
color: var(--unverified);
|
|
226
|
+
background: var(--unverified-bg);
|
|
227
|
+
}
|
|
228
|
+
.sup-flag-other {
|
|
229
|
+
color: var(--text-secondary);
|
|
230
|
+
border: 1px solid var(--border);
|
|
231
|
+
}
|
|
232
|
+
.sup-flag-ok {
|
|
233
|
+
color: var(--text-muted);
|
|
234
|
+
border: 1px solid var(--border-subtle);
|
|
235
|
+
}
|
|
236
|
+
.sup-reason {
|
|
237
|
+
color: var(--text-secondary);
|
|
238
|
+
line-height: 1.5;
|
|
239
|
+
}
|
|
240
|
+
.sup-empty {
|
|
241
|
+
border: 1px solid var(--border);
|
|
242
|
+
border-radius: 12px;
|
|
243
|
+
background: var(--surface-1);
|
|
244
|
+
padding: 22px;
|
|
245
|
+
display: flex;
|
|
246
|
+
flex-direction: column;
|
|
247
|
+
align-items: flex-start;
|
|
248
|
+
gap: 8px;
|
|
249
|
+
}
|
|
250
|
+
.sup-empty b {
|
|
251
|
+
font-size: 15px;
|
|
252
|
+
}
|
|
253
|
+
.sup-empty p {
|
|
254
|
+
margin: 0;
|
|
255
|
+
color: var(--text-secondary);
|
|
256
|
+
font-size: 13px;
|
|
257
|
+
line-height: 1.5;
|
|
258
|
+
}
|