.dev-sandbox-page{padding-block:2rem 5rem;max-width:900px;margin-inline:auto}
.dev-sandbox-page h1{line-height:1.4}
.dev-sandbox-page section{margin-block:2rem;padding:1.5rem;border:1px solid var(--c-line);border-radius:1rem;background:var(--c-surface)}
.dev-sbx{display:grid;gap:1.25rem}
.dev-sbx label{display:grid;gap:.4rem;font-weight:600}
.dev-sbx input,.dev-sbx select{width:100%;padding:.8rem 1rem;border:1px solid var(--c-control);border-radius:.6rem;background:var(--c-surface);color:var(--c-ink);font:inherit}
.dev-sbx input:focus-visible,.dev-sbx select:focus-visible{outline:3px solid var(--c-accent);outline-offset:2px}
.dev-sbx button[disabled]{opacity:1;cursor:wait;background:var(--c-surface);border-color:var(--c-control);color:var(--c-disabled)}
.dev-sbx__status{min-height:2em}
.dev-sbx pre{white-space:pre-wrap;overflow-wrap:anywhere;text-align:left;direction:ltr;padding:1rem;border-radius:.6rem;background:var(--c-sink);color:var(--c-ink);max-height:350px;overflow:auto}
@media(min-width:700px){.dev-sbx{grid-template-columns:1fr 1fr}.dev-sbx__status,.dev-sbx pre,.dev-sbx button{grid-column:1/-1}}