/* Contract lifecycle specimens reuse the shared typography and semantic tokens. */
.cl-example #example-main { max-width:1440px; margin:auto; padding:32px; }
.cl-example .application-navbar { flex-wrap:wrap; }
.cl-heading,.cl-pagination { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.cl-heading h3,.cl-heading p { margin:0; }.cl-heading p { margin-top:8px; }
.cl-grid { display:grid; gap:20px; margin:24px 0; align-items:end; }
.cl-grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }.cl-grid.three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.cl-grid .field { margin:0; min-width:0; }
.cl-caption { font-size:12px; line-height:18px; color:var(--pv-secondary); }
.cl-actions,.cl-toolbar { display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.cl-toolbar { margin-bottom:16px; }.cl-actions .button,.cl-toolbar .button { white-space:normal; }
.cl-notice:not(:empty) { padding:16px; border-radius:12px; background:var(--pv-info-bg); color:var(--pv-info-fg); margin:20px 0; }
.cl-notice[data-state=error] { background:var(--pv-error-bg); color:var(--pv-error-fg); }.cl-notice[data-state=stale] { background:var(--pv-warning-bg); color:var(--pv-warning-fg); }
.cl-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin:24px 0; }
.cl-metric { padding:16px; background:var(--pv-muted); border:1px solid var(--pv-border); border-radius:12px; }
.cl-metric > span { color:var(--pv-secondary); font-size:12px; }.cl-metric > strong { display:block; font-size:24px; line-height:32px; margin-top:8px; overflow-wrap:anywhere; }
.cl-table-scroll { width:100%; overflow:auto; overscroll-behavior-inline:contain; }
.cl-table { width:100%; min-width:980px; border-collapse:collapse; }.cl-table th,.cl-table td { text-align:left; padding:16px; border-bottom:1px solid var(--pv-border); }
.cl-table th { background:var(--pv-muted); font-size:12px; }.cl-table small { display:block; color:var(--pv-secondary); margin-top:8px; }
.cl-table .button { padding:8px 12px; min-height:36px; text-align:left; }.cl-sort { display:flex; align-items:center; gap:8px; font:inherit; color:inherit; border:0; background:transparent; padding:0; }
.cl-pagination { margin-top:24px; }.cl-pagination p { margin:0; font-size:12px; color:var(--pv-secondary); }
.cl-subheading { margin:32px 0 20px; }.cl-subheading h3 { margin-bottom:8px; }
.cl-detail { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:24px; border-top:1px solid var(--pv-border); padding-top:24px; }
.cl-detail-nav { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:12px 24px; }
.cl-detail-nav a { padding:8px 0; }.cl-facts { display:grid; grid-template-columns:minmax(120px,.7fr) minmax(0,1fr); gap:12px 20px; margin:16px 0; }
.cl-facts dt { color:var(--pv-secondary); }.cl-facts dd { margin:0; overflow-wrap:anywhere; }
.cl-lifecycle { list-style:none; padding:0; display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }.cl-lifecycle li { padding:8px 12px; border:1px solid var(--pv-border); border-radius:999px; font-size:12px; color:var(--pv-secondary); }
.cl-lifecycle [aria-current] { background:var(--pv-info-bg); color:var(--pv-info-fg); border-color:currentColor; font-weight:600; }
.cl-activity { padding-left:20px; color:var(--pv-secondary); }.cl-activity li { margin-bottom:16px; font-size:12px; line-height:18px; }
.cl-spaced { margin-top:24px; }.cl-divider { border-top:1px solid var(--pv-border); margin:24px 0; }
.cl-body .field { margin-bottom:20px; }.cl-body .cl-grid .field { margin-bottom:0; }.cl-body textarea { border-radius:12px; }
.cl-badge { display:inline-flex; font-size:12px; line-height:18px; padding:4px 10px; border-radius:999px; background:var(--pv-info-bg); color:var(--pv-info-fg); width:fit-content; }
.cl-record { padding:16px; border:1px solid var(--pv-border); border-radius:12px; margin-bottom:12px; display:flex; flex-direction:column; gap:8px; min-width:0; overflow-wrap:anywhere; }
.cl-record p { margin:0; }.cl-record small { color:var(--pv-secondary); }.cl-record .cl-actions { margin-top:8px; }.cl-record > .button { align-self:flex-start; margin-top:8px; }
.cl-empty { padding:20px; border:1px dashed var(--pv-border); border-radius:12px; color:var(--pv-secondary); }
.cl-extract-row { display:grid; grid-template-columns:24px minmax(0,1fr) minmax(140px,1fr); align-items:center; gap:12px; padding:20px 0; border-bottom:1px solid var(--pv-border); }
.cl-extract-row input:not([type=checkbox]) { grid-column:2/-1; }.cl-extract-row blockquote { grid-column:2/-1; margin:0; padding:12px 16px; font-size:12px; overflow-wrap:anywhere; background:var(--pv-muted); border-left:3px solid var(--pv-border); }
.cl-diff { max-height:420px; overflow:auto; border:1px solid var(--pv-border); border-radius:12px; }.cl-diff-line { padding:12px 16px; border-bottom:1px solid var(--pv-border); overflow-wrap:anywhere; }.cl-diff-line p { margin:8px 0; white-space:pre-wrap; }.cl-diff-line small { color:var(--pv-secondary); }.cl-diff del { background:var(--pv-error-bg); color:var(--pv-error-fg); }.cl-diff ins { background:var(--pv-success-bg); color:var(--pv-success-fg); }
.cl-placement { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:24px; margin-top:24px; }
.cl-paper { min-height:400px; position:relative; border:1px solid var(--pv-border); border-radius:12px; padding:20px; background:var(--pv-muted); overflow:hidden; }.cl-paper > .cl-caption { max-width:80%; }
.cl-sign-marker { position:absolute; width:28%; max-height:15%; overflow:hidden; border:1px dashed var(--pv-info-fg); background:var(--pv-info-bg); color:var(--pv-info-fg); border-radius:6px; padding:8px; font-size:12px; line-height:16px; }
.cl-demo-options,.cl-report { margin-top:24px; padding-top:24px; border-top:1px solid var(--pv-border); }
.cl-chart-row { display:grid; grid-template-columns:160px minmax(0,1fr) 80px; align-items:center; gap:12px; margin:12px 0; font-size:12px; }.cl-chart-bar { background:var(--pv-heading); min-height:20px; border-radius:4px; transition:width .25s ease; }.cl-chart-row strong { text-align:right; }
#cl-confirm-dialog,#cl-evidence-dialog { width:min(560px,calc(100vw - 32px)); }#cl-evidence-dialog textarea { border-radius:12px; }
@media(max-width:1000px) { .cl-grid.three { grid-template-columns:repeat(2,minmax(0,1fr)); }.cl-detail,.cl-placement { grid-template-columns:minmax(0,1fr); } }
@media(max-width:640px) { .cl-example #example-main { padding:24px 16px; }.cl-grid.two,.cl-grid.three { grid-template-columns:minmax(0,1fr); }.cl-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.cl-metric { padding:12px; }.cl-metric > strong { font-size:20px; line-height:28px; }.cl-facts { grid-template-columns:minmax(0,1fr); gap:4px; }.cl-facts dd { margin-bottom:12px; }.cl-extract-row { grid-template-columns:24px minmax(0,1fr); }.cl-extract-row .cl-caption { grid-column:2/-1; }.cl-table .button { min-height:44px; }.cl-chart-row { grid-template-columns:110px minmax(0,1fr) 70px; gap:8px; }.cl-body input,.cl-body textarea { font-size:16px; }.cl-actions .button { flex-grow:1; }.cl-paper { min-height:360px; }.cl-sign-marker { padding:4px; }.cl-pagination .row { margin-left:auto; } }
@media(prefers-reduced-motion:reduce) { .cl-chart-bar { transition:none; } }
.cl-calendars { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr)); gap:16px; margin-top:24px; }.cl-calendar { width:100%; table-layout:fixed; border-collapse:collapse; font-size:12px; }.cl-calendar caption { text-align:left; padding:12px 0; font-weight:600; color:var(--pv-heading); }.cl-calendar th,.cl-calendar td { padding:4px 0; text-align:center; border:0; }.cl-calendar th { color:var(--pv-secondary); font-weight:400; }.cl-calendar td span { display:inline-flex; align-items:center; justify-content:center; width:28px; height:28px; }.cl-calendar-date { border-radius:50%; background:var(--pv-info-bg); color:var(--pv-info-fg); outline:1px solid currentColor; font-weight:600; }