/* The demo's own CSS: one-off look only; layout comes from /kit/layout.css. Colours come from theme.css. */
main h1, main h2 { color: var(--brand-text); }
.proof { background: var(--brand-soft); border: 2px solid var(--brand); border-radius: 1rem; padding: var(--space-5); text-align: center; transition: transform .3s; }
.proof-patch { display: inline-block; background: var(--brand); color: var(--brand-ink); border-radius: 50%; padding: var(--space-5); font-weight: 800; }
.proof-tape { margin-top: var(--space-3); background: var(--surface); border: 1px solid var(--brand); padding: var(--space-2); font-weight: 800; letter-spacing: .12em; }
.hash { display: block; word-break: break-all; background: var(--surface2); border-radius: .5rem; padding: var(--space-2); }
.edi { overflow-x: auto; background: var(--surface2); border-radius: .5rem; padding: var(--space-3); white-space: pre-wrap; overflow-wrap: anywhere; max-width: 100%; min-width: 0; }
.sr-only { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.reqs { opacity: .95; }
input[type=range] { width: 100%; min-height: 2.75rem; }
main h1, main h2 { overflow-wrap: anywhere; }
:root { --center-max: 90rem; }
.edi { margin: 0; }
/* hold the space: the kit font may not swap in after first paint (PROTOTYPE.md s3b: font-display optional) */
@font-face { font-family: "Public Sans"; src: url("/kit/public-sans.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: optional; }
@font-face { font-family: "Public Sans"; src: url("/kit/public-sans-italic.woff2") format("woff2"); font-weight: 100 900; font-style: italic; font-display: optional; }
html, body, button, input, select, textarea, .btn, .chip { font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }