cool-workflow 0.2.4 → 0.2.5

package/scripts/release-oneclick.js

@@ -120,6 +120,28 @@ function alreadyCut() {
   return remote.code === 0 && Boolean(remote.out);
 }
 
+// A cut tags the verdict commit LOCALLY and only then pushes the tag. If that
+// push dies (a network drop, an auth expiry) the tag is left local-only:
+// alreadyCut() still sees it and resumes at stage 3, but stage 3 would then
+// wait 45 minutes for a release-gate run CI never started, because the tag
+// never reached origin. So on resume, before the CI wait, make sure the tag is
+// actually on origin — re-push it (the same tag-only refspec cut() uses) when
+// it is only local. This keeps the tag-only-push contract: no branch is pushed,
+// and the tag commit's first parent is untouched (it is exactly what was cut).
+function ensureTagPushedOnResume() {
+  const remote = git(["ls-remote", "origin", `refs/tags/v${version}`]);
+  if (remote.code !== 0) {
+    die("could not reach origin to check the tag — fix network/auth and re-run to resume.", remote.err);
+  }
+  if (remote.out) return; // already on origin — nothing to do
+  say(`tag v${version} is local-only (the cut's tag push must have failed) — re-pushing refs/tags/v${version}.`);
+  const push = git(["push", "origin", `refs/tags/v${version}`]);
+  if (push.code !== 0) {
+    die("re-push of the local-only tag failed (nothing else was done) — fix the issue and re-run to resume.", push.err);
+  }
+  say(`re-pushed refs/tags/v${version} to origin.`);
+}
+
 // ---- stage 0: preflight -----------------------------------------------------
 function runPreflight() {
   stage(0, "preflight");
@@ -318,12 +340,12 @@ function runRecordAndWaitStage() {
   }
 
   say(`waiting for release-gate on tag v${version}...`);
-  const gateRunId = poll({
+  const gate = poll({
     label: "release-gate wait",
     timeoutMs: 45 * 60 * 1000,
     intervalMs: 20000,
     probe: () => {
-      const list = gh(["run", "list", "--workflow", "release-gate", "--limit", "10", "--json", "databaseId,headBranch,status,conclusion"]);
+      const list = gh(["run", "list", "--workflow", "release-gate", "--limit", "10", "--json", "databaseId,headBranch,status,conclusion,updatedAt"]);
       if (list.code !== 0) return { error: true };
       let runs;
       try {
@@ -333,22 +355,29 @@ function runRecordAndWaitStage() {
       }
       const gateRun = runs.find((r) => r.headBranch === `v${version}`);
       if (gateRun && gateRun.status === "completed") {
-        if (gateRun.conclusion === "success") return { done: true, value: gateRun.databaseId };
+        // Carry the gate's OWN completion time out of the poll — the npm-publish
+        // cutoff below must key off when the gate actually finished, not off the
+        // wall clock now (a resume can start long after the gate completed).
+        if (gateRun.conclusion === "success") return { done: true, value: { id: gateRun.databaseId, completedMs: Date.parse(gateRun.updatedAt) } };
         die(`release-gate FAILED — inspect: gh run view ${gateRun.databaseId} --log-failed`);
       }
       return {};
     }
   });
-  say(`release-gate: SUCCESS (run ${gateRunId})`);
+  say(`release-gate: SUCCESS (run ${gate.id})`);
 
   // npm-publish is created only AFTER release-gate completes (workflow_run
   // trigger), so the run to wait for may not exist yet — and the newest
   // completed npm-publish run at this moment is usually the PREVIOUS
   // release's. Only accept a run created at-or-after the moment the gate
-  // finished (small clock-skew allowance), and keep waiting until that run
-  // exists and completes.
+  // FINISHED (small clock-skew allowance), and keep waiting until that run
+  // exists and completes. The cutoff is the gate run's own completion time,
+  // NOT Date.now(): on a resume minutes/days later, a now-based cutoff sits in
+  // the future relative to an already-completed npm-publish run and would drop
+  // it, hanging the wait for a publish that is already done. Fall back to now
+  // only if the gate run reported no parseable completion time.
   say("waiting for npm-publish...");
-  const gateDoneMs = Date.now();
+  const gateDoneMs = Number.isFinite(gate.completedMs) ? gate.completedMs : Date.now();
   poll({
     label: "npm-publish wait",
     timeoutMs: 30 * 60 * 1000,
@@ -396,7 +425,9 @@ if (alreadyCut()) {
   say(`tag v${version} already exists — the cut already happened; resuming at stage 3 (CI wait + record + confirm).`);
   if (DRY_RUN) {
     say("[dry-run] would resume at stage 3: record PR + wait for release-gate/npm-publish + npm view confirmation.");
+    say("[dry-run] would first re-push refs/tags/v" + version + " if it is only local (the cut's tag push had failed).");
   } else {
+    ensureTagPushedOnResume();
     runRecordAndWaitStage();
   }
 } else {

package/scripts/release-tags.js

@@ -0,0 +1,47 @@
+"use strict";
+// release-tags.js — the ONE semver-ordered release-tag lookup, shared by
+// release-flow.js and release-gate.js so the two can never drift (the gate
+// used to carry a bash port of this logic; a mirror copy is exactly the kind
+// of thing that rots).
+//
+// "What was the last release" is a SEMVER question, not an ancestry question:
+// a cut's own tag commit lives on an ephemeral line that is NEVER merged as
+// an ancestor of `main` (cut() tags the verdict-record commit directly), so
+// `git describe --tags --abbrev=0`, which walks ONLY ancestors, always skips
+// the true previous release tag and silently lands one release further back
+// (verified live: `git describe --tags v0.2.4^` -> v0.2.2, skipping v0.2.3).
+// List every vX.Y.Z tag and pick by version order instead.
+
+function parseSemverTag(tag) {
+  const m = /^v(\d+)\.(\d+)\.(\d+)$/.exec(tag);
+  return m ? [Number(m[1]), Number(m[2]), Number(m[3])] : null;
+}
+
+function compareSemver(a, b) {
+  for (let i = 0; i < 3; i++) if (a[i] !== b[i]) return a[i] - b[i];
+  return 0;
+}
+
+// gitOut: (args: string[]) => string — the caller's own git runner (each
+// caller binds its own repo root), returning trimmed stdout, "" on failure.
+function listReleaseTagsDesc(gitOut) {
+  const out = gitOut(["tag", "-l", "v*"]);
+  if (!out) return [];
+  return out
+    .split("\n")
+    .filter(Boolean)
+    .map((tag) => ({ tag, semver: parseSemverTag(tag) }))
+    .filter((t) => t.semver)
+    .sort((a, b) => compareSemver(b.semver, a.semver));
+}
+
+// The most recent ALREADY-RELEASED tag as of right now: the highest vX.Y.Z
+// tag that does NOT already point at HEAD — so this works whether run before
+// tagging or re-run on a freshly tagged commit.
+function resolvePrevReleaseTag(gitOut) {
+  const headTags = new Set(gitOut(["tag", "--points-at", "HEAD"]).split("\n").filter(Boolean));
+  const found = listReleaseTagsDesc(gitOut).find((t) => !headTags.has(t.tag));
+  return found ? found.tag : "";
+}
+
+module.exports = { parseSemverTag, compareSemver, listReleaseTagsDesc, resolvePrevReleaseTag };

package/scripts/verdict-keygen.js

@@ -9,7 +9,7 @@
 // The PRIVATE key stays with whoever runs `release-flow.js --cut`/`--check`
 // (CW_RELEASE_VERDICT_PRIVKEY) and NEVER gets committed. The PUBLIC key is
 // committed to the repo at .cw-release/verdict-signing.pub so CI's
-// release-gate.yml, npm-publish.yml, and the local block-unapproved-tag.sh
+// release-gate.yml, npm-publish.yml, and the local block-unapproved-tag.js
 // hook can all verify a committed verdict without holding any secret.
 //
 // Verification is opt-in and backward compatible: as long as
@@ -76,7 +76,7 @@ process.stdout.write(
     `  git -C "$(git rev-parse --show-toplevel)" commit -m "chore: add release-verdict signing public key"`,
     ``,
     `Once .cw-release/verdict-signing.pub is committed, release-gate.yml, npm-publish.yml,`,
-    `and block-unapproved-tag.sh all start REQUIRING a valid signature on top of the`,
+    `and block-unapproved-tag.js all start REQUIRING a valid signature on top of the`,
     `existing APPROVED text check — an unsigned or hand-written verdict fails closed.`,
     ``
   ].join("\n")

package/scripts/verify-bump-reproduction.js

@@ -0,0 +1,193 @@
+#!/usr/bin/env node
+"use strict";
+// verify-bump-reproduction.js — closes the HEAD~1 verdict-replay bypass.
+//
+// release-gate.yml / npm-publish.yml tolerate a verdict written for the tag
+// commit's PARENT (release-flow.js's cut() reviews content, then adds a
+// mechanical version-bump + the verdict as a NEW child commit that actually
+// gets tagged). A validly-signed verdict at the parent proves someone once
+// approved THAT commit — it does NOT prove the child (the thing actually being
+// tagged) is the deterministic bump cut() would have produced, rather than an
+// attacker's own commit smuggling in arbitrary changes on top of an old,
+// genuinely-approved parent (a real signature on a REPLAYED verdict).
+//
+// This script independently reproduces the bump: checks out the approved
+// parent into a scratch worktree, runs the SAME bump:version/sync:project-index
+// steps cut() runs, stages the SAME way cut() stages (git add -u + the
+// explicit verdict/.sig paths, never -A), and requires the resulting tree to
+// match the ACTUAL tagged commit's tree byte-for-byte. Any difference —
+// anywhere, including a single added file — fails closed.
+//
+// (Node port of the former verify-bump-reproduction.sh; behavior kept line
+// for line — same steps, same messages, same exit map.)
+//
+// Usage: verify-bump-reproduction.js <approved-parent-sha> <tagged-sha> <verdict-repo-relative-path> [sig-repo-relative-path]
+//
+// Exit 0: the tagged commit's tree matches the reproduced bump exactly.
+// Exit 1: mismatch, or any step failed (install, bump, sync, worktree, etc).
+
+const fs = require("node:fs");
+const os = require("node:os");
+const path = require("node:path");
+const { spawnSync } = require("node:child_process");
+
+// Where THIS SCRIPT ITSELF lives — distinct from REPO_ROOT (the git repo being
+// operated ON, resolved below from the invocation cwd). These coincide in
+// ordinary production use (the script runs from within the same checkout it
+// verifies), but conflating them is wrong: REPO_ROOT could be an ARBITRARY git
+// context (e.g. a test harness's throwaway clone of old history, which never
+// has this script's own sibling files, since they postdate whatever was
+// cloned). Sibling files this script depends on must be found relative to
+// where it is installed, never relative to the repo it happens to be pointed at.
+const SCRIPT_DIR = __dirname;
+
+function err(msg) {
+  process.stderr.write(`${msg}\n`);
+}
+
+const [, , PARENT, TAGGED, VERDICT_REL, SIG_REL = ""] = process.argv;
+if (!PARENT || !TAGGED || !VERDICT_REL) {
+  err("usage: verify-bump-reproduction.js <parent-sha> <tagged-sha> <verdict-rel-path> [sig-rel-path]");
+  process.exit(1);
+}
+
+function run(cmd, args, opts = {}) {
+  return spawnSync(cmd, args, { encoding: "utf8", ...opts });
+}
+function gitIn(dir, args, opts = {}) {
+  return run("git", ["-C", dir, ...args], opts);
+}
+
+const top = run("git", ["rev-parse", "--show-toplevel"]);
+if (top.status !== 0) process.exit(1);
+const REPO_ROOT = top.stdout.trim();
+
+const SCRATCH_PARENT = fs.mkdtempSync(path.join(os.tmpdir(), "cw-bump-repro-"));
+const SCRATCH = path.join(SCRATCH_PARENT, "wt");
+function cleanup() {
+  gitIn(REPO_ROOT, ["worktree", "remove", "--force", SCRATCH], { stdio: "ignore" });
+  fs.rmSync(SCRATCH_PARENT, { recursive: true, force: true });
+}
+
+function main() {
+  const wt = gitIn(REPO_ROOT, ["worktree", "add", "--quiet", "--detach", SCRATCH, PARENT], { stdio: "ignore" });
+  if (wt.status !== 0) {
+    err(`verify-bump-reproduction: could not create a scratch worktree at ${PARENT}`);
+    return 1;
+  }
+
+  // The target version comes from the TAGGED commit (not the parent, which may
+  // still be pre-bump) — read via git plumbing, no separate checkout needed.
+  const pkgShow = gitIn(REPO_ROOT, ["show", `${TAGGED}:plugins/cool-workflow/package.json`]);
+  let VERSION = "";
+  if (pkgShow.status === 0) {
+    try {
+      VERSION = JSON.parse(pkgShow.stdout).version || "";
+    } catch {
+      VERSION = "";
+    }
+  }
+  if (!VERSION) {
+    err(`verify-bump-reproduction: could not read package.json version from tagged commit ${TAGGED}`);
+    return 1;
+  }
+
+  // sync-project-index.js embeds a wall-clock "Generated on <date>" line. Pin it
+  // to the TAGGED commit's own committer date (UTC) via a Node --require preload
+  // that overrides the global Date constructor (fake-date-for-reproduction.js),
+  // NOT an application-level env var: the scratch worktree runs the APPROVED
+  // PARENT's OWN checked-out copy of sync-project-index.js, which for every
+  // release cut before this mechanism existed has no idea any such env var is
+  // meant to be read — an app-level opt-in is a no-op against code that doesn't
+  // know to opt in, so it can only ever "work" for releases cut after the
+  // mechanism landed (confirmed empirically: re-running an already-shipped
+  // release's real approved-parent/tagged pair on a later calendar day produced
+  // a tree mismatch whose ONLY diff was that one date line). A global override
+  // of the Date constructor, injected before any application code runs, is
+  // transparent to the code being executed regardless of which version it is.
+  const dateShow = gitIn(REPO_ROOT, ["show", "-s", "--format=%cd", "--date=format-local:%Y-%m-%d", TAGGED], {
+    env: { ...process.env, TZ: "UTC" },
+  });
+  const CUT_DATE = dateShow.status === 0 ? dateShow.stdout.trim() : "";
+  if (!CUT_DATE) {
+    err("verify-bump-reproduction: could not read the tagged commit's committer date");
+    return 1;
+  }
+  const FAKE_DATE_PRELOAD = path.join(SCRIPT_DIR, "fake-date-for-reproduction.js");
+
+  // Each step's exit code is checked EXPLICITLY and immediately (not via one
+  // combined chain) — a chain's overall success can silently survive an earlier
+  // step's failure if a future edit ever loosens it, which would flip this
+  // fail-closed gate to fail-open without changing its outward shape.
+  // stdout/stderr from each step are captured (not discarded) so a real
+  // failure — a transient npm registry hiccup vs. an actual reproduction
+  // mismatch — is distinguishable in the workflow log instead of both
+  // collapsing into the same generic message.
+  const stepCwd = path.join(SCRATCH, "plugins", "cool-workflow");
+  const stepEnv = {
+    ...process.env,
+    NODE_OPTIONS: `--require ${FAKE_DATE_PRELOAD}`,
+    CW_FAKE_DATE: CUT_DATE,
+  };
+  function runStep(label, cmd, args) {
+    const r = run(cmd, args, { cwd: stepCwd, env: stepEnv });
+    const out = (r.stdout || "") + (r.stderr || "");
+    const code = r.error ? 1 : r.status;
+    if (code !== 0) {
+      err(`verify-bump-reproduction: ${label} failed (exit ${code}):`);
+      err(out);
+      return false;
+    }
+    return true;
+  }
+
+  const bumpOk =
+    runStep("npm install", "npm", ["install", "--no-package-lock", "--ignore-scripts"]) &&
+    runStep("bump:version", "npm", ["run", "bump:version", "--", VERSION]) &&
+    runStep("sync:project-index", "npm", ["run", "sync:project-index", "--", "--repo-only"]);
+  if (!bumpOk) {
+    err(`verify-bump-reproduction: reproducing the bump for ${PARENT} -> v${VERSION} failed`);
+    return 1;
+  }
+
+  fs.mkdirSync(path.join(SCRATCH, ".cw-release"), { recursive: true });
+  try {
+    fs.copyFileSync(path.join(REPO_ROOT, VERDICT_REL), path.join(SCRATCH, VERDICT_REL));
+  } catch {
+    return 1;
+  }
+  if (SIG_REL && fs.existsSync(path.join(REPO_ROOT, SIG_REL))) {
+    try {
+      fs.copyFileSync(path.join(REPO_ROOT, SIG_REL), path.join(SCRATCH, SIG_REL));
+    } catch {
+      return 1;
+    }
+  }
+
+  // Mirror cut()'s OWN staging exactly (git-add -u + the explicit verdict/.sig
+  // paths) — never -A, so an untracked stray left by npm/tooling in the scratch
+  // worktree can never silently ride into what we compare.
+  gitIn(SCRATCH, ["add", "-u"]);
+  gitIn(SCRATCH, ["add", "--", VERDICT_REL]);
+  if (SIG_REL && fs.existsSync(path.join(SCRATCH, SIG_REL))) {
+    gitIn(SCRATCH, ["add", "--", SIG_REL]);
+  }
+
+  const EXPECTED_TREE = gitIn(SCRATCH, ["write-tree"]).stdout.trim();
+  const ACTUAL_TREE = gitIn(REPO_ROOT, ["rev-parse", `${TAGGED}^{tree}`]).stdout.trim();
+
+  if (EXPECTED_TREE !== ACTUAL_TREE) {
+    err(`verify-bump-reproduction: ${TAGGED}'s tree (${ACTUAL_TREE}) does not match the deterministic bump reproduced from approved parent ${PARENT} (${EXPECTED_TREE}) — refusing`);
+    return 1;
+  }
+
+  return 0;
+}
+
+let code = 1;
+try {
+  code = main();
+} finally {
+  cleanup();
+}
+process.exit(code);

package/scripts/verify-verdict-signature.js

@@ -4,7 +4,7 @@
 // verify-verdict-signature.js — verify an ed25519 signature over a committed
 // release verdict file, against the committed public key
 // (.cw-release/verdict-signing.pub). Portable (node + node:crypto only) so
-// CI (release-gate.yml, npm-publish.yml) and the local block-unapproved-tag.sh
+// CI (release-gate.yml, npm-publish.yml) and the local block-unapproved-tag.js
 // hook can all shell out to the SAME check instead of three drifting copies.
 //
 // Exit 0: signature verifies. Exit 1: missing file, unreadable key, or a

package/ui/workbench/app.css

@@ -27,21 +27,31 @@
   }
 }
 * { box-sizing: border-box; }
+/* The body is a flex column and main takes the leftover height (flex: 1 +
+   min-height: 0 so the inner panes can scroll) — no hardcoded header
+   height, so a header that wraps to two lines no longer pushes the panes
+   past the bottom of the window. */
 body {
   margin: 0;
   font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
   background: var(--bg);
   color: var(--ink);
   font-size: 14px;
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
 }
 header { padding: 14px 20px; border-bottom: 1px solid var(--line); }
 header h1 { margin: 0; font-size: 18px; font-weight: 600; }
 header .muted, .muted { color: var(--muted); font-weight: 400; }
 header .trust { margin: 4px 0 0; font-size: 12px; color: var(--muted); }
 code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
-main { display: grid; grid-template-columns: 320px 1fr; height: calc(100vh - 64px); }
+main { display: grid; grid-template-columns: 320px 1fr; flex: 1; min-height: 0; }
 .sidebar { border-right: 1px solid var(--line); overflow-y: auto; padding: 12px; }
 .bar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
+/* The sidebar heading is a real <h2> (document outline / screen-reader
+   navigation) styled to the size the old <strong> label had. */
+.bar h2 { margin: 0; font-size: 14px; font-weight: 600; }
 button {
   background: var(--panel-2); color: var(--ink); border: 1px solid var(--line);
   border-radius: 6px; padding: 4px 10px; cursor: pointer; font-size: 12px;
@@ -51,16 +61,28 @@ input[type="search"] {
   width: 100%; background: var(--panel); color: var(--ink);
   border: 1px solid var(--line); border-radius: 6px; padding: 6px 8px; margin-bottom: 8px;
 }
-.freshness { font-size: 11px; color: var(--muted); margin-bottom: 8px; }
+.freshness { font-size: 12px; color: var(--muted); margin-bottom: 8px; }
 .run-list { list-style: none; margin: 0; padding: 0; }
-.run-list li {
+.run-list li,
+.run-list button {
   padding: 8px; border: 1px solid var(--line); border-radius: 6px;
   margin-bottom: 6px; cursor: pointer; background: var(--panel);
 }
-.run-list li:hover { border-color: var(--accent); }
-.run-list li.active { border-color: var(--accent); background: var(--panel-2); }
+/* Only the run-row <button> needs a plain-element reset: a <button> has
+   its own default display/width/font/color, a plain <li> (used only for
+   the error and empty-state rows) does not and must keep its own color
+   (.err red, .muted gray) — see app.js. */
+.run-list button {
+  display: block; width: 100%; text-align: left; font: inherit; color: inherit;
+}
+.run-list li:hover, .run-list button:hover { border-color: var(--accent); }
+.run-list li.active, .run-list button.active { border-color: var(--accent); background: var(--panel-2); }
+/* Run rows are now real <button> elements (for Tab/Enter/Space); make the
+   keyboard focus ring visible — there is no :focus-visible rule for this
+   element otherwise. */
+.run-list button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
 .run-list .rid { font-family: ui-monospace, monospace; font-size: 12px; display: flex; align-items: center; gap: 6px; }
-.run-list .meta { color: var(--muted); font-size: 11px; margin-top: 2px; }
+.run-list .meta { color: var(--muted); font-size: 12px; margin-top: 2px; }
 .status-dot {
   display: inline-block; width: 8px; height: 8px; border-radius: 50%; flex: none;
   background: var(--muted);
@@ -81,13 +103,23 @@ input[type="search"] {
   padding: 8px 12px; border-bottom: 1px solid var(--line);
 }
 .panel-card > .head .title { font-weight: 600; }
-.panel-card > .head .src { font-size: 11px; color: var(--muted); font-family: ui-monospace, monospace; }
-.badge { font-size: 11px; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--line); }
+.panel-card > .head .src { font-size: 12px; color: var(--muted); font-family: ui-monospace, monospace; }
+.badge { font-size: 12px; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--line); }
 .badge.present { color: var(--present); border-color: var(--present); }
 .badge.absent { color: var(--absent); border-color: var(--absent); }
 .badge.stale { color: var(--absent); border-color: var(--absent); }
 .badge.valid { color: var(--present); border-color: var(--present); }
 .badge.missing, .badge.bad { color: var(--bad); border-color: var(--bad); }
+/* Lifecycle states shown as a badge in the run detail header (the other
+   lifecycle values reuse the neutral/present/absent colors above). */
+.badge.blocked { color: var(--absent); border-color: var(--absent); }
+.badge.failed { color: var(--bad); border-color: var(--bad); }
+.badge.completed { color: var(--present); border-color: var(--present); }
+.badge.running { color: var(--accent); border-color: var(--accent); }
+/* One plain next-step line under the header when a run is blocked/failed. */
+.recovery-hint { margin: 0 0 12px; font-size: 12px; color: var(--absent); }
+/* Second line of the empty-list state: the suggested next command. */
+.run-list li .hint { margin-top: 4px; font-size: 12px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
 pre.json {
   margin: 0; padding: 12px; overflow-x: auto; font-size: 12px;
   font-family: ui-monospace, SFMono-Regular, Menlo, monospace; line-height: 1.5;
@@ -99,7 +131,7 @@ pre.json {
 .err { color: var(--bad); }
 .struct-block { padding: 10px 12px; border-top: 1px solid var(--line); }
 .struct-block:first-child { border-top: none; }
-.struct-block .struct-title { font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--muted); margin-bottom: 6px; }
+.struct-block .struct-title { font-size: 12px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--muted); margin-bottom: 6px; }
 .struct-table { width: 100%; border-collapse: collapse; font-size: 12px; }
 .struct-table th, .struct-table td {
   text-align: left; padding: 4px 8px; border-bottom: 1px solid var(--line);