@starlove/orbit 1.0.6 → 1.0.7

package/dist/full/{styles.c2e3d20a.css → styles.14e9dbbd.css}

@@ -76,6 +76,7 @@ input[type="file"] {
   --orbit-add-border: rgba(29, 37, 40, 0.12);
   --orbit-phantom-border: rgba(29, 37, 40, 0.14);
   --orbit-phantom-bg: rgba(29, 37, 40, 0.03);
+  --kanban-column-width: 22rem;
   --scrollbar-thumb: rgba(var(--accent-rgb),0.45);
   --scrollbar-thumb-hover: rgba(var(--accent-rgb),0.65);
   --scrollbar-track: transparent;
@@ -100,6 +101,12 @@ input[type="file"] {
   --select-chevron-size: 12px;
 }
 
+@media (max-width: 720px) {
+  :root {
+    --kanban-column-width: 18rem;
+  }
+}
+
 * {
   box-sizing: border-box;
 }
@@ -529,6 +536,12 @@ h1 {
   scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
 }
 
+#boardFlyout {
+  min-width: 20.25rem;
+  max-width: min(30rem, calc(100vw - 1.5rem));
+  max-height: min(36rem, calc(100vh - 4rem));
+}
+
 .menu-flyout--align-end {
   right: 0;
   left: auto;
@@ -1109,7 +1122,7 @@ h1 {
 /* Horizontal scroll: styled thumb/track (Firefox + WebKit). */
 .kanban {
   display: grid;
-  grid-auto-columns: minmax(17rem, 1fr);
+  grid-auto-columns: minmax(var(--kanban-column-width), 1fr);
   grid-auto-flow: column;
   grid-template-rows: minmax(0, 1fr);
   flex: 1 1 auto;
@@ -1704,8 +1717,8 @@ h1 {
 /* Epic-aware grouping inside a column.
    `.epic-children` is a flex item nested in `.column` (which is itself flex-column,
    gap 0.7rem). Right-aligning + narrowing it makes its cards read as indented
-   children of the epic card or `.epic-mini-header` directly above. The negative
-   margin-top tightens the visual link by halving the column gap. */
+   children of the epic card or full-width `.epic-mini-header` directly above.
+   The negative margin-top tightens the visual link by halving the column gap. */
 .epic-children {
   display: flex;
   flex-direction: column;
@@ -1744,15 +1757,14 @@ h1 {
     0 8px 20px rgba(0, 0, 0, 0.25);
 }
 
-/* Thin "header" that stands in for the epic when its children sit in a different
-   column. Visually pairs with the `.epic-children` block right below it: same
-   width and right-alignment, slim purple bar shape. */
+/* Thin full-width "header" that stands in for the epic when its children sit in
+   a different column. Children remain narrowed underneath so the hierarchy is
+   visible without cutting the lane width at the epic anchor. */
 .epic-mini-header {
   display: flex;
   align-items: center;
   gap: 0.4rem;
-  width: 92%;
-  align-self: flex-end;
+  width: 100%;
   padding: 0.45rem 0.6rem;
   border-radius: 10px 10px 4px 4px;
   background: rgba(var(--purple-rgb), 0.10);
@@ -2144,7 +2156,13 @@ h1 {
   background: var(--drawer-bg);
   box-shadow: 0 24px 60px rgba(12, 18, 26, 0.28);
   transform: translateX(calc(100% + 1.5rem));
-  transition: transform 320ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition:
+    transform 320ms cubic-bezier(0.4, 0, 0.2, 1),
+    width 180ms ease;
+}
+
+.drawer.is-wide {
+  width: min(58rem, calc(100vw - 1rem));
 }
 
 .drawer.is-open {
@@ -2286,8 +2304,8 @@ h1 {
   border-color: var(--accent-border);
 }
 
-.drawer-close {
-  grid-area: close;
+.drawer-close,
+.drawer-archive {
   display: inline-grid;
   place-items: center;
   width: 2rem;
@@ -2297,10 +2315,14 @@ h1 {
   border-radius: 10px;
   background: var(--surface);
   color: var(--ink);
+  cursor: url('cursors/live_link.cur'), pointer;
+}
+
+.drawer-close {
+  grid-area: close;
   font-size: 1.35rem;
   font-weight: 400;
   line-height: 1;
-  cursor: url('cursors/live_link.cur'), pointer;
 }
 
 .drawer-close:hover {
@@ -2310,16 +2332,6 @@ h1 {
 
 .drawer-archive {
   grid-area: archive;
-  display: inline-grid;
-  place-items: center;
-  width: 2rem;
-  height: 2rem;
-  padding: 0;
-  border: 1px solid var(--line);
-  border-radius: 10px;
-  background: var(--surface);
-  color: var(--ink);
-  cursor: url('cursors/live_link.cur'), pointer;
 }
 
 .drawer-archive:hover {
@@ -2463,6 +2475,95 @@ h1 {
   white-space: pre-wrap;
 }
 
+.markdown-body {
+  white-space: normal;
+  overflow-wrap: anywhere;
+}
+
+.markdown-body p,
+.markdown-body ul,
+.markdown-body ol,
+.markdown-body pre {
+  margin: 0;
+}
+
+.markdown-body p + p,
+.markdown-body p + ul,
+.markdown-body p + ol,
+.markdown-body p + pre,
+.markdown-body ul + p,
+.markdown-body ul + ol,
+.markdown-body ul + pre,
+.markdown-body ol + p,
+.markdown-body ol + ul,
+.markdown-body ol + pre,
+.markdown-body pre + p,
+.markdown-body pre + ul,
+.markdown-body pre + ol {
+  margin-top: 0.55rem;
+}
+
+.markdown-body ul,
+.markdown-body ol {
+  padding-left: 1.25rem;
+}
+
+.markdown-body li + li {
+  margin-top: 0.2rem;
+}
+
+.markdown-body code {
+  border: 1px solid rgba(var(--blue-rgb), 0.18);
+  border-radius: 0.35rem;
+  padding: 0.05rem 0.25rem;
+  color: var(--ink);
+  background: rgba(var(--blue-rgb), 0.08);
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
+  font-size: 0.9em;
+}
+
+.markdown-body pre {
+  padding: 0.65rem 0.75rem;
+  overflow: auto;
+  border: 1px solid var(--line);
+  border-radius: 10px;
+  background: var(--surface-card);
+}
+
+.markdown-body pre code {
+  display: block;
+  border: 0;
+  padding: 0;
+  background: transparent;
+  white-space: pre;
+}
+
+.markdown-body a {
+  color: var(--blue);
+  font-weight: 700;
+  text-decoration: underline;
+  text-decoration-thickness: 0.08em;
+  text-underline-offset: 0.15em;
+}
+
+.card-description {
+  margin-top: 0.45rem;
+  color: var(--muted);
+  font-size: 0.82rem;
+  line-height: 1.45;
+}
+
+.card .markdown-body p {
+  display: block;
+  overflow: visible;
+  -webkit-line-clamp: unset;
+  -webkit-box-orient: initial;
+}
+
+.card .markdown-body pre {
+  max-height: 8rem;
+}
+
 /* The detail pane's lede description is body copy, not a card excerpt — give
    it more presence than the universal muted .description rule. */
 .detail-head > .description {
@@ -3194,6 +3295,157 @@ details.section > summary .mcp-title-row {
   margin-bottom: 0.85rem;
 }
 
+.appearance-theme-section {
+  margin-top: 0.4rem;
+}
+
+.appearance-theme-section + .section:has(> .orbit-check:first-child) {
+  margin-top: 1.25rem;
+}
+
+.appearance-theme-field {
+  display: grid;
+  gap: 0.55rem;
+  min-width: 0;
+  margin: 0;
+  padding: 0;
+  border: 0;
+}
+
+.appearance-theme-field legend {
+  margin-bottom: 0.55rem;
+  color: var(--ink);
+  font-size: 0.88rem;
+  font-weight: 800;
+}
+
+.appearance-theme-options {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 0.5rem;
+}
+
+.appearance-theme-option {
+  position: relative;
+  display: inline-flex;
+  min-width: 0;
+  min-height: 2.5rem;
+  align-items: center;
+  justify-content: center;
+  gap: 0.45rem;
+  padding: 0.5rem 0.72rem;
+  border: 1px solid var(--line);
+  border-radius: 10px;
+  background: var(--surface-dim);
+  color: var(--ink);
+  font-size: 0.86rem;
+  font-weight: 700;
+  cursor: url('cursors/live_link.cur'), pointer;
+  transition:
+    border-color 160ms ease,
+    background 160ms ease,
+    box-shadow 160ms ease,
+    color 160ms ease;
+}
+
+.appearance-theme-option:hover {
+  border-color: var(--accent-border);
+  background: var(--accent-hover);
+}
+
+.appearance-theme-option input[type="radio"] {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+
+.appearance-theme-option-mark {
+  display: grid;
+  width: 1.35rem;
+  height: 1.35rem;
+  flex: 0 0 auto;
+  place-items: center;
+  border: 1px solid var(--accent-border);
+  border-radius: 999px;
+  background: var(--surface-input);
+  transition:
+    background 160ms ease,
+    border-color 160ms ease,
+    box-shadow 160ms ease;
+}
+
+.appearance-theme-option-icon {
+  width: 0.9rem;
+  height: 0.9rem;
+}
+
+.appearance-theme-option-label {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.appearance-theme-option:has(input[type="radio"]:checked) {
+  border-color: var(--accent);
+  background:
+    linear-gradient(135deg, rgba(var(--accent-rgb),0.12), rgba(var(--blue-rgb),0.08)),
+    var(--surface-dim);
+  box-shadow:
+    inset 0 0 0 1px rgba(var(--accent-rgb),0.18),
+    0 4px 10px rgba(var(--accent-rgb),0.12);
+}
+
+.appearance-theme-option:has(input[type="radio"]:checked) .appearance-theme-option-mark {
+  border-color: var(--accent);
+  color: #fff;
+  background:
+    linear-gradient(135deg, rgba(var(--accent-rgb),0.95), rgba(var(--blue-rgb),0.95));
+}
+
+.appearance-theme-option input[type="radio"]:focus-visible ~ .appearance-theme-option-mark {
+  box-shadow: var(--accent-ring);
+}
+
+[data-theme="dark"] .appearance-theme-option {
+  background: rgba(15, 25, 50, 0.55);
+  border-color: rgba(var(--starlight-rgb),0.16);
+}
+
+[data-theme="dark"] .appearance-theme-option:hover {
+  border-color: rgba(var(--starlight-rgb),0.4);
+  background: rgba(var(--starlight-rgb),0.08);
+}
+
+[data-theme="dark"] .appearance-theme-option-mark {
+  border-color: rgba(var(--starlight-rgb),0.35);
+  background:
+    linear-gradient(135deg, rgba(var(--starlight-rgb),0.06), rgba(var(--cosmos-rgb),0) 65%),
+    rgba(15, 25, 50, 0.7);
+}
+
+[data-theme="dark"] .appearance-theme-option:has(input[type="radio"]:checked) {
+  border-color: rgba(var(--starlight-rgb),0.55);
+  background:
+    linear-gradient(135deg, rgba(var(--starlight-rgb),0.13), rgba(var(--violet-rgb),0.08)),
+    rgba(15, 25, 50, 0.65);
+  box-shadow:
+    inset 0 0 0 1px rgba(var(--starlight-rgb),0.18),
+    0 4px 14px rgba(var(--starlight-rgb),0.16);
+}
+
+[data-theme="dark"] .appearance-theme-option:has(input[type="radio"]:checked) .appearance-theme-option-mark {
+  border-color: rgba(var(--starlight-rgb),0.7);
+  color: #0a1024;
+  background: linear-gradient(135deg, #d6e6ff, #a8c0ff);
+}
+
 /* Lanes tab opens directly with the checkbox — drop the default .section
    top margin so it sits flush under the drawer tabs. */
 .section:has(> .orbit-check:first-child) {
@@ -4828,6 +5080,27 @@ button:disabled,
   }
 }
 
+[data-reduced-motion="reduce"] *,
+[data-reduced-motion="reduce"] *::before,
+[data-reduced-motion="reduce"] *::after {
+  scroll-behavior: auto !important;
+  transition-duration: 0.01ms !important;
+  animation-duration: 0.01ms !important;
+  animation-iteration-count: 1 !important;
+}
+
+[data-reduced-motion="reduce"][data-theme="dark"] .starfield,
+[data-reduced-motion="reduce"][data-theme="dark"] .milky-way,
+[data-reduced-motion="reduce"][data-theme="dark"] .grain::before,
+[data-reduced-motion="reduce"][data-theme="dark"] .grain::after,
+[data-reduced-motion="reduce"][data-theme="dark"] .signature-star {
+  animation: none;
+}
+
+[data-reduced-motion="reduce"][data-theme="dark"] .meteor {
+  display: none;
+}
+
 [data-theme="dark"] {
   /* Tells the browser to render native widgets (dropdowns, scrollbars,
      date pickers, etc.) in their dark variant so option popups match. */

package/dist/full/version.json

@@ -1,6 +1,6 @@
 {
   "name": "@starlove/orbit",
-  "version": "1.0.6",
+  "version": "1.0.7",
   "edition": "full",
-  "builtAt": "2026-05-20T07:25:07.448Z"
+  "builtAt": "2026-05-23T20:12:10.627Z"
 }

package/docs/AGENT_PROTOCOL.md

@@ -4,6 +4,8 @@ The board is intentionally agent-first. Agents should not scrape the UI. They sh
 
 If an MCP client is available, use the MCP server instead of rebuilding these HTTP calls yourself. The MCP tools map directly to the same core operations.
 
+Never edit `.orbit/board.db` directly to create or mutate cards. The SQLite file is Orbit's storage detail; use the HTTP API or MCP tools so validation, events, search indexing, backups, and cross-process locking all run.
+
 ## Core Flow
 
 1. `POST /api/agent/claim-next`
@@ -298,6 +300,8 @@ Over MCP these are exposed as `board_archive_ticket`, `board_restore_ticket`, `b
 
 Ticket types are `epic`, `feature`, `task`, and `bug`.
 
+MCP equivalent: `board_create_ticket`. Use it for new cards instead of modifying `.orbit/board.db`.
+
 Create the epic/story parent first:
 
 ```http

package/docs/MCP_SETUP.md

@@ -29,7 +29,9 @@ The checked-in example file is not read automatically by Starscape Orbit. It exi
 3. Replace the path to `src/mcp-server.js` with the absolute path on your machine.
 4. Restart the MCP client.
 
-The MCP server finds a board from an explicit project root first: pass `orbit mcp --cwd <repo>` or set `PROJECT_ROOT=<repo>` in persistent MCP configs. If neither is set, it falls back to the process cwd and walks upward to the first ancestor with `.orbit/board.db`. Prefer explicit roots for long-lived agent configs so launching the agent from another folder does not attach the wrong board. **`AGENTS.md` / `SKILL-ORBIT.md`** are unrelated to MCP transport: agents open them via the workspace file tree, and `orbit init` keeps a terse Orbit pointer section in `AGENTS.md`.
+By default MCP runs in local mode. It finds a board from an explicit project root first: pass `orbit mcp --cwd <repo>` or set `PROJECT_ROOT=<repo>` in persistent MCP configs. If neither is set, it falls back to the process cwd and walks upward to the first ancestor with `.orbit/board.db`. Prefer explicit roots for long-lived agent configs so launching the agent from another folder does not attach the wrong board.
+
+For a shared/deployed board, run MCP in remote mode instead: set `ORBIT_MODE=remote`, `ORBIT_API_URL=<server origin>`, and usually `ORBIT_DEFAULT_BOARD=<slug-or-id>`. Remote mode calls the HTTP API and does not open or auto-create local `.orbit` databases; it fails at startup if `ORBIT_API_URL` is missing. **`AGENTS.md` / `SKILL-ORBIT.md`** are unrelated to MCP transport: agents open them via the workspace file tree, and `orbit init` keeps a terse Orbit pointer section in `AGENTS.md`.
 
 Typical use:
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@starlove/orbit",
-  "version": "1.0.6",
-  "description": "Starscape Orbit — SQLite-backed, agent-first task board (Starscape suite).",
+  "version": "1.0.7",
+  "description": "Starscape Orbit — zero-dependency, pretty, human-ai-first kanban system.",
   "license": "AGPL-3.0",
   "type": "module",
   "packageManager": "pnpm@10.20.0",

package/public/js/api.js

@@ -9,7 +9,11 @@ import { request } from "./transport.js";
 
 /** Bootstrap for the currently selected board (server opens the right DB). */
 export function bootstrapPath() {
-  const q = state.boardId ? `?board_id=${encodeURIComponent(state.boardId)}` : "";
+  const q = state.boardId
+    ? `?board_id=${encodeURIComponent(state.boardId)}`
+    : state.boardSlug
+      ? `?board=${encodeURIComponent(state.boardSlug)}`
+      : "";
   return `/api/bootstrap${q}`;
 }
 

package/public/js/drawer.js

@@ -50,6 +50,7 @@ export function closeDrawer() {
     }
     if (subtitleEl) { subtitleEl.innerHTML = ""; subtitleEl.hidden = true; }
     if (tabsEl) { tabsEl.innerHTML = ""; tabsEl.hidden = true; }
+    drawer.classList.remove("is-wide");
   };
 
   if (!wasOpen) {
@@ -75,6 +76,7 @@ export function closeDrawer() {
  */
 export function renderDrawerShell({ eyebrow, title, titleAttrs, subtitleHtml, tabs, activeTab, onTabSelect, body, mode }) {
   drawer.classList.toggle("is-settings", mode === "settings");
+  drawer.classList.toggle("is-wide", mode === "ticket" || mode === "settings");
   const eyebrowEl = document.getElementById("drawerEyebrow");
   const titleEl = document.getElementById("drawerTitle");
   const subtitleEl = document.getElementById("drawerSubtitle");

package/public/js/format.js

@@ -10,6 +10,148 @@ export function escapeHtml(value) {
     .replaceAll("'", "'");
 }
 
+const SAFE_LINK_PROTOCOLS = new Set(["http:", "https:", "mailto:", "tel:"]);
+
+function sanitizeMarkdownUrl(value) {
+  const href = String(value || "").trim();
+  if (!href) return "";
+
+  // Collapse control characters/whitespace before checking the scheme so inputs
+  // like `java\nscript:` or `jav\tascript:` cannot bypass the blocklist.
+  const compact = href.replace(/[\u0000-\u001f\u007f\s]+/g, "").toLowerCase();
+  if (/^(?:javascript|data|vbscript):/.test(compact)) return "";
+
+  const scheme = compact.match(/^([a-z][a-z0-9+.-]*):/);
+  if (scheme && !SAFE_LINK_PROTOCOLS.has(`${scheme[1]}:`)) return "";
+
+  return href;
+}
+
+function renderEmphasis(text) {
+  let html = escapeHtml(text);
+  html = html.replace(/(\*\*|__)(?=\S)([\s\S]*?\S)\1/g, "<strong>$2</strong>");
+  html = html.replace(/(\*|_)(?=\S)([^*_]*?\S)\1/g, "<em>$2</em>");
+  return html;
+}
+
+function renderLinksAndEmphasis(text) {
+  const linkPattern = /\[([^\]\n]+)\]\(([^)\s]+)(?:\s+"[^"]*")?\)/g;
+  let html = "";
+  let lastIndex = 0;
+  let match;
+
+  while ((match = linkPattern.exec(text))) {
+    html += renderEmphasis(text.slice(lastIndex, match.index));
+
+    const labelHtml = renderEmphasis(match[1]);
+    const href = sanitizeMarkdownUrl(match[2]);
+    html += href
+      ? `<a href="${escapeHtml(href)}" target="_blank" rel="noopener noreferrer">${labelHtml}</a>`
+      : labelHtml;
+
+    lastIndex = match.index + match[0].length;
+  }
+
+  html += renderEmphasis(text.slice(lastIndex));
+  return html;
+}
+
+function renderInlineMarkdown(text) {
+  const source = String(text ?? "");
+  let html = "";
+  let cursor = 0;
+
+  while (cursor < source.length) {
+    const codeStart = source.indexOf("`", cursor);
+    if (codeStart === -1) {
+      html += renderLinksAndEmphasis(source.slice(cursor));
+      break;
+    }
+
+    const codeEnd = source.indexOf("`", codeStart + 1);
+    if (codeEnd === -1) {
+      html += renderLinksAndEmphasis(source.slice(cursor));
+      break;
+    }
+
+    html += renderLinksAndEmphasis(source.slice(cursor, codeStart));
+    html += `<code>${escapeHtml(source.slice(codeStart + 1, codeEnd))}</code>`;
+    cursor = codeEnd + 1;
+  }
+
+  return html;
+}
+
+function renderParagraph(lines) {
+  return `<p>${renderInlineMarkdown(lines.join("\n")).replaceAll("\n", "<br>")}</p>`;
+}
+
+export function renderMarkdown(value) {
+  const source = String(value ?? "").replace(/\r\n?/g, "\n");
+  if (!source.trim()) return "";
+
+  const blocks = [];
+  const lines = source.split("\n");
+  let paragraph = [];
+  let list = null;
+
+  const flushParagraph = () => {
+    if (!paragraph.length) return;
+    blocks.push(renderParagraph(paragraph));
+    paragraph = [];
+  };
+
+  const flushList = () => {
+    if (!list) return;
+    blocks.push(`<${list.type}>${list.items.map((item) => `<li>${item}</li>`).join("")}</${list.type}>`);
+    list = null;
+  };
+
+  for (let i = 0; i < lines.length; i += 1) {
+    const line = lines[i];
+
+    if (/^\s*```/.test(line)) {
+      flushParagraph();
+      flushList();
+      const codeLines = [];
+      i += 1;
+      while (i < lines.length && !/^\s*```\s*$/.test(lines[i])) {
+        codeLines.push(lines[i]);
+        i += 1;
+      }
+      blocks.push(`<pre><code>${escapeHtml(codeLines.join("\n"))}</code></pre>`);
+      continue;
+    }
+
+    if (!line.trim()) {
+      flushParagraph();
+      flushList();
+      continue;
+    }
+
+    const ordered = line.match(/^\s*\d+[.)]\s+(.+)$/);
+    const unordered = line.match(/^\s*[-*+]\s+(.+)$/);
+    if (ordered || unordered) {
+      flushParagraph();
+      const type = ordered ? "ol" : "ul";
+      if (!list || list.type !== type) {
+        flushList();
+        list = { type, items: [] };
+      }
+      list.items.push(renderInlineMarkdown((ordered || unordered)[1].trim()).replaceAll("\n", "<br>"));
+      continue;
+    }
+
+    flushList();
+    paragraph.push(line.trim());
+  }
+
+  flushParagraph();
+  flushList();
+
+  return blocks.join("");
+}
+
 export function formatDate(value) {
   if (!value) return "";
   return new Intl.DateTimeFormat(undefined, {

package/public/js/kanban.js

@@ -12,7 +12,8 @@ import {
   typeLabel,
   priorityLabel,
   priorityKeyFor,
-  renderLabels
+  renderLabels,
+  renderMarkdown
 } from "./format.js";
 import { api, withBoardQuery } from "./api.js";
 import { navigate } from "./router.js";
@@ -70,6 +71,11 @@ export function renderBoard() {
     // follow-up click so dropping a card does not also open the detail drawer.
     let suppressClickAfterDrag = false;
     card.addEventListener("click", async (event) => {
+      const clickTarget = event.target instanceof Element ? event.target : event.target?.parentElement;
+      if (clickTarget?.closest("a")) {
+        event.stopPropagation();
+        return;
+      }
       if (suppressClickAfterDrag) {
         suppressClickAfterDrag = false;
         event.preventDefault();
@@ -336,7 +342,8 @@ function renderCard(ticket, { asEpicChild = false } = {}) {
   const priorityKey = priorityKeyFor(ticket.priority);
   const typeText = typeLabel(ticket.type).toUpperCase();
   const isExpanded = state.expandedCardIds.has(ticket.id);
-  const hasExpandable = (ticket.labels && ticket.labels.length) || ticket.parent_ticket || ticket.child_count;
+  const hasDescription = Boolean(String(ticket.description || "").trim());
+  const hasExpandable = hasDescription || (ticket.labels && ticket.labels.length) || ticket.parent_ticket || ticket.child_count;
 
   const triggerInner = `
     <span class="ticket-number">${escapeHtml(ticketLabel(ticket))}</span>
@@ -368,6 +375,7 @@ function renderCard(ticket, { asEpicChild = false } = {}) {
 
       ${hasExpandable ? `
         <div class="card-expandable">
+          ${hasDescription ? `<div class="card-description markdown-body">${renderMarkdown(ticket.description)}</div>` : ""}
           ${renderLabels(ticket.labels)}
           ${ticket.parent_ticket ? `<div class="parent-line">-> ${escapeHtml(ticketLabel(ticket.parent_ticket))}</div>` : ""}
           ${ticket.child_count ? `<div class="child-count">${ticket.child_count} feature${ticket.child_count === 1 ? "" : "s"} inside</div>` : ""}