:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ground:#e6e4de;--panel:#f2f1ec;--field:#fff;--ink:#16191c;--ink-soft:#5f635f;--rule:#c8c5bc;--hinge:#16191c;--accent:#2c6a58;--danger:#b5301a;--step:.75rem;--sans:"Barlow", system-ui, sans-serif;--condensed:"Barlow Condensed", "Barlow", system-ui, sans-serif;--mono:"JetBrains Mono", ui-monospace, monospace;--chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2316191c' stroke-width='1.6'/%3E%3C/svg%3E")}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ground:#121416;--panel:#1b1e22;--field:#24282d;--ink:#e8e4da;--ink-soft:#9aa09c;--rule:#2c3136;--hinge:#454b52;--accent:#7fd0b4;--danger:#ff8a75;--chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23e8e4da' stroke-width='1.6'/%3E%3C/svg%3E")}}:root[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ground:#121416;--panel:#1b1e22;--field:#24282d;--ink:#e8e4da;--ink-soft:#9aa09c;--rule:#2c3136;--hinge:#454b52;--accent:#7fd0b4;--danger:#ff8a75;--chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23e8e4da' stroke-width='1.6'/%3E%3C/svg%3E")}*{box-sizing:border-box;scrollbar-width:thin;scrollbar-color:var(--rule) transparent}html,body{height:100%}html{background:var(--ground);color:var(--ink);font:400 .9375rem / 1.45 var(--sans)}body{flex-direction:column;margin:0;display:flex;overflow:hidden}:is(mbe-split-view:not(:defined),mbe-code-editor:not(:defined),mbe-preview:not(:defined)){visibility:hidden}.masthead{align-items:center;gap:calc(var(--step) * 1.5);padding:.5rem calc(var(--step) * 2);border-bottom:1px solid var(--rule);flex:none;display:flex}.logo{flex:none;width:2.25rem;height:2.25rem}.masthead h1{font-family:var(--condensed);letter-spacing:.01em;white-space:nowrap;flex:none;margin:0;font-size:1.375rem;font-weight:600;line-height:1}.tools{flex-wrap:wrap;flex:1;justify-content:flex-end;align-items:center;gap:.5rem;min-width:0;display:flex}.field{color:var(--ink-soft);align-items:center;gap:.4rem;font-size:.8125rem;display:inline-flex}select,button,.github{height:2rem;font:500 .8125rem / 1 var(--sans);color:var(--ink);background:var(--field);border:1px solid var(--rule);cursor:pointer;border-radius:0;padding:0 .7rem}select{appearance:none;background-image:var(--chevron);text-overflow:ellipsis;background-position:right .55rem center;background-repeat:no-repeat;background-size:.65rem;max-width:14rem;padding-right:1.6rem}@supports (appearance:base-select){select{appearance:base-select}::picker(select){appearance:base-select}select{align-items:center;display:inline-flex}select::picker-icon{display:none}::picker(select){min-width:anchor-size(width);color:var(--ink);background:var(--panel);border:1px solid var(--rule);border-top:3px solid var(--hinge);margin:0;padding:.35rem;box-shadow:0 8px 24px #0000002e}option{font:500 .8125rem / 1 var(--sans);padding:.45rem .7rem .45rem 1.7rem;position:relative}option:hover,option:focus-visible{background:var(--ground);outline:none}option::checkmark{display:none}option:checked::checkmark{content:"";background:var(--accent);border-radius:50%;width:.4rem;height:.4rem;margin-top:-.2rem;display:block;position:absolute;top:50%;left:.7rem}}button:hover,select:hover,.github:hover{border-color:var(--ink)}button:focus-visible,select:focus-visible,.github:focus-visible,[role=tab]:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.menu-button{background-image:var(--chevron);background-position:right .55rem center;background-repeat:no-repeat;background-size:.65rem;padding-right:1.6rem}.menu-button[aria-expanded=true]{border-color:var(--ink)}.menu{min-width:14rem;color:var(--ink);background:var(--panel);border:1px solid var(--rule);border-top:3px solid var(--hinge);flex-direction:column;margin:0;padding:.35rem;display:none;position:fixed;inset:auto;box-shadow:0 8px 24px #0000002e}.menu:popover-open{display:flex}.menu hr{border:0;border-top:1px solid var(--rule);margin:.35rem 0}.menu-label{color:var(--ink-soft);letter-spacing:.04em;text-transform:uppercase;padding:.25rem .7rem .15rem;font-size:.75rem}.menu [role^=menuitem]{text-align:left;background:0 0;border:0;height:auto;padding:.45rem .7rem .45rem 1.7rem;position:relative}.menu [role^=menuitem]:hover,.menu [role^=menuitem]:focus-visible{background:var(--ground);outline:none}.menu [aria-checked=true]:before{content:"";background:var(--accent);width:.4rem;height:.4rem;margin-top:-.2rem;position:absolute;top:50%;left:.7rem}.menu [role=menuitemradio][aria-checked=true]:before{border-radius:50%}button.danger{color:var(--danger)}button.accent{color:var(--ground);background:var(--ink);border-color:var(--ink)}.theme-toggle{color:var(--ink-soft);background:0 0}.github{width:2rem;color:var(--ink-soft);background:0 0;justify-content:center;align-items:center;padding:0;display:inline-flex}.github svg{fill:currentColor;width:1rem;height:1rem}#workbench{min-height:0;padding:var(--step) calc(var(--step) * 2);flex:1;display:flex}mbe-split-view{--mbe-bar-color:var(--ink-soft);--mbe-bar-track:var(--rule);--mbe-bar-hover:var(--ink-soft);flex:1}mbe-split-view::part(grip){opacity:1}.pane{background:var(--panel);border:1px solid var(--rule);border-top:3px solid var(--hinge);flex-direction:column;display:flex}mbe-split-view::part(bar){margin:0 calc(var(--step) * .5)}mbe-split-view[dock=bottom]::part(bar),mbe-split-view[dock=top]::part(bar){margin:calc(var(--step) * .5) 0}.pane-head,.tabs{align-items:center;gap:var(--step);min-height:2.5rem;padding:0 var(--step);border-bottom:1px solid var(--rule);flex:none;display:flex}.pane-foot{align-items:baseline;gap:var(--step);padding:.5rem var(--step);border-top:1px solid var(--rule);flex:none;display:flex}.pane-foot h2{font-family:var(--condensed);margin:0;font-size:1.0625rem;font-weight:600;line-height:1}.state{color:var(--ink-soft);font-size:.8125rem}.readout{font-family:var(--mono);white-space:nowrap;margin-left:auto;font-size:.75rem}.pane-head select{height:1.75rem}.tabs{gap:0;padding:0}[role=tab]{height:2.5rem;padding:0 var(--step);font-family:var(--mono);color:var(--ink-soft);background:0 0;border:0;border-bottom:2px solid #0000;margin-bottom:-1px;font-size:.8125rem}[role=tab]:hover{color:var(--ink)}[role=tab][aria-selected=true]{color:var(--ink);border-bottom-color:var(--hinge)}mbe-code-editor{flex:1;min-height:0;display:block;position:relative}mbe-code-editor .monaco-editor{position:absolute;inset:0}mbe-preview{background:var(--ground);flex:1;min-height:0}.status{min-height:1.5rem;padding:0 calc(var(--step) * 2) .25rem;color:var(--ink-soft);flex:none;margin:0;font-size:.8125rem}dialog{width:min(28rem,100vw - 2rem);padding:calc(var(--step) * 1.5);color:var(--ink);background:var(--panel);border:1px solid var(--rule);border-top:3px solid var(--hinge)}dialog::backdrop{background:#00000080}dialog p{margin:0 0 var(--step)}dialog menu{justify-content:flex-end;gap:.5rem;margin:0;padding:0;display:flex}@media (max-width:60rem){.masthead h1{display:none}}