.playground{--mail-row-height:2.25rem;flex:1;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.5rem;font-size:.8rem;display:grid}.playground>section{border:1px solid var(--color-border);background:#fff;border-radius:.75rem;flex-direction:column;min-width:0;min-height:32rem;display:flex;overflow:hidden}.playground>section>header{border-bottom:1px solid var(--color-border);background:var(--color-surface);justify-content:space-between;align-items:center;gap:1rem;min-height:3rem;padding:.4rem 1.25rem;display:flex}.playground h2{font-family:var(--font-sans);font-size:inherit;letter-spacing:0;align-items:center;gap:.65rem;margin:0;font-weight:600;display:flex}.playground svg{stroke-width:1.7px;flex-shrink:0;width:1em;height:1em}.playground input:focus-visible,.playground footer select:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.compose-fields{padding-inline:1.25rem}.compose-fields>div,.compose-fields>label{height:var(--mail-row-height);border-bottom:1px solid var(--color-border);align-items:center;gap:1rem;display:flex}.compose-fields>div>span:first-child,.compose-fields label>span{width:3rem;color:var(--color-muted);flex-shrink:0}.compose-fields svg{color:var(--color-muted);margin-left:auto}.compose-fields>div>span:nth-child(2){text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.compose-fields input{width:100%;min-width:0;color:var(--color-ink);font-family:inherit;font-size:inherit;background:0 0;border:0;padding:0}.source-body{flex:1;min-height:0;padding-top:.5rem;overflow:hidden}.code-editor{height:100%}.code-editor .cm-scroller{font-family:var(--font-mono);line-height:1.8;overflow:auto}.code-editor .cm-content{padding-block:1rem}.code-editor .cm-gutters{color:var(--color-muted);background:#fff;border-right:0}.code-editor .cm-editor.cm-focused{outline:0}.code-editor .cm-editor.cm-focused .cm-fat-cursor{background:color-mix(in srgb, var(--color-primary) 35%, transparent);outline-color:var(--color-primary)}.code-editor .cm-editor:not(.cm-focused) .cm-fat-cursor{outline-color:var(--color-primary);background:0 0}.code-editor .cm-cursor{border-left-color:var(--color-primary)}.code-editor .cm-lineNumbers .cm-gutterElement{padding-right:calc(3px + .4rem)}.code-editor .cm-activeLine,.code-editor .cm-activeLineGutter{background:var(--color-tint)}.playground>section>footer{border-top:1px solid var(--color-border);min-height:3rem;color:var(--color-muted);flex-wrap:wrap;align-items:center;gap:.5rem .75rem;padding:.4rem .75rem;display:flex}.playground footer [role=switch][aria-checked=true]{color:var(--color-primary);background:var(--color-tint)}.playground footer label{align-items:center;gap:.35rem;display:inline-flex}.playground footer select{border:1px solid var(--color-border);border-radius:var(--button-radius);color:var(--color-navy);font:inherit;background:#fff;padding:.2rem}.playground footer output{font-variant-numeric:tabular-nums;white-space:nowrap;margin-left:auto}.inbox-messages{flex-shrink:0;max-height:9rem;margin:0;padding:0;list-style:none;overflow-y:auto}.inbox-messages li{height:var(--mail-row-height);border-bottom:1px solid var(--color-border)}.inbox-messages button{text-align:left;border-radius:0;justify-content:start;gap:.75rem;width:100%;min-width:0;height:100%;padding:.35rem .75rem}.inbox-messages button[aria-pressed=true]{color:var(--color-navy);background:var(--color-tint)}.inbox-messages button>span{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.inbox-messages time{color:var(--color-muted);white-space:nowrap;margin-left:auto}.reply{flex-direction:column;flex:1;min-height:0;padding:1.5rem;display:flex}.reply>header{flex-wrap:wrap;align-items:center;gap:.75rem;margin-bottom:1.5rem;display:flex}.avatar{width:2.25rem;height:2.25rem;color:var(--color-primary);background:var(--color-pale);border-radius:50%;flex-shrink:0;place-items:center;display:grid}.reply header>div{flex-direction:column;flex:1;display:flex}.reply header>div>span{color:var(--color-muted)}.console-output{min-height:0;font-family:var(--font-mono);font-size:inherit;white-space:pre-wrap;overflow-wrap:anywhere;flex:1;margin:0;line-height:1.8;overflow:auto}.empty-inbox{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;padding:2rem;display:flex}.empty-inbox>svg{width:3rem;height:3rem;color:var(--color-accent);stroke-width:1px;margin-bottom:1.25rem}.empty-inbox h3{font-family:var(--font-sans);margin:0 0 .5rem;font-size:1.2rem;font-weight:700}.empty-inbox p{margin:0}.playground [role=alert]{color:var(--color-error);background:var(--color-error-surface);margin:0;padding:1rem 1.25rem}@media (width<=48rem){.playground{grid-template-columns:minmax(0,1fr);gap:1rem}.playground>section{height:60vh;min-height:28rem}.reply{padding:1.25rem}.inbox-messages button{gap:.5rem;padding-inline:.65rem}}.runtime-frame{opacity:0;pointer-events:none;border:0;width:1px;height:1px;position:fixed;bottom:0;right:0}main[data-astro-cid-h3dqbmh2]{flex-direction:column;gap:1rem;max-width:none;min-height:100svh;padding:1.5rem;display:flex}header[data-astro-cid-h3dqbmh2]{flex-shrink:0}a[data-astro-cid-h3dqbmh2]{color:var(--color-muted);font-size:.875rem;text-decoration:none;display:inline-block}@media (width<=48rem){main[data-astro-cid-h3dqbmh2]{padding:1rem}}
