/* The embedded example uses the dashboard's exported tokens and UI patterns.
   Marketing composition stays flat; the example contains no real case data. */
.followup-board{font-family:var(--font-ui);font-size:var(--text-body);font-weight:var(--weight-body);line-height:1.6;color:var(--ink);background:var(--background);border:1px solid var(--control-line);border-radius:var(--radius-panel);overflow:hidden;min-width:0}
.board-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-compact);padding:var(--space-control) var(--space-group);border-bottom:1px solid var(--line);background:var(--surface);color:var(--ink)}
.board-header>span:first-child{display:flex;align-items:center;gap:var(--space-tight);font-size:var(--text-subheading);font-weight:var(--weight-heading)}
.board-header svg{width:18px;height:18px;color:var(--accent);flex:none}
.board-label{font-size:var(--text-micro);color:var(--muted);white-space:nowrap}
.board-workspace{padding:var(--space-group)}
.board-tabs{display:flex;width:100%;gap:var(--space-micro);padding:var(--space-micro);margin:0 0 var(--space-group);border:0;background:var(--surface-hover);border-radius:var(--radius-control)}
.board-tabs button{display:flex;justify-content:center;align-items:center;gap:6px;flex:1;min-width:0;min-height:var(--control-min-height);padding:var(--space-tight);font-family:inherit;font-size:var(--text-caption);font-weight:var(--weight-control);line-height:1.4;white-space:normal;border:0;border-radius:var(--radius-control);background:transparent;color:var(--muted);transition:background var(--transition-fast),color var(--transition-fast)}
.board-tabs button svg{width:16px;height:16px;flex:none}
.board-tabs button[aria-selected=true]{background:var(--accent-soft);color:var(--accent);font-weight:var(--weight-heading);box-shadow:inset 0 0 0 1px var(--control-line)}
.board-tabs button:hover{background:var(--surface);color:var(--accent)}
.board-tabs button:focus-visible{outline:var(--focus-width) solid var(--focus);outline-offset:var(--focus-offset)}
.board-panel{padding:0;min-height:280px}
.board-panel[hidden]{display:none}
.board-panel .board-state{font-size:var(--text-section);font-weight:var(--weight-heading);line-height:1.4;letter-spacing:0;color:var(--ink);margin:var(--space-control) 0 var(--space-tight);text-wrap:pretty}
.board-panel>p{font-size:var(--text-body);line-height:1.7;color:var(--ink);margin:0;max-width:65ch}
.board-status{display:inline-flex;align-items:center;gap:6px;padding:var(--space-micro) 9px;border-radius:var(--radius-label);font-size:var(--text-caption);font-weight:var(--weight-heading);line-height:1.45}
.board-status i{width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.board-status-blue{color:var(--status-blue);background:var(--status-blue-soft)}
.board-status-amber{color:var(--status-amber);background:var(--status-amber-soft)}
.board-panel dl{margin:var(--space-group) 0 0;font-size:var(--text-compact);line-height:1.6}
.board-panel dl>div{display:grid;grid-template-columns:1fr 1.5fr;gap:var(--space-control);padding:var(--space-compact) 0;border-top:1px solid var(--line)}
.board-panel dt{color:var(--muted);font-weight:var(--weight-body)}
.board-panel dd{margin:0;color:var(--ink);font-weight:var(--weight-heading)}
@media(max-width:620px){.board-header{padding:var(--space-control);flex-wrap:wrap;gap:var(--space-micro) var(--space-compact)}.board-workspace{padding:var(--space-control)}.board-tabs{margin-bottom:var(--space-control)}.board-tabs button{flex-direction:column;padding:var(--space-tight) var(--space-micro);font-size:var(--text-caption)}.board-panel{min-height:350px}.board-panel dl>div{grid-template-columns:1fr;gap:var(--space-micro)}}
@media(prefers-reduced-motion:reduce){.board-tabs button{transition:none}}