/* Shared frame for the design-tab cards. Tokens live in tokens.css; this file only lays out the specimen pages. */
@import url("tokens.css");
*{box-sizing:border-box}
body{margin:0;background:var(--color-bg);color:var(--color-text);font:var(--weight-regular) var(--text-body)/var(--leading-body) var(--font-body);font-variant-numeric:tabular-nums lining-nums;padding:var(--space-6)}
:focus-visible{outline:var(--focus-ring);outline-offset:var(--focus-offset);border-radius:var(--radius-xs)}
.ds-h{font:var(--weight-regular) var(--text-heading)/var(--leading-heading) var(--font-display);margin:0 0 var(--space-2)}
.ds-say{margin:0 0 var(--space-5);max-width:62ch;color:var(--color-text-muted)}
.ds-status{display:inline-block;font:var(--weight-medium) var(--text-xs)/1 var(--font-body);color:var(--color-accent);background:var(--color-accent-tint);border-radius:var(--radius-pill);padding:6px 10px;margin-bottom:var(--space-4)}
.ds-grid{display:grid;gap:var(--space-5)}
.ds-label{font:var(--weight-medium) var(--text-xs)/1.3 var(--font-body);color:var(--color-text-muted)}
code{font:inherit;color:var(--color-text)}
.ds-row{display:flex;flex-wrap:wrap;gap:var(--space-5);align-items:flex-end}
.ds-item{display:grid;gap:var(--space-2);justify-items:start}

/* design.chimpvibe.dev site copy only (not in PR #83): two narrow-width spills.
   1. A long author name ran into "Open the tree" on narrow cards. 2. The tag sample overflowed its colour chip. */
.cv-card__author{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sw .chip{min-width:0;overflow:hidden;white-space:nowrap}
.sw .chip[style*="take-tint"]{font-size:14px;letter-spacing:0}