1.deploy-page .page-head { flex-wrap: wrap; row-gap: 8px; margin-bottom: 12px; }
2.deploy-page .page-head .stats { order: 1; flex-basis: 100%; }
3.deploy-page .page-head h1 { white-space: nowrap; }
4.deploy-page .crumb {
5 display: inline-flex;
6 align-items: center;
7 height: var(--control);
8 margin: 0 -4px 0 -10px;
9 padding: 0 10px;
10 border-radius: 99px;
11 color: var(--muted);
12 font-size: 15px;
13 transition: background-color 150ms, color 150ms;
14}
15.deploy-page .crumb::after { content: "/"; margin-left: 12px; color: var(--axis); }
16.deploy-page .crumb:hover { background: var(--hover); color: var(--text); }
17.deploy-page .id { margin-left: -6px; color: var(--muted); }
18.deploy-page .button svg { margin-left: 6px; }
19
20.stat.warn { border-color: color-mix(in srgb, var(--warning) 40%, var(--line)); color: color-mix(in srgb, var(--warning) 65%, var(--text)); }
21.stat.production { border-color: color-mix(in srgb, var(--accent) 40%, var(--line)); background: var(--accent-wash); color: var(--accent); }
22.stat.failed { border-color: color-mix(in srgb, var(--critical) 40%, var(--line)); color: color-mix(in srgb, var(--critical) 70%, var(--text)); }
23a.stat.warn:hover { background: color-mix(in srgb, var(--warning) 10%, transparent); }
24
25.deploy-page .tab-row { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
26.deploy-page .tab-row .segmented { margin-right: auto; }
27
28.deploy-page .run { margin-bottom: 10px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); overflow: hidden; }
29.deploy-page .run-head { display: flex; align-items: center; gap: 10px; padding: 6px 6px 6px 12px; font-size: 13px; }
30.deploy-page .run .output { max-height: 220px; border-top: 1px solid var(--line); }
31
32.deploy-page .output {
33 overflow: auto;
34 padding: 6px 0 8px;
35 background: var(--well);
36 font: 12px/18px var(--mono);
37 white-space: pre-wrap;
38 word-break: break-word;
39}
40.deploy-page .output > div { padding: 0 var(--gutter); }
41.deploy-page .run .output > div { padding: 0 12px; }
42.deploy-page .output .command { color: var(--muted); }
43.deploy-page .output.fill, .deploy-page .job-logs .empty { margin: 0; font-family: var(--sans); }
44.deploy-page .job-logs { display: flex; flex-direction: column; }
45.deploy-page .job-logs .empty a { color: var(--accent); text-decoration: underline dotted; text-underline-offset: 3px; }
46
47
48.deploy-page .file { border-top: 1px solid var(--line); }
49.deploy-page .file header {
50 position: sticky;
51 top: 0;
52 z-index: 1;
53 display: flex;
54 align-items: center;
55 gap: 8px;
56 padding: 6px var(--gutter);
57 background: var(--page);
58 font-size: 13px;
59}
60.deploy-page .file header .icon { display: grid; width: 16px; height: 16px; }
61.deploy-page .file header .icon :is(img, .monogram) { width: 100%; height: 100%; font-size: 10px; }
62.deploy-page .file header a { font-weight: 600; }
63.deploy-page .file header a:hover { color: var(--accent); }
64.deploy-page .counts ins { color: var(--good); text-decoration: none; }
65.deploy-page .counts del { color: var(--critical); text-decoration: none; }
66
67.deploy-page .diff { padding: 2px 0 10px; background: var(--well); line-height: 18px; }
68.deploy-page .diff .line { display: grid; grid-template-columns: 32px 32px 16px minmax(0, 1fr); padding-left: calc(var(--gutter) - 24px); }
69.deploy-page .diff .n { padding-right: 8px; color: var(--muted); text-align: right; user-select: none; opacity: 0.7; }
70.deploy-page .diff .op { color: var(--muted); user-select: none; }
71.deploy-page .diff .text { white-space: pre-wrap; word-break: break-all; padding-right: var(--gutter); }
72.deploy-page .diff .add { background: color-mix(in srgb, var(--good) 12%, transparent); }
73.deploy-page .diff .add .op { color: var(--good); }
74.deploy-page .diff .del { background: color-mix(in srgb, var(--critical) 12%, transparent); }
75.deploy-page .diff .del .op { color: var(--critical); }
76.deploy-page .fold {
77 display: block;
78 width: 100%;
79 padding: 1px 0 1px calc(var(--gutter) + 56px);
80 border: 0;
81 background: color-mix(in srgb, var(--accent) 6%, transparent);
82 color: var(--muted);
83 font: 12px/18px var(--sans);
84 text-align: left;
85 cursor: pointer;
86}
87.deploy-page .fold:hover { background: var(--accent-wash); color: var(--accent); }
88
89.deploy-page .usage { padding: 0 var(--gutter) 6px; }
90.deploy-page .strip-head .now { font-size: 15px; }
91.deploy-page .strip-head .now.peak { color: var(--muted); font-size: 13px; font-weight: 500; }
92.deploy-page .strip-head .now b { color: var(--accent); font-size: 15px; font-weight: 650; }
93.deploy-page .usage-empty { margin: 0 var(--gutter) 8px; }
94
95.deploy-page .allocations td { vertical-align: middle; }
96.deploy-page .allocations .chips { display: flex; flex-wrap: wrap; gap: 4px; }
97.deploy-page .tab-row select { width: auto; }
98
99.deploy-page .hint, .deploy-page .commit-message { margin: 12px var(--gutter); }
100.deploy-page .commit-message { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; }