.sx-panes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
@media (max-width:540px){.sx-panes{grid-template-columns:1fr}}
.sx-pane{min-width:0;position:relative}
.sx-label{margin-bottom:.35rem;color:var(--muted);font-size:.9em}
.sx-out{min-width:0;padding:.6rem .7rem;border:1px solid var(--rule);font-size:.92em;line-height:1.45;overflow-wrap:anywhere}
.sx-out[data-naive]>*+*,.sx-frozen>*+*,.sx-live>*+*{margin-top:.5rem}
.sx-frozen:not(:empty)+.sx-live:not(:empty){margin-top:.5rem}
:where(.sx-out) :where(p,ul,ol,pre){margin:0}
.sx-out ol,.sx-out ul{padding-left:1.3em}
.sx-out li+li{margin-top:.15rem}
.sx-out code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em;padding:0 .2em;background:color-mix(in srgb,var(--fg) 8%,transparent)}
.sx-out pre{padding:.5rem .6rem;overflow-x:auto;background:color-mix(in srgb,var(--fg) 6%,transparent)}
.sx-out pre code{padding:0;background:none;font-size:.85em;line-height:1.5}
.sx-chart{margin-top:.9rem}
.sx-chart canvas{display:block;width:100%;height:120px}
.sx-key{display:flex;flex-wrap:wrap;gap:.35rem 1rem;margin-top:.35rem;color:var(--muted);font-size:.9em}
.sx-key i{display:inline-block;width:14px;height:2px;margin-right:.4rem;vertical-align:middle}
.sx-k-naive{background:var(--muted)}
.sx-k-smooth{background:var(--redline)}
.sx-scroll-wrap{position:relative}
.sx-scroll{height:200px;overflow-y:auto;padding:.6rem .7rem;border:1px solid var(--rule);overscroll-behavior:contain}
.sx-scroll p{margin:0}
.sx-scroll p+p{margin-top:.6rem}
.sx-pill{position:absolute;left:50%;bottom:.6rem;transform:translateX(-50%);min-height:2rem;padding:.2rem .75rem;border:1px solid var(--fg);border-radius:999px;background:var(--fg);color:var(--bg);font:inherit;cursor:pointer;box-shadow:0 6px 18px -8px rgba(0,0,0,.4)}
.sx-pill[hidden]{display:none}