Improve severity labels in Actions logs and tweak colors (#36993)

Add support for error, warning, notice, and debug log commands with bold
label prefixes and colored backgrounds matching GitHub's style. Parse
both `##[cmd]` and `::cmd args::` formats.

Also improved the severity colors globally and added a devtest page for
these.

---------

Co-authored-by: Claude (claude-opus-4-6) <noreply@anthropic.com>

web_src/js/components/ActionRunJobView.vue

@@ -229,7 +229,8 @@ function createLogLine(stepIndex: number, startTime: number, line: LogLine, cmd:
   toggleElem(logTimeStamp, timeVisible.value['log-time-stamp']);
   toggleElem(logTimeSeconds, timeVisible.value['log-time-seconds']);
 
-  return createElementFromAttrs('div', {id: `jobstep-${stepIndex}-${line.index}`, class: 'job-log-line'},
+  const lineClass = cmd?.name ? `job-log-line log-line-${cmd.name}` : 'job-log-line';
+  return createElementFromAttrs('div', {id: `jobstep-${stepIndex}-${line.index}`, class: lineClass},
     lineNum, logTimeStamp, logMsg, logTimeSeconds,
   );
 }
@@ -650,8 +651,28 @@ async function hashChangeListener() {
   color: var(--color-ansi-blue);
 }
 
-.job-step-logs .job-log-line .log-cmd-error {
-  color: var(--color-ansi-red);
+.job-step-logs .log-msg-label {
+  font-weight: var(--font-weight-semibold);
+}
+
+.job-step-logs .log-line-error {
+  background: var(--color-error-bg);
+}
+
+.job-step-logs .log-line-warning {
+  background: var(--color-warning-bg);
+}
+
+.job-step-logs .log-cmd-error > .log-msg-label {
+  color: var(--color-error-text);
+}
+
+.job-step-logs .log-cmd-warning > .log-msg-label {
+  color: var(--color-warning-text);
+}
+
+.job-step-logs .log-cmd-debug {
+  color: var(--color-violet);
 }
 
 /* selectors here are intentionally exact to only match fullscreen */