.example{border:1px solid var(--line);border-radius:18px;background:var(--surface);padding:24px}.example-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.example-toolbar #status{min-height:0;margin:0}.example-toolbar label{white-space:nowrap;font-size:14px}.example figure+figure{margin-top:24px}.example figcaption{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px;font-size:14px}.example figcaption strong{font-size:18px}.example figcaption span{color:var(--muted);font-weight:400}.example figcaption a{margin-left:auto}.example-viewport{overflow:auto;max-height:390px;background:#fff;border:1px solid var(--line);border-radius:10px}.example-viewport img{display:block;width:100%;max-width:100%;height:auto}.example-files{padding:24px 0 48px}.example-files h2{font-size:22px}.example-files .help{max-width:1000px}.example .help{margin-bottom:0}@media(max-width:600px){.example{padding:14px}.example-toolbar{align-items:flex-start;flex-direction:column}.example figcaption{gap:5px 12px}.example figcaption a{margin-left:0;flex-basis:100%}.example-viewport{max-height:310px}}

.previous{margin-top:24px}.previous summary{cursor:pointer}.previous img{max-width:100%;height:auto;background:#fff}