/* Public Lab: recorded example above, local download below. */
.topbar { flex-wrap: wrap; }
.top-nav { gap: var(--space-5); }
.showcase-notice { display: flex; align-items: center; justify-content: space-between; gap: var(--space-6); border-top: 2px solid var(--ink-950); border-bottom: 1px solid var(--border-base); padding: var(--space-4) 0; margin-bottom: var(--space-6); }
.showcase-notice strong { font-size: var(--text-md); font-weight: 500; }
.showcase-notice p { color: var(--ink-600); margin: var(--space-1) 0 0; max-width: 76ch; }
.showcase-notice .primary { flex-shrink: 0; }
.local-guide { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-12); border-top: 2px solid var(--ink-950); padding: var(--space-8) 0; margin-top: var(--space-4); scroll-margin-top: var(--space-6); }
.local-guide h2 { font-size: var(--text-xl); font-weight: 500; margin-bottom: var(--space-3); }
.local-guide p { max-width: 56ch; color: var(--ink-600); }
.local-guide a { text-decoration: underline; text-underline-offset: var(--space-1); }
.run-steps ol { margin: 0 0 var(--space-4); padding-left: var(--space-5); }
.run-steps li { padding-bottom: var(--space-2); }
.run-steps code, .run-steps pre { font-family: var(--font-mono); font-size: var(--text-2xs); overflow-wrap: anywhere; }
.run-steps pre { white-space: pre-wrap; background: var(--vellum-leaf); border: 1px solid var(--border-base); padding: var(--space-4); }
.run-steps summary { cursor: pointer; color: var(--leaf-700); margin-bottom: var(--space-3); }
@media (max-width: 760px) { .showcase-notice { align-items: start; flex-direction: column; gap: var(--space-3); } .local-guide { grid-template-columns: 1fr; gap: var(--space-4); } .top-nav { flex-wrap: wrap; gap: var(--space-2) var(--space-5); } }