1.log-view { position: relative; flex: 1; min-height: 0; display: flex; flex-direction: column; }
2.log-view .logs {
3 flex: 1;
4 min-height: 0;
5 max-height: none;
6 margin: 0;
7 padding: 0 0 8px;
8 border: 0;
9 border-top: 1px solid var(--line);
10 border-radius: 0;
11 box-shadow: none;
12 background: var(--well);
13 /* Terminal colors lean toward the text color, more so on light backgrounds they were never picked for. */
14 --ansi-mix: 85%;
15}
16@media (prefers-color-scheme: light) { .log-view .logs { --ansi-mix: 55%; } }
17.log-view .logs:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
18.log-view .log { grid-template-columns: 62px 1fr; padding: 0 var(--gutter); }
19.log-view .log.warn:hover { background: color-mix(in srgb, var(--warning) 16%, transparent); }
20.log-view .log.error:hover { background: color-mix(in srgb, var(--critical) 20%, transparent); }
21.log-view .ansi {
22 color: color-mix(in srgb, var(--fg, currentColor) var(--ansi-mix), var(--text));
23 background: color-mix(in srgb, var(--bg, transparent) 45%, transparent);
24}
25.log-edge { padding: 6px var(--gutter); color: var(--muted); font: 12px var(--sans); }
26.log-edge.day { padding-block: 8px 2px; color: var(--text-2); font-weight: 600; }
27.log-edge.at { padding-block: 2px; border-block: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); color: var(--accent); }
28.log-view .latest { position: absolute; bottom: 16px; left: 50%; translate: -50%; background: var(--raised); box-shadow: var(--shadow); }
29.log-view .container { margin-right: 8px; padding: 0; border: 0; background: none; color: var(--muted); font: inherit; }
30.log-view button.container { cursor: pointer; }
31.log-view button.container:hover { color: var(--text); text-decoration: underline dotted; text-underline-offset: 3px; }