/* A compact, explicit demonstration within the existing ivory/navy folio. */
.cobar-walkthrough{
  --demo-ink:#14263c;--demo-muted:#465466;--demo-rule:#c8c5ba;
  --demo-paper:#f8f5ef;--demo-surface:#eae5da;--demo-accent:#76502f;
  color:var(--demo-ink);font-family:SourceSans,Arial,sans-serif;
  border:1px solid var(--demo-rule);background:var(--demo-paper);
  margin-block:32px;border-radius:3px;overflow:clip;min-width:0;
}
.workroom-case .article-body .cobar-walkthrough-heading{padding:24px 26px 22px}
.workroom-case .article-body .cobar-example-kicker{
  font-size:10px;line-height:1.5;letter-spacing:.11em;color:var(--demo-accent);margin:0 0 10px;
}
.workroom-case .article-body .cobar-walkthrough-heading h2{
  font-family:SourceSans,Arial,sans-serif;font-size:25px;line-height:1.25;
  letter-spacing:-.02em;font-weight:600;margin:0 0 12px;
}
.workroom-case .article-body .cobar-walkthrough-heading>p:last-child{
  font-size:15px;line-height:1.6;margin:0;color:var(--demo-muted);max-width:59ch;
}
.cobar-walkthrough-controls[hidden],.cobar-walkthrough-panel[hidden]{display:none}
.cobar-walkthrough-controls{border-block:1px solid var(--demo-rule)}
.cobar-walkthrough-controls>[data-cobar-tabs]{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.cobar-walkthrough [data-cobar-step]{
  appearance:none;background:none;border:0;border-radius:0;font:inherit;
  color:var(--demo-muted);text-align:left;min-height:64px;min-width:0;padding:12px 15px;
  position:relative;display:flex;gap:8px;align-items:center;cursor:pointer;
  font-size:13px;font-weight:600;line-height:1.3;transition:background-color .24s ease,color .24s ease;
}
.cobar-walkthrough [data-cobar-step]+[data-cobar-step]{border-left:1px solid var(--demo-rule)}
.cobar-walkthrough [data-cobar-step]::after{
  content:'';height:2px;position:absolute;inset:auto 0 0;background:var(--demo-ink);
  transform:scaleX(0);transform-origin:center;transition:transform .24s ease;
}
.cobar-walkthrough [data-cobar-step][aria-selected=true]{color:var(--demo-ink);background:#14263c08}
.cobar-walkthrough [data-cobar-step][aria-selected=true]::after{transform:scaleX(1)}
.cobar-walkthrough [data-cobar-step]:hover{color:var(--demo-ink);background:#14263c08}
.cobar-walkthrough [data-cobar-step]:focus-visible,.cobar-walkthrough-panel:focus-visible{
  outline:2px solid var(--demo-accent);outline-offset:-4px;
}
.cobar-step-number{font-size:10px;color:var(--demo-accent);font-weight:500;font-variant-numeric:tabular-nums}
.cobar-walkthrough-stage{padding:24px 26px 26px}
.cobar-walkthrough[data-enhanced] .cobar-walkthrough-stage{min-block-size:324px}
.workroom-case .article-body .cobar-walkthrough-panel+.cobar-walkthrough-panel{margin-top:26px;border-top:1px solid var(--demo-rule);padding-top:24px}
.workroom-case .article-body .cobar-walkthrough[data-enhanced] .cobar-walkthrough-panel{margin:0;border:0;padding:0}
.workroom-case .article-body .cobar-panel-position{
  font-size:10px;letter-spacing:.07em;line-height:1.5;color:var(--demo-accent);margin:0 0 12px;
}
.workroom-case .article-body .cobar-walkthrough-panel h3{
  font-family:SourceSans,Arial,sans-serif;font-size:20px;line-height:1.3;
  letter-spacing:-.015em;font-weight:600;color:var(--demo-ink);margin:0 0 18px;
}
.cobar-example-request,.cobar-example-draft{padding:18px 20px;background:white;border:1px solid var(--demo-rule);border-radius:2px}
.cobar-example-label{display:block;font-size:10px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--demo-muted);margin-bottom:12px}
.workroom-case .article-body .cobar-example-request p,.workroom-case .article-body .cobar-example-draft p{
  font-size:16px;line-height:1.6;color:var(--demo-ink);margin:0;
}
.workroom-case .article-body .cobar-step-note{font-size:13px;line-height:1.6;color:var(--demo-muted);margin:16px 0 0}
.cobar-context{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin:0;border-top:1px solid var(--demo-rule)}
.cobar-context>div{padding:14px 12px 14px 0;min-width:0;border-bottom:1px solid var(--demo-rule)}
.cobar-context>div:nth-child(even){padding-left:16px}
.cobar-context dt{font-size:11px;line-height:1.5;color:var(--demo-muted);margin-bottom:6px}
.cobar-context dd{font-size:15px;line-height:1.5;font-weight:600;margin:0;color:var(--demo-ink)}
.cobar-context .cobar-missing{color:var(--demo-accent);font-weight:500}
.workroom-case .article-body .cobar-data-note{display:flex;align-items:flex-start;gap:10px;color:var(--demo-muted);font-size:13px;line-height:1.6;margin:16px 0 0}
.cobar-note-mark{border:1px solid var(--demo-accent);border-radius:50%;width:6px;height:6px;flex:none;margin-top:7px}
.cobar-draft-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.cobar-draft-heading .cobar-example-label{margin:0}
.cobar-draft-status{font-size:10px;line-height:1.5;border:1px solid var(--demo-rule);border-radius:2px;padding:3px 6px;color:var(--demo-muted)}
.workroom-case .article-body .cobar-example-draft .cobar-draft-gap{border-top:1px solid var(--demo-rule);margin-top:16px;padding-top:12px;display:grid;gap:4px;font-size:13px;color:var(--demo-accent)}
.cobar-draft-gap strong{font-size:12px;font-weight:600;color:var(--demo-ink)}
.workroom-case .article-body .cobar-review-list{list-style:none;padding:0;margin:0}
.workroom-case .article-body .cobar-review-list li{display:flex;align-items:flex-start;gap:11px;padding:12px 0;border-top:1px solid var(--demo-rule);font-size:15px;line-height:1.6;margin:0;color:var(--demo-ink)}
.cobar-review-list li>span{width:11px;height:11px;border:1px solid #8f949a;border-radius:1px;flex:none;margin-top:5px}
.cobar-review-gate{display:flex;align-items:flex-start;gap:12px;background:var(--demo-surface);border-radius:2px;padding:15px 16px;margin-top:16px}
.cobar-gate-mark{width:9px;height:9px;border:1px solid var(--demo-accent);transform:rotate(45deg);flex:none;margin-top:5px}
.cobar-review-gate strong{display:block;font-size:13px;line-height:1.5;font-weight:600}
.workroom-case .article-body .cobar-review-gate p{font-size:13px;line-height:1.6;margin:5px 0 0;color:var(--demo-muted)}
@media(max-width:600px){
  .workroom-case .article-body .cobar-walkthrough-heading{padding:20px 17px}
  .workroom-case .article-body .cobar-walkthrough-heading h2{font-size:23px}
  .workroom-case .article-body .cobar-walkthrough-heading>p:last-child{font-size:14px}
  .cobar-walkthrough-controls>[data-cobar-tabs]{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cobar-walkthrough [data-cobar-step]{min-height:48px;padding:11px 13px;font-size:13px}
  .cobar-walkthrough [data-cobar-step]:nth-child(3){border-left:0;border-top:1px solid var(--demo-rule)}
  .cobar-walkthrough [data-cobar-step]:nth-child(4){border-top:1px solid var(--demo-rule)}
  .cobar-walkthrough-stage{padding:20px 17px}
  .cobar-walkthrough[data-enhanced] .cobar-walkthrough-stage{min-block-size:374px}
  .workroom-case .article-body .cobar-walkthrough-panel h3{font-size:19px;margin-bottom:16px}
  .cobar-example-request,.cobar-example-draft{padding:16px}
  .workroom-case .article-body .cobar-example-request p,.workroom-case .article-body .cobar-example-draft p{font-size:15px}
  .cobar-context dt{font-size:10px}
  .cobar-context dd{font-size:14px}
  .cobar-context>div:nth-child(even){padding-left:10px}
  .cobar-draft-heading{display:block}
  .cobar-draft-status{display:inline-block;margin-top:7px}
  .workroom-case .article-body .cobar-review-list li{font-size:14px}
  .cobar-review-gate{padding:13px 12px;gap:9px}
}
@media(prefers-reduced-motion:reduce){
  .cobar-walkthrough [data-cobar-step],.cobar-walkthrough [data-cobar-step]::after{transition:none}
}