:root{--surface: var(--color--surface, Canvas);--surface-muted: var(--color--surface-muted, #f5f5f7);--raised: var(--color--surface-raised, Canvas);--ink: var(--color--ink, CanvasText);--ink-subtle: var(--color--ink-subtle, #6b6b76);--border: var(--color--border, #e2e2e8);--border-hover: var(--color--border-hover, #c8c8d0);--focus: var(--color--focus--outline, #2f6fed55);--primary: var(--color--primary--surface, #2f6fed);--primary-hover: var(--color--primary--surface-hover, #2259c8);--on-primary: var(--color--primary--ink, #fff);--soft: var(--color--primary-soft--surface, #eef3fd);--soft-ink: var(--color--primary-soft--ink, #2259c8);--ok: var(--color--success-soft--surface, #e8f6ee);--ok-ink: var(--color--success-soft--ink, #1d7a46);--warning: var(--color--warning-soft--surface, #fff4e0);--warning-ink: var(--color--warning-soft--ink, #8a5200);--danger: var(--color--danger-soft--surface, #fdeceb);--danger-ink: var(--color--danger-soft--ink, #b42318);--radius: 6px;color-scheme:light dark;font:.875rem/1.45 system-ui,-apple-system,sans-serif;color:var(--ink);background:var(--surface)}body{margin:0}.is-sidebar,.is-sidebar body,.is-sidebar #root{height:100%}.is-sidebar #root{display:flex;flex-direction:column}h1,h2{margin:0;font-size:.9375rem;font-weight:600}.button{padding:6px 12px;border:1px solid var(--border);border-radius:var(--radius);background:var(--raised);color:var(--ink);font:inherit;cursor:pointer}.button:hover:not(:disabled){border-color:var(--border-hover)}.button--primary{border-color:var(--primary);background:var(--primary);color:var(--on-primary);font-weight:600}.button--primary:hover:not(:disabled){border-color:var(--primary-hover);background:var(--primary-hover)}.button:disabled{opacity:.55;cursor:default}:focus-visible{outline:3px solid var(--focus);outline-offset:1px}input,select{box-sizing:border-box;width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:var(--radius);background:var(--raised);color:var(--ink);font:inherit}.bar{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:8px 12px;border-bottom:1px solid var(--border)}.bar__label{overflow:hidden;color:var(--ink-subtle);text-overflow:ellipsis;white-space:nowrap}.preview{flex:1;width:100%;border:0}.is-sidebar #root>p{display:none;padding:12px}.is-sidebar.is-new #root>p{display:block}.is-new .preview,.is-new .panel{display:none}.is-sidebar .panel{max-height:45%;overflow:auto;border-top:1px solid var(--border)}.panel{display:grid;gap:12px;padding:14px 16px 16px;background:var(--surface)}.panel__head{display:flex;gap:8px;align-items:center;justify-content:space-between}.pill{display:inline-flex;gap:6px;align-items:center;padding:2px 10px;border-radius:999px;background:var(--surface-muted);color:var(--ink-subtle);font-size:.75rem;white-space:nowrap}.pill:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}.pill--ok{background:var(--ok);color:var(--ok-ink)}.hint,.count{margin:0;color:var(--ink-subtle)}.notice{margin:0;padding:8px 10px;border-radius:var(--radius);background:var(--ok);color:var(--ok-ink)}.notice--warning{background:var(--warning);color:var(--warning-ink)}.notice--error{background:var(--danger);color:var(--danger-ink)}.panel[hidden],.notice[hidden]{display:none}.diagnostics{color:var(--ink-subtle);font-size:.8125rem}.diagnostics summary{cursor:pointer}.diagnostics__actions{display:flex;gap:8px}dl{display:grid;grid-template-columns:max-content 1fr;gap:4px 12px;margin:10px 0}dt{font-weight:600}dd{margin:0;overflow-wrap:anywhere}.is-outlet .panel{border:1px solid var(--border);border-radius:var(--radius)}.is-config #root{display:grid;gap:12px;max-width:480px;padding:12px 16px}.is-config p{margin:0;color:var(--ink-subtle)}.is-config label{display:grid;gap:4px}.is-config .button{justify-self:start}.is-config .checkbox{display:flex;gap:8px;align-items:center}.is-config .checkbox input{width:auto}