:root { --sl-status-top: 0px; --sl-status-bottom: 0px; --sl-status-admin: 0px; }
.sl-status { box-sizing:border-box; background:var(--sl-status-bg); color:var(--sl-status-text); border:1px solid color-mix(in srgb,var(--sl-status-text) 20%,transparent); border-inline-start:4px solid var(--sl-status-accent); border-radius:8px; padding:12px 16px; font:400 14px/1.5 system-ui,sans-serif; text-align:start; }
.sl-status *, .sl-status *::before, .sl-status *::after { box-sizing:border-box; }
.sl-status[hidden], .sl-status [hidden] { display:none!important; }
.sl-status[data-position] { position:fixed; inset-inline:0; z-index:99990; border-radius:0; max-height:45dvh; overflow:auto; padding-inline:max(16px,env(safe-area-inset-left)) max(16px,env(safe-area-inset-right)); }
.sl-status[data-position=top] { top:var(--sl-status-admin); }
.sl-status[data-position=bottom] { bottom:0; padding-bottom:max(12px,env(safe-area-inset-bottom)); }
.sl-status-heading { display:flex; align-items:center; gap:16px; margin-bottom:6px; font-weight:600; }
.sl-status-heading label { margin-inline-start:auto; font-weight:400; }
.sl-status button,.sl-status select { font:inherit; color:inherit; background:var(--sl-status-bg); border:1px solid currentColor; border-radius:4px; min-height:36px; padding:4px 8px; }
.sl-status [data-status-close] { margin-inline-start:auto; min-width:44px; min-height:44px; font-size:24px; cursor:pointer; }
.sl-status-item { display:flex; align-items:center; gap:8px 16px; flex-wrap:wrap; padding:8px 0; }
.sl-status-item + .sl-status-item { border-top:1px solid color-mix(in srgb,var(--sl-status-text) 20%,transparent); }
.sl-status-state { font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.sl-status-state::before { content:'●'; margin-inline-end:6px; }
.sl-status [data-state=live] .sl-status-state::before { color:#31bd76; }
.sl-status a { color:inherit; text-decoration:underline; text-underline-offset:3px; font-weight:600; padding:6px 0; }
.sl-status strong,.sl-status-detail { overflow-wrap:anywhere; }
.sl-status-checked { flex-basis:100%; font-size:11px; }
.sl-status-detail { font-size:13px; }
.sl-status-compact .sl-status-detail { max-width:32ch; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sl-status-expanded .sl-status-detail { flex-basis:100%; }
.sl-status :focus-visible { outline:2px solid currentColor; outline-offset:3px; }
.sl-status .screen-reader-text { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.sl-status-admin { max-width:1000px; }
.sl-status-admin form { margin:16px 0; }
.sl-status-admin nav { display:flex; gap:8px; flex-wrap:wrap; }
.sl-status-field { display:flex; flex-direction:column; gap:6px; margin:12px 0; max-width:480px; }
.sl-status-fields { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:0 24px; }
.sl-status-channel { display:flex; gap:16px; margin:8px 0; flex-wrap:wrap; }
.sl-status-channel label { display:flex; align-items:center; gap:8px; }
@media(max-width:600px) { .sl-status { padding:10px 12px; } .sl-status-heading { flex-wrap:wrap; gap:8px; } .sl-status-item { gap:6px 12px; } .sl-status-item strong { max-width:60vw; } }