/* Prototype only: the screen bar. Linked by each prototype-*.html. */
.proto-bar { position: fixed; bottom: var(--space-12); left: 50%; z-index: var(--z-toast); display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-6); max-width: calc(100vw - 24px); padding: var(--space-6) var(--space-10); border-radius: var(--radius-lg); background: var(--color-bg-inverse); color: var(--color-fg-on-dark); font-size: var(--text-body-sm-size); transform: translateX(-50%); box-shadow: var(--shadow-lg); }
.proto-bar a { padding: var(--space-2) var(--space-6); border-radius: var(--radius-sm); color: inherit; text-decoration: none; opacity: 0.75; }
.proto-bar a[aria-current="step"] { background: var(--color-action-primary); opacity: 1; }
.proto-bar strong { margin-right: var(--space-4); }
.proto-bar__home { font-weight: var(--font-weight-semibold); }
@media (max-width: 480px) { .proto-bar { display: none; } }