asjs-express 1.5.0 → 1.6.0
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.
|
@@ -1,40 +1,56 @@
|
|
|
1
|
+
/* ================================================================
|
|
2
|
+
ASJS Theme — 2026 Edition
|
|
3
|
+
Clean, geometric, Next.js-inspired light design
|
|
4
|
+
================================================================ */
|
|
5
|
+
|
|
6
|
+
@import url('https://fonts.googleapis.com/css2?family=Geist:wght@300;400;500;600;700&display=swap');
|
|
7
|
+
|
|
8
|
+
/* ── Tokens ── */
|
|
1
9
|
:root {
|
|
2
|
-
--bg: #
|
|
10
|
+
--bg: #ffffff;
|
|
11
|
+
--bg-2: #fafafa;
|
|
12
|
+
--bg-3: #f5f5f5;
|
|
3
13
|
--surface: #ffffff;
|
|
4
|
-
--
|
|
5
|
-
--
|
|
6
|
-
--
|
|
7
|
-
--text: #
|
|
8
|
-
--
|
|
9
|
-
--
|
|
10
|
-
--accent: #
|
|
11
|
-
--accent-
|
|
12
|
-
--
|
|
13
|
-
--
|
|
14
|
-
--
|
|
15
|
-
--
|
|
16
|
-
|
|
17
|
-
--
|
|
18
|
-
--
|
|
19
|
-
--
|
|
20
|
-
--
|
|
21
|
-
|
|
22
|
-
--
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
}
|
|
14
|
+
--border: rgba(0, 0, 0, 0.08);
|
|
15
|
+
--border-2: rgba(0, 0, 0, 0.14);
|
|
16
|
+
--text: #111111;
|
|
17
|
+
--text-2: #444444;
|
|
18
|
+
--text-3: #888888;
|
|
19
|
+
--accent: #0070f3;
|
|
20
|
+
--accent-hover: #0060df;
|
|
21
|
+
--accent-soft: #f0f7ff;
|
|
22
|
+
--success-bg: #f0fdf4;
|
|
23
|
+
--success-border: rgba(22, 163, 74, 0.2);
|
|
24
|
+
--error-bg: #fef2f2;
|
|
25
|
+
--error-border: rgba(220, 38, 38, 0.2);
|
|
26
|
+
|
|
27
|
+
--r-xl: 16px;
|
|
28
|
+
--r-lg: 12px;
|
|
29
|
+
--r-md: 8px;
|
|
30
|
+
--r-sm: 6px;
|
|
31
|
+
|
|
32
|
+
--shadow-sm: 0 1px 2px rgba(0,0,0,0.04), 0 2px 8px rgba(0,0,0,0.04);
|
|
33
|
+
--shadow-md: 0 4px 20px rgba(0,0,0,0.08);
|
|
34
|
+
|
|
35
|
+
--asjs-progress-gradient: linear-gradient(90deg, #0070f3, #60b0ff);
|
|
36
|
+
--asjs-progress-shadow: 0 0 12px rgba(0, 112, 243, 0.5);
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
/* ── Base ── */
|
|
40
|
+
*, *::before, *::after { box-sizing: border-box; }
|
|
28
41
|
|
|
29
42
|
html {
|
|
30
43
|
scroll-behavior: smooth;
|
|
44
|
+
-webkit-font-smoothing: antialiased;
|
|
31
45
|
}
|
|
32
46
|
|
|
33
47
|
body.example-body {
|
|
34
48
|
margin: 0;
|
|
35
49
|
min-height: 100vh;
|
|
36
50
|
color: var(--text);
|
|
37
|
-
font-family: system-ui, -apple-system,
|
|
51
|
+
font-family: "Geist", "Inter", system-ui, -apple-system, sans-serif;
|
|
52
|
+
font-size: 15px;
|
|
53
|
+
line-height: 1.6;
|
|
38
54
|
background: var(--bg);
|
|
39
55
|
}
|
|
40
56
|
|
|
@@ -42,270 +58,202 @@ body.example-body::after {
|
|
|
42
58
|
content: "";
|
|
43
59
|
position: fixed;
|
|
44
60
|
inset: 0;
|
|
45
|
-
background: rgba(
|
|
46
|
-
backdrop-filter: blur(
|
|
61
|
+
background: rgba(255,255,255,0.7);
|
|
62
|
+
backdrop-filter: blur(6px);
|
|
47
63
|
opacity: 0;
|
|
48
64
|
pointer-events: none;
|
|
49
|
-
transition: opacity
|
|
65
|
+
transition: opacity 180ms ease;
|
|
50
66
|
z-index: 18;
|
|
51
67
|
}
|
|
52
68
|
|
|
53
|
-
html.asjs-loading body.example-body::after {
|
|
54
|
-
opacity: 1;
|
|
55
|
-
}
|
|
69
|
+
html.asjs-loading body.example-body::after { opacity: 1; }
|
|
56
70
|
|
|
57
|
-
a {
|
|
58
|
-
color: inherit;
|
|
59
|
-
text-decoration: none;
|
|
60
|
-
}
|
|
71
|
+
a { color: inherit; text-decoration: none; }
|
|
61
72
|
|
|
73
|
+
/* ── Shell ── */
|
|
62
74
|
.page-shell {
|
|
63
|
-
width: min(
|
|
64
|
-
margin:
|
|
65
|
-
|
|
66
|
-
z-index: 1;
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
/* ── Cards / surfaces ── */
|
|
70
|
-
|
|
71
|
-
.example-header,
|
|
72
|
-
.view-frame,
|
|
73
|
-
.section-card,
|
|
74
|
-
.hero-copy,
|
|
75
|
-
.hero-aside,
|
|
76
|
-
.info-card,
|
|
77
|
-
.stat-card {
|
|
78
|
-
border: 1px solid var(--line);
|
|
79
|
-
border-radius: var(--radius-xl);
|
|
80
|
-
background: var(--surface);
|
|
81
|
-
box-shadow: var(--shadow-soft);
|
|
75
|
+
width: min(1120px, calc(100% - 40px));
|
|
76
|
+
margin: 0 auto;
|
|
77
|
+
padding-bottom: 64px;
|
|
82
78
|
}
|
|
83
79
|
|
|
80
|
+
/* ── Header — sticky frosted glass ── */
|
|
84
81
|
.example-header {
|
|
85
|
-
|
|
86
|
-
|
|
82
|
+
position: sticky;
|
|
83
|
+
top: 0;
|
|
84
|
+
z-index: 100;
|
|
85
|
+
background: rgba(255, 255, 255, 0.82);
|
|
86
|
+
backdrop-filter: blur(14px) saturate(180%);
|
|
87
|
+
-webkit-backdrop-filter: blur(14px) saturate(180%);
|
|
88
|
+
border-bottom: 1px solid var(--border);
|
|
87
89
|
}
|
|
88
90
|
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
.header-note {
|
|
92
|
-
display: flex;
|
|
93
|
-
align-items: center;
|
|
94
|
-
justify-content: space-between;
|
|
95
|
-
gap: 16px;
|
|
96
|
-
padding: 0 0 16px;
|
|
97
|
-
margin-bottom: 20px;
|
|
98
|
-
border-bottom: 1px solid var(--line);
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
.header-note p {
|
|
102
|
-
margin: 0;
|
|
103
|
-
max-width: 720px;
|
|
104
|
-
color: var(--muted);
|
|
105
|
-
font-size: 0.88rem;
|
|
106
|
-
line-height: 1.65;
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
/* ── Badges / labels ── */
|
|
110
|
-
|
|
111
|
-
.example-pill,
|
|
112
|
-
.section-label,
|
|
113
|
-
.hero-badge {
|
|
114
|
-
display: inline-flex;
|
|
115
|
-
align-items: center;
|
|
116
|
-
gap: 6px;
|
|
117
|
-
padding: 5px 11px;
|
|
118
|
-
border-radius: 999px;
|
|
119
|
-
background: var(--accent-soft);
|
|
120
|
-
color: var(--accent-strong);
|
|
121
|
-
font-size: 0.72rem;
|
|
122
|
-
font-weight: 700;
|
|
123
|
-
letter-spacing: 0.08em;
|
|
124
|
-
text-transform: uppercase;
|
|
125
|
-
}
|
|
126
|
-
|
|
127
|
-
/* ── Header layout ── */
|
|
91
|
+
.header-note { display: none; }
|
|
128
92
|
|
|
129
93
|
.header-main {
|
|
130
94
|
display: grid;
|
|
131
95
|
grid-template-columns: auto 1fr auto;
|
|
132
96
|
align-items: center;
|
|
133
|
-
|
|
97
|
+
height: 56px;
|
|
98
|
+
padding: 0 24px;
|
|
134
99
|
}
|
|
135
100
|
|
|
136
101
|
.brand-link {
|
|
137
102
|
display: flex;
|
|
138
103
|
align-items: center;
|
|
139
|
-
gap:
|
|
104
|
+
gap: 10px;
|
|
105
|
+
padding-right: 20px;
|
|
106
|
+
border-right: 1px solid var(--border);
|
|
107
|
+
flex-shrink: 0;
|
|
140
108
|
}
|
|
141
109
|
|
|
142
110
|
.brand-mark {
|
|
143
|
-
width:
|
|
144
|
-
height:
|
|
111
|
+
width: 26px;
|
|
112
|
+
height: 26px;
|
|
145
113
|
display: grid;
|
|
146
114
|
place-items: center;
|
|
147
|
-
border-radius:
|
|
148
|
-
background: var(--
|
|
149
|
-
color: #
|
|
150
|
-
font-size: 0.
|
|
115
|
+
border-radius: 6px;
|
|
116
|
+
background: var(--text);
|
|
117
|
+
color: #fff;
|
|
118
|
+
font-size: 0.62rem;
|
|
151
119
|
font-weight: 700;
|
|
152
|
-
letter-spacing: 0.
|
|
120
|
+
letter-spacing: 0.04em;
|
|
153
121
|
flex-shrink: 0;
|
|
154
|
-
box-shadow: 0 4px 14px rgba(79, 70, 229, 0.28);
|
|
155
122
|
}
|
|
156
123
|
|
|
157
124
|
.brand-copy {
|
|
158
|
-
display:
|
|
159
|
-
|
|
125
|
+
display: flex;
|
|
126
|
+
align-items: center;
|
|
127
|
+
gap: 8px;
|
|
160
128
|
}
|
|
161
129
|
|
|
162
130
|
.brand-copy strong {
|
|
163
|
-
font-size:
|
|
164
|
-
font-weight:
|
|
131
|
+
font-size: 0.9rem;
|
|
132
|
+
font-weight: 600;
|
|
165
133
|
letter-spacing: -0.02em;
|
|
166
134
|
line-height: 1;
|
|
167
135
|
}
|
|
168
136
|
|
|
169
137
|
.brand-copy span,
|
|
170
138
|
.brand-copy small {
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
139
|
+
font-size: 0.76rem;
|
|
140
|
+
color: var(--text-3);
|
|
141
|
+
padding-left: 8px;
|
|
142
|
+
border-left: 1px solid var(--border);
|
|
143
|
+
line-height: 1;
|
|
174
144
|
}
|
|
175
145
|
|
|
176
|
-
/* ──
|
|
177
|
-
|
|
146
|
+
/* ── Nav ── */
|
|
178
147
|
.site-nav {
|
|
179
148
|
display: flex;
|
|
180
149
|
justify-content: center;
|
|
181
|
-
|
|
182
|
-
gap:
|
|
150
|
+
align-items: center;
|
|
151
|
+
gap: 2px;
|
|
152
|
+
padding: 0 16px;
|
|
183
153
|
}
|
|
184
154
|
|
|
185
155
|
.site-link {
|
|
186
|
-
display:
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
padding:
|
|
190
|
-
border-radius: var(--
|
|
191
|
-
|
|
156
|
+
display: flex;
|
|
157
|
+
align-items: center;
|
|
158
|
+
height: 32px;
|
|
159
|
+
padding: 0 12px;
|
|
160
|
+
border-radius: var(--r-md);
|
|
161
|
+
font-size: 0.84rem;
|
|
162
|
+
font-weight: 500;
|
|
163
|
+
color: var(--text-2);
|
|
164
|
+
transition: background 130ms ease, color 130ms ease;
|
|
165
|
+
border: none;
|
|
192
166
|
background: transparent;
|
|
193
|
-
|
|
194
|
-
background 160ms ease,
|
|
195
|
-
border-color 160ms ease;
|
|
196
|
-
}
|
|
197
|
-
|
|
198
|
-
.site-link span {
|
|
199
|
-
font-size: 0.88rem;
|
|
200
|
-
font-weight: 600;
|
|
201
|
-
letter-spacing: -0.01em;
|
|
167
|
+
white-space: nowrap;
|
|
202
168
|
}
|
|
203
169
|
|
|
204
|
-
.site-link small {
|
|
205
|
-
color: var(--muted);
|
|
206
|
-
font-size: 0.74rem;
|
|
207
|
-
line-height: 1.35;
|
|
208
|
-
}
|
|
170
|
+
.site-link small { display: none; }
|
|
209
171
|
|
|
210
172
|
.site-link:hover {
|
|
211
|
-
background: var(--
|
|
212
|
-
|
|
173
|
+
background: var(--bg-3);
|
|
174
|
+
color: var(--text);
|
|
213
175
|
}
|
|
214
176
|
|
|
215
177
|
.site-link.is-active {
|
|
216
|
-
background: var(--
|
|
217
|
-
|
|
178
|
+
background: var(--bg-2);
|
|
179
|
+
color: var(--text);
|
|
180
|
+
font-weight: 600;
|
|
218
181
|
}
|
|
219
182
|
|
|
220
|
-
.site-link
|
|
221
|
-
|
|
222
|
-
}
|
|
183
|
+
.site-link[data-asjs-prefetched="true"] { color: var(--accent); }
|
|
184
|
+
|
|
185
|
+
.site-link:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
|
|
223
186
|
|
|
224
|
-
.
|
|
225
|
-
|
|
187
|
+
.header-cta {
|
|
188
|
+
padding-left: 20px;
|
|
189
|
+
border-left: 1px solid var(--border);
|
|
190
|
+
flex-shrink: 0;
|
|
226
191
|
}
|
|
227
192
|
|
|
228
193
|
/* ── Buttons ── */
|
|
229
|
-
|
|
230
194
|
.button {
|
|
231
195
|
display: inline-flex;
|
|
232
196
|
align-items: center;
|
|
233
197
|
justify-content: center;
|
|
234
|
-
|
|
235
|
-
padding:
|
|
236
|
-
border-radius:
|
|
237
|
-
border: 1px solid var(--
|
|
198
|
+
height: 36px;
|
|
199
|
+
padding: 0 16px;
|
|
200
|
+
border-radius: var(--r-md);
|
|
201
|
+
border: 1px solid var(--border-2);
|
|
238
202
|
font-family: inherit;
|
|
239
|
-
font-size: 0.
|
|
240
|
-
font-weight:
|
|
241
|
-
letter-spacing: -0.01em;
|
|
203
|
+
font-size: 0.84rem;
|
|
204
|
+
font-weight: 500;
|
|
242
205
|
cursor: pointer;
|
|
243
|
-
transition:
|
|
244
|
-
|
|
245
|
-
box-shadow 160ms ease,
|
|
246
|
-
background 160ms ease,
|
|
247
|
-
border-color 160ms ease;
|
|
248
|
-
}
|
|
249
|
-
|
|
250
|
-
.button:hover {
|
|
251
|
-
transform: translateY(-1px);
|
|
252
|
-
box-shadow: var(--shadow-soft);
|
|
206
|
+
transition: background 130ms ease, border-color 130ms ease, box-shadow 130ms ease;
|
|
207
|
+
white-space: nowrap;
|
|
253
208
|
}
|
|
254
209
|
|
|
255
|
-
.button:focus-visible
|
|
256
|
-
.
|
|
257
|
-
.
|
|
258
|
-
.inline-link:focus-visible {
|
|
259
|
-
outline: 2px solid var(--accent);
|
|
260
|
-
outline-offset: 2px;
|
|
261
|
-
}
|
|
210
|
+
.button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
|
|
211
|
+
.brand-link:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
|
|
212
|
+
.inline-link:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
|
|
262
213
|
|
|
263
214
|
.button-primary {
|
|
264
|
-
|
|
265
|
-
background: var(--accent);
|
|
215
|
+
background: var(--text);
|
|
266
216
|
color: #ffffff;
|
|
267
|
-
|
|
217
|
+
border-color: var(--text);
|
|
218
|
+
box-shadow: var(--shadow-sm);
|
|
268
219
|
}
|
|
269
220
|
|
|
270
221
|
.button-primary:hover {
|
|
271
|
-
background:
|
|
272
|
-
border-color:
|
|
273
|
-
box-shadow: 0 6px 20px rgba(79, 70, 229, 0.28);
|
|
222
|
+
background: #333;
|
|
223
|
+
border-color: #333;
|
|
274
224
|
}
|
|
275
225
|
|
|
276
226
|
.button-secondary {
|
|
277
227
|
background: var(--surface);
|
|
278
228
|
color: var(--text);
|
|
279
|
-
border-color: var(--
|
|
229
|
+
border-color: var(--border-2);
|
|
280
230
|
}
|
|
281
231
|
|
|
282
|
-
.
|
|
283
|
-
|
|
232
|
+
.button-secondary:hover {
|
|
233
|
+
background: var(--bg-2);
|
|
284
234
|
}
|
|
285
235
|
|
|
286
236
|
/* ── View frame ── */
|
|
287
|
-
|
|
288
237
|
.view-frame {
|
|
289
|
-
margin-top:
|
|
290
|
-
|
|
291
|
-
|
|
238
|
+
margin-top: 48px;
|
|
239
|
+
background: none;
|
|
240
|
+
border: none;
|
|
241
|
+
box-shadow: none;
|
|
242
|
+
padding: 0;
|
|
292
243
|
}
|
|
293
244
|
|
|
294
|
-
[data-asjs-view] {
|
|
295
|
-
animation: reveal 240ms ease;
|
|
296
|
-
}
|
|
245
|
+
[data-asjs-view] { animation: reveal 200ms ease; }
|
|
297
246
|
|
|
298
247
|
/* ── Route loader ── */
|
|
299
|
-
|
|
300
248
|
.route-loader {
|
|
301
249
|
position: fixed;
|
|
302
|
-
inset: auto
|
|
303
|
-
width: min(
|
|
250
|
+
inset: auto 20px 20px auto;
|
|
251
|
+
width: min(340px, calc(100% - 32px));
|
|
304
252
|
opacity: 0;
|
|
305
|
-
transform: translateY(
|
|
253
|
+
transform: translateY(8px);
|
|
306
254
|
pointer-events: none;
|
|
307
|
-
transition: opacity
|
|
308
|
-
z-index:
|
|
255
|
+
transition: opacity 180ms ease, transform 180ms ease;
|
|
256
|
+
z-index: 200;
|
|
309
257
|
}
|
|
310
258
|
|
|
311
259
|
html.asjs-loading .route-loader {
|
|
@@ -314,224 +262,400 @@ html.asjs-loading .route-loader {
|
|
|
314
262
|
}
|
|
315
263
|
|
|
316
264
|
.route-loader-card {
|
|
317
|
-
padding: 18px;
|
|
318
|
-
border-radius: var(--
|
|
319
|
-
border: 1px solid var(--
|
|
320
|
-
background:
|
|
321
|
-
|
|
265
|
+
padding: 16px 18px;
|
|
266
|
+
border-radius: var(--r-lg);
|
|
267
|
+
border: 1px solid var(--border);
|
|
268
|
+
background: rgba(255,255,255,0.96);
|
|
269
|
+
backdrop-filter: blur(12px);
|
|
270
|
+
box-shadow: var(--shadow-md);
|
|
322
271
|
}
|
|
323
272
|
|
|
324
273
|
.route-loader-label {
|
|
325
274
|
display: inline-flex;
|
|
326
|
-
padding:
|
|
327
|
-
border-radius:
|
|
328
|
-
background: var(--
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
font-
|
|
332
|
-
|
|
275
|
+
padding: 3px 8px;
|
|
276
|
+
border-radius: var(--r-sm);
|
|
277
|
+
background: var(--bg-3);
|
|
278
|
+
border: 1px solid var(--border);
|
|
279
|
+
color: var(--text-3);
|
|
280
|
+
font-size: 0.68rem;
|
|
281
|
+
font-weight: 600;
|
|
282
|
+
letter-spacing: 0.06em;
|
|
333
283
|
text-transform: uppercase;
|
|
334
284
|
}
|
|
335
285
|
|
|
336
286
|
.route-loader-card strong {
|
|
337
287
|
display: block;
|
|
338
|
-
margin-top:
|
|
339
|
-
font-size:
|
|
340
|
-
font-weight:
|
|
341
|
-
letter-spacing: -0.
|
|
288
|
+
margin-top: 10px;
|
|
289
|
+
font-size: 0.9rem;
|
|
290
|
+
font-weight: 600;
|
|
291
|
+
letter-spacing: -0.01em;
|
|
342
292
|
}
|
|
343
293
|
|
|
344
294
|
.route-loader-card p,
|
|
345
295
|
.render-note,
|
|
346
296
|
.render-stamp {
|
|
347
|
-
color: var(--
|
|
297
|
+
color: var(--text-3);
|
|
348
298
|
}
|
|
349
299
|
|
|
350
300
|
.route-loader-card p {
|
|
351
|
-
margin:
|
|
352
|
-
font-size: 0.
|
|
353
|
-
line-height: 1.
|
|
301
|
+
margin: 6px 0 0;
|
|
302
|
+
font-size: 0.8rem;
|
|
303
|
+
line-height: 1.5;
|
|
354
304
|
}
|
|
355
305
|
|
|
356
306
|
.route-loader-skeleton {
|
|
357
307
|
display: grid;
|
|
358
|
-
gap:
|
|
359
|
-
margin-top:
|
|
308
|
+
gap: 6px;
|
|
309
|
+
margin-top: 12px;
|
|
360
310
|
}
|
|
361
311
|
|
|
362
312
|
.route-loader-skeleton span {
|
|
363
313
|
display: block;
|
|
364
|
-
height:
|
|
314
|
+
height: 7px;
|
|
365
315
|
border-radius: 999px;
|
|
366
|
-
background: linear-gradient(90deg, var(--
|
|
367
|
-
background-size:
|
|
368
|
-
animation: shimmer 1.
|
|
316
|
+
background: linear-gradient(90deg, var(--bg-3) 25%, var(--border-2) 50%, var(--bg-3) 75%);
|
|
317
|
+
background-size: 200% 100%;
|
|
318
|
+
animation: shimmer 1.4s ease-in-out infinite;
|
|
319
|
+
}
|
|
320
|
+
|
|
321
|
+
.route-loader-skeleton span:nth-child(2) { width: 76%; }
|
|
322
|
+
.route-loader-skeleton span:nth-child(3) { width: 54%; }
|
|
323
|
+
|
|
324
|
+
/* ── Page intro / hero heading ── */
|
|
325
|
+
.page-intro {
|
|
326
|
+
padding: 56px 0 32px;
|
|
327
|
+
max-width: 680px;
|
|
328
|
+
}
|
|
329
|
+
|
|
330
|
+
.page-intro h1,
|
|
331
|
+
.hero-copy h1,
|
|
332
|
+
.not-found-panel h1 {
|
|
333
|
+
margin: 0 0 14px;
|
|
334
|
+
font-size: clamp(2rem, 4.5vw, 3.4rem);
|
|
335
|
+
font-weight: 700;
|
|
336
|
+
letter-spacing: -0.05em;
|
|
337
|
+
line-height: 1.04;
|
|
338
|
+
color: var(--text);
|
|
369
339
|
}
|
|
370
340
|
|
|
371
|
-
.
|
|
372
|
-
|
|
341
|
+
.page-intro p,
|
|
342
|
+
.hero-copy p {
|
|
343
|
+
margin: 0;
|
|
344
|
+
font-size: 1.02rem;
|
|
345
|
+
color: var(--text-2);
|
|
346
|
+
line-height: 1.75;
|
|
373
347
|
}
|
|
374
348
|
|
|
375
|
-
.
|
|
376
|
-
|
|
349
|
+
.hero-actions {
|
|
350
|
+
display: flex;
|
|
351
|
+
align-items: center;
|
|
352
|
+
gap: 10px;
|
|
353
|
+
margin-top: 28px;
|
|
354
|
+
flex-wrap: wrap;
|
|
377
355
|
}
|
|
378
356
|
|
|
379
|
-
/* ──
|
|
357
|
+
/* ── Badge / label ── */
|
|
358
|
+
.section-label,
|
|
359
|
+
.hero-badge,
|
|
360
|
+
.example-pill {
|
|
361
|
+
display: inline-flex;
|
|
362
|
+
align-items: center;
|
|
363
|
+
padding: 3px 9px;
|
|
364
|
+
border-radius: var(--r-sm);
|
|
365
|
+
border: 1px solid var(--border);
|
|
366
|
+
background: var(--bg-2);
|
|
367
|
+
font-size: 0.7rem;
|
|
368
|
+
font-weight: 600;
|
|
369
|
+
color: var(--text-2);
|
|
370
|
+
letter-spacing: 0.05em;
|
|
371
|
+
text-transform: uppercase;
|
|
372
|
+
margin-bottom: 14px;
|
|
373
|
+
}
|
|
380
374
|
|
|
381
|
-
|
|
375
|
+
/* ── Section card ── */
|
|
376
|
+
.section-card {
|
|
377
|
+
border: 1px solid var(--border);
|
|
378
|
+
border-radius: var(--r-xl);
|
|
379
|
+
background: var(--surface);
|
|
380
|
+
padding: 32px;
|
|
381
|
+
margin-top: 16px;
|
|
382
|
+
position: relative;
|
|
383
|
+
overflow: hidden;
|
|
384
|
+
}
|
|
385
|
+
|
|
386
|
+
.section-card h2,
|
|
387
|
+
.section-header h2 {
|
|
388
|
+
margin: 0 0 10px;
|
|
389
|
+
font-size: clamp(1.2rem, 2vw, 1.65rem);
|
|
390
|
+
font-weight: 700;
|
|
391
|
+
letter-spacing: -0.04em;
|
|
392
|
+
line-height: 1.2;
|
|
393
|
+
}
|
|
394
|
+
|
|
395
|
+
.section-card p {
|
|
396
|
+
margin: 0 0 18px;
|
|
397
|
+
color: var(--text-2);
|
|
398
|
+
line-height: 1.75;
|
|
399
|
+
}
|
|
400
|
+
|
|
401
|
+
.section-card p:last-child { margin-bottom: 0; }
|
|
402
|
+
.section-header { margin-bottom: 16px; }
|
|
403
|
+
|
|
404
|
+
.section,
|
|
382
405
|
.split-layout,
|
|
406
|
+
.page-intro {
|
|
407
|
+
position: relative;
|
|
408
|
+
}
|
|
409
|
+
|
|
410
|
+
.compact-section { margin-top: 10px; }
|
|
411
|
+
|
|
412
|
+
/* ── Card grids — hairline separator style ── */
|
|
383
413
|
.card-grid,
|
|
384
414
|
.stats-grid,
|
|
385
|
-
.render-summary-grid,
|
|
386
|
-
.dashboard-grid,
|
|
387
|
-
.metric-grid,
|
|
388
415
|
.catalog-grid,
|
|
389
|
-
.
|
|
390
|
-
.
|
|
391
|
-
.signal-list
|
|
416
|
+
.metric-grid,
|
|
417
|
+
.activity-list,
|
|
418
|
+
.signal-list,
|
|
419
|
+
.product-facts {
|
|
392
420
|
display: grid;
|
|
393
|
-
gap:
|
|
421
|
+
gap: 1px;
|
|
422
|
+
background: var(--border);
|
|
423
|
+
border: 1px solid var(--border);
|
|
424
|
+
border-radius: var(--r-xl);
|
|
425
|
+
overflow: hidden;
|
|
394
426
|
}
|
|
395
427
|
|
|
396
|
-
.
|
|
397
|
-
|
|
398
|
-
|
|
428
|
+
.card-grid,
|
|
429
|
+
.stats-grid {
|
|
430
|
+
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
431
|
+
margin-top: 16px;
|
|
399
432
|
}
|
|
400
433
|
|
|
401
|
-
.hero-copy,
|
|
402
|
-
.hero-aside,
|
|
403
|
-
.section-card,
|
|
404
434
|
.info-card,
|
|
405
435
|
.stat-card {
|
|
406
|
-
|
|
436
|
+
background: var(--surface);
|
|
437
|
+
padding: 28px;
|
|
438
|
+
position: relative;
|
|
439
|
+
overflow: hidden;
|
|
407
440
|
}
|
|
408
441
|
|
|
409
|
-
|
|
442
|
+
.info-card h3 {
|
|
443
|
+
margin: 0 0 8px;
|
|
444
|
+
font-size: 0.9rem;
|
|
445
|
+
font-weight: 600;
|
|
446
|
+
letter-spacing: -0.01em;
|
|
447
|
+
}
|
|
410
448
|
|
|
411
|
-
.
|
|
412
|
-
|
|
413
|
-
.
|
|
414
|
-
|
|
415
|
-
.
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
.
|
|
419
|
-
.
|
|
420
|
-
|
|
449
|
+
.info-card p {
|
|
450
|
+
margin: 0;
|
|
451
|
+
font-size: 0.86rem;
|
|
452
|
+
color: var(--text-2);
|
|
453
|
+
line-height: 1.65;
|
|
454
|
+
}
|
|
455
|
+
|
|
456
|
+
.stat-card strong,
|
|
457
|
+
.contact-value {
|
|
458
|
+
display: block;
|
|
459
|
+
font-size: 1.9rem;
|
|
460
|
+
font-weight: 700;
|
|
461
|
+
letter-spacing: -0.05em;
|
|
462
|
+
color: var(--text);
|
|
463
|
+
margin-bottom: 6px;
|
|
464
|
+
}
|
|
465
|
+
|
|
466
|
+
.stat-card p {
|
|
467
|
+
margin: 0;
|
|
468
|
+
font-size: 0.84rem;
|
|
469
|
+
color: var(--text-2);
|
|
470
|
+
line-height: 1.6;
|
|
471
|
+
}
|
|
472
|
+
|
|
473
|
+
/* ── Render summary ── */
|
|
474
|
+
.render-summary-grid {
|
|
475
|
+
display: grid;
|
|
476
|
+
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
477
|
+
gap: 1px;
|
|
478
|
+
background: var(--border);
|
|
479
|
+
border: 1px solid var(--border);
|
|
480
|
+
border-radius: var(--r-lg);
|
|
421
481
|
overflow: hidden;
|
|
482
|
+
margin-top: 20px;
|
|
422
483
|
}
|
|
423
484
|
|
|
424
|
-
.
|
|
425
|
-
|
|
426
|
-
.info-card::before,
|
|
427
|
-
.stat-card::before,
|
|
428
|
-
.product-card::before,
|
|
429
|
-
.metric-panel::before,
|
|
430
|
-
.status-panel::before {
|
|
431
|
-
content: "";
|
|
432
|
-
position: absolute;
|
|
433
|
-
inset: 0 auto auto 0;
|
|
434
|
-
width: 100%;
|
|
435
|
-
height: 3px;
|
|
436
|
-
background: linear-gradient(90deg, var(--accent), rgba(79, 70, 229, 0.2));
|
|
437
|
-
opacity: 0.5;
|
|
485
|
+
.render-summary-grid--wide {
|
|
486
|
+
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
438
487
|
}
|
|
439
488
|
|
|
440
|
-
|
|
489
|
+
.render-item {
|
|
490
|
+
background: var(--surface);
|
|
491
|
+
padding: 16px 20px;
|
|
492
|
+
}
|
|
441
493
|
|
|
442
|
-
.
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
font-weight: 700;
|
|
494
|
+
.render-item span {
|
|
495
|
+
display: block;
|
|
496
|
+
font-size: 0.7rem;
|
|
497
|
+
font-weight: 600;
|
|
498
|
+
color: var(--text-3);
|
|
499
|
+
letter-spacing: 0.06em;
|
|
500
|
+
text-transform: uppercase;
|
|
501
|
+
margin-bottom: 4px;
|
|
451
502
|
}
|
|
452
503
|
|
|
453
|
-
.
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
font-
|
|
504
|
+
.render-item strong {
|
|
505
|
+
display: block;
|
|
506
|
+
font-size: 0.88rem;
|
|
507
|
+
font-weight: 600;
|
|
508
|
+
color: var(--text);
|
|
457
509
|
}
|
|
458
510
|
|
|
459
|
-
.
|
|
460
|
-
|
|
461
|
-
font-size:
|
|
511
|
+
.render-note {
|
|
512
|
+
margin-top: 14px;
|
|
513
|
+
font-size: 0.84rem;
|
|
514
|
+
color: var(--text-2);
|
|
515
|
+
line-height: 1.7;
|
|
462
516
|
}
|
|
463
517
|
|
|
464
|
-
.
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
.footer,
|
|
469
|
-
.flow-list li,
|
|
470
|
-
.check-list li {
|
|
471
|
-
color: var(--muted);
|
|
472
|
-
line-height: 1.75;
|
|
518
|
+
.render-stamp {
|
|
519
|
+
display: inline-block;
|
|
520
|
+
margin-top: 8px;
|
|
521
|
+
font-size: 0.76rem;
|
|
473
522
|
}
|
|
474
523
|
|
|
475
|
-
|
|
524
|
+
.render-band {
|
|
525
|
+
background: var(--bg-2);
|
|
526
|
+
border: 1px solid var(--border);
|
|
527
|
+
border-radius: var(--r-md);
|
|
528
|
+
padding: 16px;
|
|
529
|
+
margin-top: 12px;
|
|
530
|
+
}
|
|
476
531
|
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
532
|
+
/* ── Code ── */
|
|
533
|
+
.code-block,
|
|
534
|
+
.mono-list {
|
|
535
|
+
font-family: "Geist Mono", "Cascadia Code", "Consolas", ui-monospace, monospace;
|
|
536
|
+
}
|
|
537
|
+
|
|
538
|
+
.code-block {
|
|
539
|
+
margin: 16px 0 0;
|
|
540
|
+
padding: 20px;
|
|
541
|
+
border-radius: var(--r-md);
|
|
542
|
+
background: #0a0a0a;
|
|
543
|
+
color: #ededed;
|
|
544
|
+
border: 1px solid #262626;
|
|
545
|
+
white-space: pre-wrap;
|
|
546
|
+
word-break: break-word;
|
|
547
|
+
font-size: 0.82rem;
|
|
548
|
+
line-height: 1.72;
|
|
549
|
+
}
|
|
550
|
+
|
|
551
|
+
.code-panel { background: var(--surface); }
|
|
552
|
+
|
|
553
|
+
code {
|
|
554
|
+
font-family: "Geist Mono", "Cascadia Code", "Consolas", ui-monospace, monospace;
|
|
555
|
+
font-size: 0.85em;
|
|
556
|
+
background: var(--bg-3);
|
|
557
|
+
color: var(--text);
|
|
558
|
+
padding: 2px 6px;
|
|
559
|
+
border-radius: 4px;
|
|
560
|
+
border: 1px solid var(--border);
|
|
561
|
+
}
|
|
562
|
+
|
|
563
|
+
/* ── Lists ── */
|
|
564
|
+
.check-list,
|
|
565
|
+
.flow-list {
|
|
566
|
+
margin: 16px 0 0;
|
|
567
|
+
padding-left: 20px;
|
|
568
|
+
display: grid;
|
|
480
569
|
gap: 10px;
|
|
481
|
-
margin-top: 24px;
|
|
482
570
|
}
|
|
483
571
|
|
|
484
|
-
.
|
|
485
|
-
|
|
572
|
+
.check-list li,
|
|
573
|
+
.flow-list li {
|
|
574
|
+
font-size: 0.9rem;
|
|
575
|
+
color: var(--text-2);
|
|
576
|
+
line-height: 1.65;
|
|
577
|
+
}
|
|
578
|
+
|
|
579
|
+
.check-list li::marker,
|
|
580
|
+
.flow-list li::marker { color: var(--accent); }
|
|
581
|
+
|
|
582
|
+
/* ── Layouts ── */
|
|
583
|
+
.split-layout {
|
|
584
|
+
display: grid;
|
|
585
|
+
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
586
|
+
gap: 16px;
|
|
587
|
+
margin-top: 16px;
|
|
588
|
+
}
|
|
589
|
+
|
|
590
|
+
.hero {
|
|
591
|
+
display: grid;
|
|
592
|
+
grid-template-columns: 1.2fr 0.8fr;
|
|
593
|
+
gap: 16px;
|
|
486
594
|
align-items: stretch;
|
|
595
|
+
margin-top: 16px;
|
|
487
596
|
}
|
|
488
597
|
|
|
489
|
-
.
|
|
490
|
-
width: 100%;
|
|
598
|
+
.hero-copy {
|
|
491
599
|
background: var(--surface);
|
|
600
|
+
border: 1px solid var(--border);
|
|
601
|
+
border-radius: var(--r-xl);
|
|
602
|
+
padding: 36px;
|
|
603
|
+
position: relative;
|
|
604
|
+
overflow: hidden;
|
|
492
605
|
}
|
|
493
606
|
|
|
494
|
-
|
|
607
|
+
.hero-aside {
|
|
608
|
+
background: var(--surface);
|
|
609
|
+
border: 1px solid var(--border);
|
|
610
|
+
border-radius: var(--r-xl);
|
|
611
|
+
padding: 28px;
|
|
612
|
+
display: flex;
|
|
613
|
+
align-items: stretch;
|
|
614
|
+
}
|
|
495
615
|
|
|
616
|
+
.render-panel { width: 100%; }
|
|
617
|
+
|
|
618
|
+
/* ── Dashboard ── */
|
|
496
619
|
.dashboard-grid {
|
|
497
|
-
|
|
498
|
-
|
|
620
|
+
display: grid;
|
|
621
|
+
grid-template-columns: 1.12fr 0.88fr;
|
|
622
|
+
gap: 16px;
|
|
623
|
+
margin-top: 16px;
|
|
499
624
|
}
|
|
500
625
|
|
|
501
626
|
.metric-grid {
|
|
502
627
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
628
|
+
margin-top: 0;
|
|
503
629
|
}
|
|
504
630
|
|
|
505
631
|
.metric-panel {
|
|
506
|
-
padding: 18px;
|
|
507
|
-
border-radius: var(--radius-lg);
|
|
508
|
-
border: 1px solid var(--line);
|
|
509
632
|
background: var(--surface);
|
|
510
|
-
|
|
633
|
+
padding: 20px 24px;
|
|
511
634
|
}
|
|
512
635
|
|
|
513
636
|
.metric-panel span,
|
|
514
637
|
.activity-time,
|
|
515
638
|
.product-chip,
|
|
516
639
|
.status-pill,
|
|
517
|
-
.status-summary span,
|
|
518
640
|
.submitted-brief span,
|
|
519
641
|
.field-group span,
|
|
642
|
+
.status-summary span,
|
|
520
643
|
.inline-response-meta strong {
|
|
521
644
|
display: inline-flex;
|
|
522
|
-
|
|
523
|
-
font-
|
|
524
|
-
|
|
525
|
-
letter-spacing: 0.08em;
|
|
645
|
+
font-size: 0.68rem;
|
|
646
|
+
font-weight: 600;
|
|
647
|
+
letter-spacing: 0.06em;
|
|
526
648
|
text-transform: uppercase;
|
|
649
|
+
color: var(--text-3);
|
|
527
650
|
}
|
|
528
651
|
|
|
529
652
|
.metric-panel strong {
|
|
530
653
|
display: block;
|
|
531
|
-
margin-top:
|
|
532
|
-
font-size: 1.
|
|
654
|
+
margin-top: 8px;
|
|
655
|
+
font-size: 1.85rem;
|
|
533
656
|
font-weight: 700;
|
|
534
657
|
letter-spacing: -0.05em;
|
|
658
|
+
color: var(--text);
|
|
535
659
|
}
|
|
536
660
|
|
|
537
661
|
.metric-panel p,
|
|
@@ -541,33 +665,33 @@ html.asjs-loading .route-loader {
|
|
|
541
665
|
.status-panel p,
|
|
542
666
|
.submitted-brief p,
|
|
543
667
|
.quick-check-panel p {
|
|
544
|
-
margin:
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
line-height: 1.
|
|
668
|
+
margin: 6px 0 0;
|
|
669
|
+
font-size: 0.82rem;
|
|
670
|
+
color: var(--text-2);
|
|
671
|
+
line-height: 1.6;
|
|
548
672
|
}
|
|
549
673
|
|
|
550
674
|
.activity-list {
|
|
551
|
-
|
|
552
|
-
gap: 12px;
|
|
675
|
+
border-radius: var(--r-lg);
|
|
553
676
|
margin-top: 16px;
|
|
554
677
|
}
|
|
555
678
|
|
|
556
679
|
.activity-item {
|
|
557
680
|
display: grid;
|
|
558
|
-
grid-template-columns:
|
|
559
|
-
gap:
|
|
560
|
-
padding: 16px;
|
|
561
|
-
border-radius: var(--radius-md);
|
|
562
|
-
border: 1px solid var(--line);
|
|
681
|
+
grid-template-columns: 76px 1fr;
|
|
682
|
+
gap: 14px;
|
|
683
|
+
padding: 16px 20px;
|
|
563
684
|
background: var(--surface);
|
|
685
|
+
position: relative;
|
|
686
|
+
overflow: hidden;
|
|
564
687
|
}
|
|
565
688
|
|
|
566
689
|
.activity-time {
|
|
567
690
|
align-self: start;
|
|
568
|
-
padding:
|
|
569
|
-
border-radius:
|
|
570
|
-
background: var(--
|
|
691
|
+
padding: 3px 7px;
|
|
692
|
+
border-radius: var(--r-sm);
|
|
693
|
+
background: var(--bg-3);
|
|
694
|
+
border: 1px solid var(--border);
|
|
571
695
|
}
|
|
572
696
|
|
|
573
697
|
.activity-item h3,
|
|
@@ -576,31 +700,32 @@ html.asjs-loading .route-loader {
|
|
|
576
700
|
.status-panel h3,
|
|
577
701
|
.quick-check-panel h3 {
|
|
578
702
|
margin: 0;
|
|
579
|
-
font-size:
|
|
580
|
-
font-weight:
|
|
581
|
-
letter-spacing: -0.
|
|
703
|
+
font-size: 0.9rem;
|
|
704
|
+
font-weight: 600;
|
|
705
|
+
letter-spacing: -0.01em;
|
|
582
706
|
}
|
|
583
707
|
|
|
584
708
|
.signal-list {
|
|
585
|
-
|
|
709
|
+
border-radius: var(--r-lg);
|
|
586
710
|
}
|
|
587
711
|
|
|
588
712
|
.signal-item {
|
|
589
|
-
padding: 18px;
|
|
590
|
-
border-radius: var(--radius-md);
|
|
591
|
-
border: 1px solid var(--line);
|
|
713
|
+
padding: 18px 20px;
|
|
592
714
|
background: var(--surface);
|
|
593
715
|
}
|
|
594
716
|
|
|
595
|
-
/* ──
|
|
596
|
-
|
|
717
|
+
/* ── Products ── */
|
|
597
718
|
.catalog-grid {
|
|
598
719
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
599
|
-
|
|
720
|
+
border-radius: var(--r-xl);
|
|
721
|
+
margin-top: 16px;
|
|
600
722
|
}
|
|
601
723
|
|
|
602
724
|
.product-card {
|
|
603
725
|
background: var(--surface);
|
|
726
|
+
padding: 24px;
|
|
727
|
+
position: relative;
|
|
728
|
+
overflow: hidden;
|
|
604
729
|
}
|
|
605
730
|
|
|
606
731
|
.product-card-head {
|
|
@@ -612,72 +737,76 @@ html.asjs-loading .route-loader {
|
|
|
612
737
|
|
|
613
738
|
.product-chip,
|
|
614
739
|
.status-pill {
|
|
615
|
-
padding:
|
|
616
|
-
border-radius:
|
|
617
|
-
background: var(--
|
|
618
|
-
|
|
740
|
+
padding: 3px 8px;
|
|
741
|
+
border-radius: var(--r-sm);
|
|
742
|
+
background: var(--bg-3);
|
|
743
|
+
border: 1px solid var(--border);
|
|
619
744
|
}
|
|
620
745
|
|
|
621
746
|
.product-card > p {
|
|
622
747
|
margin-top: 12px;
|
|
748
|
+
font-size: 0.86rem;
|
|
749
|
+
color: var(--text-2);
|
|
750
|
+
line-height: 1.65;
|
|
623
751
|
}
|
|
624
752
|
|
|
625
753
|
.product-facts {
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
margin: 16px 0 0;
|
|
754
|
+
margin-top: 14px;
|
|
755
|
+
border-radius: var(--r-sm);
|
|
629
756
|
}
|
|
630
757
|
|
|
631
758
|
.product-facts div,
|
|
632
759
|
.status-summary div,
|
|
633
760
|
.inline-response-meta span {
|
|
634
|
-
padding:
|
|
635
|
-
|
|
636
|
-
border: 1px solid var(--line);
|
|
637
|
-
background: var(--surface-soft);
|
|
761
|
+
padding: 10px 14px;
|
|
762
|
+
background: var(--bg-2);
|
|
638
763
|
}
|
|
639
764
|
|
|
640
765
|
.product-facts dt {
|
|
641
|
-
|
|
642
|
-
font-
|
|
643
|
-
|
|
644
|
-
letter-spacing: 0.
|
|
766
|
+
font-size: 0.68rem;
|
|
767
|
+
font-weight: 600;
|
|
768
|
+
color: var(--text-3);
|
|
769
|
+
letter-spacing: 0.06em;
|
|
645
770
|
text-transform: uppercase;
|
|
646
771
|
}
|
|
647
772
|
|
|
648
773
|
.product-facts dd,
|
|
649
|
-
.status-summary strong
|
|
650
|
-
|
|
651
|
-
|
|
774
|
+
.status-summary strong {
|
|
775
|
+
margin: 4px 0 0;
|
|
776
|
+
font-size: 0.88rem;
|
|
652
777
|
font-weight: 600;
|
|
653
|
-
|
|
778
|
+
color: var(--text);
|
|
654
779
|
}
|
|
655
780
|
|
|
656
781
|
.product-note {
|
|
657
|
-
padding-top:
|
|
658
|
-
|
|
782
|
+
padding-top: 12px;
|
|
783
|
+
margin-top: 12px;
|
|
784
|
+
border-top: 1px solid var(--border);
|
|
785
|
+
font-size: 0.82rem;
|
|
786
|
+
color: var(--text-2);
|
|
659
787
|
}
|
|
660
788
|
|
|
661
789
|
.api-grid {
|
|
790
|
+
display: grid;
|
|
662
791
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
792
|
+
gap: 16px;
|
|
663
793
|
margin-top: 16px;
|
|
664
794
|
}
|
|
665
795
|
|
|
666
796
|
/* ── Forms ── */
|
|
667
|
-
|
|
668
|
-
.form-panel {
|
|
669
|
-
background: var(--surface);
|
|
670
|
-
}
|
|
797
|
+
.form-panel { background: var(--surface); }
|
|
671
798
|
|
|
672
799
|
.webas-form,
|
|
673
800
|
.quick-check-form {
|
|
674
801
|
display: grid;
|
|
675
802
|
gap: 16px;
|
|
676
|
-
margin-top:
|
|
803
|
+
margin-top: 20px;
|
|
677
804
|
}
|
|
678
805
|
|
|
679
806
|
.field-grid {
|
|
807
|
+
display: grid;
|
|
680
808
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
809
|
+
gap: 16px;
|
|
681
810
|
}
|
|
682
811
|
|
|
683
812
|
.field-group {
|
|
@@ -688,436 +817,268 @@ html.asjs-loading .route-loader {
|
|
|
688
817
|
.field-group input,
|
|
689
818
|
.field-group textarea {
|
|
690
819
|
width: 100%;
|
|
691
|
-
padding:
|
|
692
|
-
border-radius: var(--
|
|
693
|
-
border: 1px solid var(--
|
|
820
|
+
padding: 9px 12px;
|
|
821
|
+
border-radius: var(--r-md);
|
|
822
|
+
border: 1px solid var(--border-2);
|
|
694
823
|
background: var(--surface);
|
|
695
824
|
color: var(--text);
|
|
696
825
|
font: inherit;
|
|
697
|
-
font-size: 0.
|
|
698
|
-
transition:
|
|
699
|
-
border-color 160ms ease,
|
|
700
|
-
box-shadow 160ms ease;
|
|
826
|
+
font-size: 0.9rem;
|
|
827
|
+
transition: border-color 130ms ease, box-shadow 130ms ease;
|
|
701
828
|
}
|
|
702
829
|
|
|
703
830
|
.field-group input::placeholder,
|
|
704
|
-
.field-group textarea::placeholder {
|
|
705
|
-
color: var(--subtle);
|
|
706
|
-
}
|
|
831
|
+
.field-group textarea::placeholder { color: var(--text-3); }
|
|
707
832
|
|
|
708
833
|
.field-group input:hover,
|
|
709
|
-
.field-group textarea:hover {
|
|
710
|
-
border-color: rgba(79, 70, 229, 0.3);
|
|
711
|
-
}
|
|
834
|
+
.field-group textarea:hover { border-color: var(--text-3); }
|
|
712
835
|
|
|
713
836
|
.field-group input:focus,
|
|
714
|
-
.field-group textarea:focus
|
|
715
|
-
.field-group input:focus-visible,
|
|
716
|
-
.field-group textarea:focus-visible {
|
|
837
|
+
.field-group textarea:focus {
|
|
717
838
|
outline: none;
|
|
718
|
-
border-color: var(--
|
|
719
|
-
box-shadow: 0 0 0 3px rgba(
|
|
839
|
+
border-color: var(--text);
|
|
840
|
+
box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.07);
|
|
720
841
|
}
|
|
721
842
|
|
|
722
843
|
.field-group textarea {
|
|
723
844
|
resize: vertical;
|
|
724
|
-
min-height:
|
|
845
|
+
min-height: 140px;
|
|
725
846
|
}
|
|
726
847
|
|
|
727
848
|
.field-error {
|
|
728
|
-
|
|
729
|
-
|
|
730
|
-
line-height: 1.
|
|
849
|
+
font-size: 0.8rem;
|
|
850
|
+
color: #dc2626;
|
|
851
|
+
line-height: 1.4;
|
|
731
852
|
}
|
|
732
853
|
|
|
733
854
|
.form-actions {
|
|
734
855
|
display: flex;
|
|
735
856
|
align-items: center;
|
|
736
857
|
justify-content: space-between;
|
|
737
|
-
gap:
|
|
858
|
+
gap: 12px;
|
|
738
859
|
flex-wrap: wrap;
|
|
860
|
+
padding-top: 8px;
|
|
739
861
|
}
|
|
740
862
|
|
|
741
863
|
.form-actions span {
|
|
742
|
-
|
|
743
|
-
|
|
744
|
-
line-height: 1.6;
|
|
864
|
+
font-size: 0.82rem;
|
|
865
|
+
color: var(--text-3);
|
|
745
866
|
}
|
|
746
867
|
|
|
747
868
|
/* ── Status panels ── */
|
|
748
|
-
|
|
749
869
|
.status-panel {
|
|
750
|
-
padding:
|
|
751
|
-
border-radius: var(--
|
|
752
|
-
border: 1px solid var(--
|
|
870
|
+
padding: 24px;
|
|
871
|
+
border-radius: var(--r-xl);
|
|
872
|
+
border: 1px solid var(--border);
|
|
753
873
|
background: var(--surface);
|
|
754
|
-
|
|
874
|
+
position: relative;
|
|
875
|
+
overflow: hidden;
|
|
755
876
|
}
|
|
756
877
|
|
|
757
878
|
.status-panel--success {
|
|
758
|
-
background:
|
|
759
|
-
border-color:
|
|
879
|
+
background: var(--success-bg);
|
|
880
|
+
border-color: var(--success-border);
|
|
760
881
|
}
|
|
761
882
|
|
|
762
883
|
.status-panel--error {
|
|
763
|
-
background:
|
|
764
|
-
border-color:
|
|
884
|
+
background: var(--error-bg);
|
|
885
|
+
border-color: var(--error-border);
|
|
765
886
|
}
|
|
766
887
|
|
|
767
888
|
.status-summary {
|
|
768
889
|
display: grid;
|
|
769
890
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
770
|
-
gap:
|
|
771
|
-
|
|
891
|
+
gap: 1px;
|
|
892
|
+
background: var(--border);
|
|
893
|
+
border: 1px solid var(--border);
|
|
894
|
+
border-radius: var(--r-md);
|
|
895
|
+
overflow: hidden;
|
|
896
|
+
margin-top: 16px;
|
|
772
897
|
}
|
|
773
898
|
|
|
774
899
|
.submitted-brief {
|
|
775
|
-
margin-top:
|
|
776
|
-
padding: 16px;
|
|
777
|
-
border-radius: var(--radius-md);
|
|
778
|
-
border: 1px solid var(--line);
|
|
779
|
-
background: var(--surface-soft);
|
|
780
|
-
}
|
|
781
|
-
|
|
782
|
-
/* ── Render panel ── */
|
|
783
|
-
|
|
784
|
-
.render-summary-grid {
|
|
785
|
-
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
786
|
-
margin-top: 18px;
|
|
787
|
-
}
|
|
788
|
-
|
|
789
|
-
.render-summary-grid--wide {
|
|
790
|
-
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
791
|
-
}
|
|
792
|
-
|
|
793
|
-
.render-item {
|
|
794
|
-
padding: 15px;
|
|
795
|
-
border-radius: var(--radius-md);
|
|
796
|
-
border: 1px solid var(--line);
|
|
797
|
-
background: var(--surface-soft);
|
|
798
|
-
}
|
|
799
|
-
|
|
800
|
-
.render-item span {
|
|
801
|
-
display: block;
|
|
802
|
-
color: var(--muted);
|
|
803
|
-
font-size: 0.72rem;
|
|
804
|
-
font-weight: 700;
|
|
805
|
-
letter-spacing: 0.08em;
|
|
806
|
-
text-transform: uppercase;
|
|
807
|
-
}
|
|
808
|
-
|
|
809
|
-
.render-item strong {
|
|
810
|
-
display: block;
|
|
811
|
-
margin-top: 6px;
|
|
812
|
-
font-size: 0.96rem;
|
|
813
|
-
font-weight: 600;
|
|
814
|
-
line-height: 1.35;
|
|
815
|
-
}
|
|
816
|
-
|
|
817
|
-
.render-note {
|
|
818
|
-
margin: 14px 0 0;
|
|
819
|
-
font-size: 0.88rem;
|
|
820
|
-
line-height: 1.7;
|
|
821
|
-
}
|
|
822
|
-
|
|
823
|
-
.render-stamp {
|
|
824
|
-
display: inline-block;
|
|
825
|
-
margin-top: 8px;
|
|
826
|
-
font-size: 0.82rem;
|
|
827
|
-
}
|
|
828
|
-
|
|
829
|
-
.render-band {
|
|
830
|
-
background: var(--surface-soft);
|
|
831
|
-
}
|
|
832
|
-
|
|
833
|
-
/* ── Stat / contact cards ── */
|
|
834
|
-
|
|
835
|
-
.stats-grid,
|
|
836
|
-
.card-grid {
|
|
837
|
-
width: 100%;
|
|
838
|
-
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
839
|
-
}
|
|
840
|
-
|
|
841
|
-
.stat-card {
|
|
842
|
-
background: var(--surface);
|
|
843
|
-
}
|
|
844
|
-
|
|
845
|
-
.stat-card strong,
|
|
846
|
-
.contact-value {
|
|
847
|
-
display: block;
|
|
848
|
-
color: var(--accent);
|
|
849
|
-
font-size: 1.6rem;
|
|
850
|
-
font-weight: 700;
|
|
851
|
-
letter-spacing: -0.04em;
|
|
852
|
-
margin-top: 10px;
|
|
853
|
-
}
|
|
854
|
-
|
|
855
|
-
.contact-card {
|
|
856
|
-
background: var(--surface);
|
|
857
|
-
}
|
|
858
|
-
|
|
859
|
-
/* ── Sections ── */
|
|
860
|
-
|
|
861
|
-
.section,
|
|
862
|
-
.split-layout,
|
|
863
|
-
.page-intro,
|
|
864
|
-
.section-card {
|
|
865
|
-
margin-top: 20px;
|
|
866
|
-
}
|
|
867
|
-
|
|
868
|
-
.compact-section {
|
|
869
|
-
margin-top: 14px;
|
|
870
|
-
}
|
|
871
|
-
|
|
872
|
-
.page-intro {
|
|
873
|
-
padding: 6px 2px 2px;
|
|
874
|
-
}
|
|
875
|
-
|
|
876
|
-
.section-header {
|
|
877
|
-
margin-bottom: 14px;
|
|
878
|
-
}
|
|
879
|
-
|
|
880
|
-
.info-card h3 {
|
|
881
|
-
margin: 0 0 10px;
|
|
882
|
-
font-size: 1.02rem;
|
|
883
|
-
font-weight: 700;
|
|
884
|
-
letter-spacing: -0.02em;
|
|
885
|
-
}
|
|
886
|
-
|
|
887
|
-
.split-layout {
|
|
888
|
-
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
889
|
-
}
|
|
890
|
-
|
|
891
|
-
.check-list,
|
|
892
|
-
.flow-list {
|
|
893
|
-
margin: 14px 0 0;
|
|
894
|
-
padding-left: 18px;
|
|
895
|
-
display: grid;
|
|
896
|
-
gap: 10px;
|
|
897
|
-
}
|
|
898
|
-
|
|
899
|
-
.check-list li::marker,
|
|
900
|
-
.flow-list li::marker {
|
|
901
|
-
color: var(--accent);
|
|
902
|
-
}
|
|
903
|
-
|
|
904
|
-
/* ── Code ── */
|
|
905
|
-
|
|
906
|
-
.code-panel {
|
|
907
|
-
background: var(--surface);
|
|
908
|
-
}
|
|
909
|
-
|
|
910
|
-
.code-block,
|
|
911
|
-
.mono-list {
|
|
912
|
-
font-family: "Cascadia Code", "Consolas", monospace;
|
|
913
|
-
}
|
|
914
|
-
|
|
915
|
-
.code-block {
|
|
916
|
-
margin: 14px 0 0;
|
|
900
|
+
margin-top: 16px;
|
|
917
901
|
padding: 16px;
|
|
918
|
-
border-radius: var(--
|
|
919
|
-
|
|
920
|
-
|
|
921
|
-
white-space: pre-wrap;
|
|
922
|
-
word-break: break-word;
|
|
923
|
-
font-size: 0.84rem;
|
|
924
|
-
line-height: 1.65;
|
|
925
|
-
}
|
|
926
|
-
|
|
927
|
-
/* ── Quick check / inline response ── */
|
|
928
|
-
|
|
929
|
-
.quick-check-panel {
|
|
930
|
-
margin-top: 20px;
|
|
931
|
-
padding-top: 20px;
|
|
932
|
-
border-top: 1px solid var(--line);
|
|
933
|
-
}
|
|
934
|
-
|
|
935
|
-
.quick-check-actions {
|
|
936
|
-
margin-top: 4px;
|
|
902
|
+
border-radius: var(--r-md);
|
|
903
|
+
border: 1px solid var(--border);
|
|
904
|
+
background: var(--bg-2);
|
|
937
905
|
}
|
|
938
906
|
|
|
939
|
-
|
|
940
|
-
|
|
941
|
-
}
|
|
907
|
+
/* ── Inline response ── */
|
|
908
|
+
.inline-response-shell { margin-top: 12px; }
|
|
942
909
|
|
|
943
910
|
.asjs-inline-response {
|
|
944
911
|
padding: 16px;
|
|
945
|
-
border-radius: var(--
|
|
946
|
-
border: 1px solid var(--
|
|
947
|
-
background: var(--
|
|
948
|
-
box-shadow: var(--shadow-soft);
|
|
912
|
+
border-radius: var(--r-md);
|
|
913
|
+
border: 1px solid var(--border);
|
|
914
|
+
background: var(--bg-2);
|
|
949
915
|
}
|
|
950
916
|
|
|
951
917
|
.asjs-inline-response strong {
|
|
952
918
|
display: block;
|
|
953
|
-
font-size: 0.
|
|
954
|
-
font-weight:
|
|
955
|
-
letter-spacing: -0.02em;
|
|
919
|
+
font-size: 0.9rem;
|
|
920
|
+
font-weight: 600;
|
|
956
921
|
}
|
|
957
922
|
|
|
958
923
|
.asjs-inline-response p {
|
|
959
|
-
margin:
|
|
960
|
-
|
|
961
|
-
|
|
962
|
-
line-height: 1.
|
|
924
|
+
margin: 6px 0 0;
|
|
925
|
+
font-size: 0.84rem;
|
|
926
|
+
color: var(--text-2);
|
|
927
|
+
line-height: 1.6;
|
|
963
928
|
}
|
|
964
929
|
|
|
965
930
|
.asjs-inline-response.is-success {
|
|
966
|
-
background:
|
|
967
|
-
border-color:
|
|
931
|
+
background: var(--success-bg);
|
|
932
|
+
border-color: var(--success-border);
|
|
968
933
|
}
|
|
969
934
|
|
|
970
935
|
.asjs-inline-response.is-error {
|
|
971
|
-
background:
|
|
972
|
-
border-color:
|
|
936
|
+
background: var(--error-bg);
|
|
937
|
+
border-color: var(--error-border);
|
|
973
938
|
}
|
|
974
939
|
|
|
975
|
-
.asjs-inline-response.is-neutral {
|
|
976
|
-
background: var(--surface-soft);
|
|
977
|
-
}
|
|
940
|
+
.asjs-inline-response.is-neutral { background: var(--bg-2); }
|
|
978
941
|
|
|
979
942
|
.inline-response-meta {
|
|
980
943
|
display: grid;
|
|
981
944
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
982
|
-
gap:
|
|
983
|
-
|
|
945
|
+
gap: 1px;
|
|
946
|
+
background: var(--border);
|
|
947
|
+
border: 1px solid var(--border);
|
|
948
|
+
border-radius: var(--r-sm);
|
|
949
|
+
overflow: hidden;
|
|
950
|
+
margin-top: 12px;
|
|
984
951
|
}
|
|
985
952
|
|
|
986
953
|
.inline-response-meta span {
|
|
987
954
|
display: grid;
|
|
988
|
-
gap:
|
|
955
|
+
gap: 4px;
|
|
989
956
|
margin: 0;
|
|
957
|
+
padding: 10px 12px;
|
|
958
|
+
background: var(--surface);
|
|
990
959
|
}
|
|
991
960
|
|
|
992
961
|
.inline-support {
|
|
993
|
-
margin:
|
|
994
|
-
|
|
995
|
-
|
|
962
|
+
margin: 12px 0 0;
|
|
963
|
+
font-size: 0.82rem;
|
|
964
|
+
color: var(--text-3);
|
|
996
965
|
}
|
|
997
966
|
|
|
998
967
|
.inline-link {
|
|
999
968
|
color: var(--accent);
|
|
1000
969
|
text-decoration: underline;
|
|
1001
|
-
text-underline-offset:
|
|
970
|
+
text-underline-offset: 2px;
|
|
1002
971
|
}
|
|
1003
972
|
|
|
1004
|
-
|
|
973
|
+
.quick-check-panel {
|
|
974
|
+
margin-top: 20px;
|
|
975
|
+
padding-top: 20px;
|
|
976
|
+
border-top: 1px solid var(--border);
|
|
977
|
+
}
|
|
978
|
+
|
|
979
|
+
.quick-check-actions { margin-top: 4px; }
|
|
980
|
+
|
|
981
|
+
/* ── Contact card ── */
|
|
982
|
+
.contact-card {
|
|
983
|
+
background: var(--surface);
|
|
984
|
+
border: 1px solid var(--border);
|
|
985
|
+
border-radius: var(--r-xl);
|
|
986
|
+
padding: 24px;
|
|
987
|
+
}
|
|
1005
988
|
|
|
989
|
+
/* ── Not found ── */
|
|
1006
990
|
.not-found-panel {
|
|
1007
|
-
padding:
|
|
991
|
+
padding: 64px 0;
|
|
1008
992
|
}
|
|
1009
993
|
|
|
1010
994
|
/* ── Footer ── */
|
|
1011
|
-
|
|
1012
995
|
.footer {
|
|
1013
996
|
display: flex;
|
|
1014
997
|
justify-content: space-between;
|
|
998
|
+
align-items: center;
|
|
1015
999
|
gap: 12px;
|
|
1016
1000
|
flex-wrap: wrap;
|
|
1017
|
-
margin-top:
|
|
1018
|
-
padding: 0
|
|
1019
|
-
|
|
1020
|
-
font-size: 0.
|
|
1001
|
+
margin-top: 48px;
|
|
1002
|
+
padding: 20px 0;
|
|
1003
|
+
border-top: 1px solid var(--border);
|
|
1004
|
+
font-size: 0.8rem;
|
|
1005
|
+
color: var(--text-3);
|
|
1021
1006
|
}
|
|
1022
1007
|
|
|
1023
1008
|
.footer strong {
|
|
1024
|
-
color: var(--text);
|
|
1009
|
+
color: var(--text-2);
|
|
1010
|
+
font-weight: 500;
|
|
1025
1011
|
}
|
|
1026
1012
|
|
|
1027
1013
|
/* ── Form state ── */
|
|
1028
|
-
|
|
1029
1014
|
.asjs-form-submitting {
|
|
1030
|
-
opacity: 0.
|
|
1031
|
-
}
|
|
1032
|
-
|
|
1033
|
-
.asjs-form-submitting .button {
|
|
1015
|
+
opacity: 0.65;
|
|
1034
1016
|
pointer-events: none;
|
|
1035
1017
|
}
|
|
1036
1018
|
|
|
1037
1019
|
/* ── Animations ── */
|
|
1038
|
-
|
|
1039
1020
|
@keyframes reveal {
|
|
1040
|
-
from {
|
|
1041
|
-
|
|
1042
|
-
transform: translateY(6px);
|
|
1043
|
-
}
|
|
1044
|
-
|
|
1045
|
-
to {
|
|
1046
|
-
opacity: 1;
|
|
1047
|
-
transform: translateY(0);
|
|
1048
|
-
}
|
|
1021
|
+
from { opacity: 0; transform: translateY(4px); }
|
|
1022
|
+
to { opacity: 1; transform: translateY(0); }
|
|
1049
1023
|
}
|
|
1050
1024
|
|
|
1051
1025
|
@keyframes shimmer {
|
|
1052
|
-
|
|
1053
|
-
|
|
1054
|
-
}
|
|
1055
|
-
|
|
1056
|
-
to {
|
|
1057
|
-
background-position: -100% 0;
|
|
1058
|
-
}
|
|
1026
|
+
0% { background-position: 200% 0; }
|
|
1027
|
+
100% { background-position: -200% 0; }
|
|
1059
1028
|
}
|
|
1060
1029
|
|
|
1061
|
-
/* ──
|
|
1062
|
-
|
|
1063
|
-
|
|
1064
|
-
.header-
|
|
1065
|
-
.hero,
|
|
1066
|
-
.
|
|
1067
|
-
.
|
|
1068
|
-
.stats-grid,
|
|
1069
|
-
.render-summary-grid,
|
|
1070
|
-
.render-summary-grid--wide,
|
|
1071
|
-
.dashboard-grid,
|
|
1072
|
-
.metric-grid,
|
|
1073
|
-
.catalog-grid,
|
|
1074
|
-
.api-grid,
|
|
1075
|
-
.field-grid,
|
|
1076
|
-
.status-summary,
|
|
1077
|
-
.inline-response-meta {
|
|
1078
|
-
grid-template-columns: 1fr;
|
|
1079
|
-
}
|
|
1080
|
-
|
|
1081
|
-
.site-nav {
|
|
1082
|
-
justify-content: flex-start;
|
|
1083
|
-
}
|
|
1030
|
+
/* ── Tablet ── */
|
|
1031
|
+
@media (max-width: 1024px) {
|
|
1032
|
+
.header-main { grid-template-columns: auto 1fr; }
|
|
1033
|
+
.header-cta { display: none; }
|
|
1034
|
+
.hero, .split-layout, .dashboard-grid { grid-template-columns: 1fr; }
|
|
1035
|
+
.catalog-grid, .card-grid, .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
|
|
1036
|
+
.render-summary-grid--wide { grid-template-columns: repeat(2, minmax(0, 1fr)); }
|
|
1084
1037
|
}
|
|
1085
1038
|
|
|
1086
|
-
|
|
1039
|
+
/* ── Mobile ── */
|
|
1040
|
+
@media (max-width: 640px) {
|
|
1087
1041
|
.page-shell {
|
|
1088
|
-
width: min(100%, calc(100% -
|
|
1089
|
-
|
|
1042
|
+
width: min(100%, calc(100% - 24px));
|
|
1043
|
+
padding-bottom: 40px;
|
|
1090
1044
|
}
|
|
1091
1045
|
|
|
1092
|
-
.
|
|
1093
|
-
|
|
1094
|
-
|
|
1095
|
-
|
|
1096
|
-
|
|
1097
|
-
.info-card,
|
|
1098
|
-
.stat-card,
|
|
1099
|
-
.not-found-panel {
|
|
1100
|
-
padding: 18px;
|
|
1046
|
+
.header-main {
|
|
1047
|
+
grid-template-columns: auto 1fr;
|
|
1048
|
+
height: auto;
|
|
1049
|
+
padding: 10px 16px;
|
|
1050
|
+
gap: 10px;
|
|
1101
1051
|
}
|
|
1102
1052
|
|
|
1103
|
-
.
|
|
1104
|
-
.
|
|
1105
|
-
|
|
1106
|
-
|
|
1107
|
-
|
|
1108
|
-
}
|
|
1053
|
+
.brand-copy small,
|
|
1054
|
+
.brand-copy span { display: none; }
|
|
1055
|
+
|
|
1056
|
+
.site-nav { justify-content: flex-start; padding: 0; }
|
|
1057
|
+
|
|
1058
|
+
.page-intro { padding: 36px 0 20px; }
|
|
1059
|
+
.section-card { padding: 20px; }
|
|
1060
|
+
.view-frame { margin-top: 24px; }
|
|
1109
1061
|
|
|
1110
|
-
.
|
|
1111
|
-
|
|
1112
|
-
|
|
1062
|
+
.card-grid, .stats-grid, .catalog-grid,
|
|
1063
|
+
.metric-grid, .api-grid, .field-grid,
|
|
1064
|
+
.status-summary, .inline-response-meta {
|
|
1065
|
+
grid-template-columns: 1fr;
|
|
1113
1066
|
}
|
|
1114
1067
|
|
|
1068
|
+
.render-summary-grid,
|
|
1069
|
+
.render-summary-grid--wide { grid-template-columns: repeat(2, minmax(0, 1fr)); }
|
|
1070
|
+
|
|
1071
|
+
.hero-copy, .hero-aside { padding: 20px; }
|
|
1072
|
+
|
|
1115
1073
|
.route-loader {
|
|
1116
1074
|
inset: auto 8px 8px 8px;
|
|
1117
1075
|
width: auto;
|
|
1118
1076
|
}
|
|
1119
1077
|
|
|
1120
|
-
.activity-item {
|
|
1121
|
-
|
|
1078
|
+
.activity-item { grid-template-columns: 1fr; }
|
|
1079
|
+
|
|
1080
|
+
.footer {
|
|
1081
|
+
flex-direction: column;
|
|
1082
|
+
align-items: flex-start;
|
|
1122
1083
|
}
|
|
1123
1084
|
}
|