/* Compact IDE chrome: reserve the available panel height for generated code. */
.code-editor-header{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px;border-bottom:1px solid #e4eae1;padding-bottom:7px;flex-shrink:0}
.universal-showcase .code-editor-header .preview-label{justify-content:flex-start;gap:8px}
.universal-showcase .code-editor-header .code-editor-tab{display:flex;align-items:center;justify-content:flex-end;gap:9px;min-width:0;margin:0;padding:0;border:0;color:#587265;font:400 10px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace}
.code-editor-tab>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.code-editor-tab>span:last-child{color:#8a9890;font-size:.9em;flex-shrink:0}
#overview [data-code-language]{display:none}
.universal-showcase .preview-text-output{font:400 11px/1.8 ui-monospace,SFMono-Regular,Consolas,'Liberation Mono',monospace;color:#435367;white-space:normal;overflow-x:hidden;overflow-y:auto;overflow-wrap:anywhere;tab-size:4;margin:9px 0;scrollbar-color:#c3d3c3 transparent;overscroll-behavior:contain;scroll-behavior:auto;overflow-anchor:none}
.preview-text-output code{display:block;min-width:0;font:inherit;white-space:normal}
.code-line{position:relative;display:block;min-width:0;min-height:1lh;padding-left:2.8em;white-space:break-spaces;overflow-wrap:anywhere}
/* Keep line-number padding inside the gutter, including on narrow screens. */
.code-line:before{content:attr(data-line);position:absolute;top:0;left:0;box-sizing:border-box;width:2.8em;padding-right:.9em;text-align:right;color:#a6b1a8;background:#fff;user-select:none;font-variant-numeric:tabular-nums}
.preview-text-macaq .code-line:before{background:#fcfefb}
.preview-text-output .code-keyword{color:#9554a3}
.preview-text-output .code-string{color:#99652e}
.preview-text-output .code-function,.preview-text-output .code-key{color:#217a78}
.preview-text-output .code-number{color:#376fbd}
.preview-text-output .code-comment{color:#849782;font-style:italic}
.universal-showcase .preview-text-output.is-typing:after{height:1em;margin-left:1px;vertical-align:-.15em}
@media(min-width:901px){
  .examples-workspace .showcase-panel[data-preview-panel=text]{grid-template-rows:calc(44 * var(--ui,1px)) minmax(0,1fr) calc(48 * var(--ui,1px)) minmax(calc(30 * var(--ui,1px)),max-content)}
  .examples-workspace [data-preview-panel=text]>.preview-model{height:100%;padding:0}
  .examples-workspace [data-preview-panel=text] .preview-text-pane{padding:calc(6 * var(--ui,1px)) calc(12 * var(--ui,1px));overflow:hidden}
  .examples-workspace [data-preview-panel=text] .code-editor-header{padding-bottom:calc(5 * var(--ui,1px))}
  .examples-workspace [data-preview-panel=text] .code-editor-tab{font-size:calc(11 * var(--ui,1px))}
  .examples-workspace [data-preview-panel=text] .preview-text-output{font-size:calc(12 * var(--ui,1px));line-height:1.5;margin-block:calc(4 * var(--ui,1px))}
  .examples-workspace [data-preview-panel=text] .preview-text-state{font-size:calc(10 * var(--ui,1px));padding-top:calc(3 * var(--ui,1px))}
  .examples-workspace [data-preview-panel=text] .examples-choices{padding-top:calc(6 * var(--ui,1px));padding-bottom:calc(8 * var(--ui,1px))}
  .examples-workspace [data-preview-panel=text] .examples-choice{padding:calc(5 * var(--ui,1px)) calc(12 * var(--ui,1px));font-size:calc(12 * var(--ui,1px))}
  .examples-workspace [data-preview-panel=text] .preview-caption{margin:0;padding-top:calc(6 * var(--ui,1px));align-content:center}
  .examples-workspace [data-preview-panel=text] .preview-prompt{font-size:calc(11 * var(--ui,1px));line-height:1.4}
  .examples-workspace [data-preview-panel=text] .examples-replay{top:calc(6 * var(--ui,1px))}
}
@media(min-width:901px) and (max-height:720px){
  .examples-workspace .showcase-panel[data-preview-panel=text]{grid-template-rows:40px minmax(0,1fr) 44px minmax(27px,max-content)}
  .examples-workspace [data-preview-panel=text] .preview-text-output{font-size:11px;line-height:1.5;margin-block:4px}
  .examples-workspace [data-preview-panel=text] .preview-text-state{font-size:9px;padding-top:3px}
  .examples-workspace [data-preview-panel=text] .code-editor-header{padding-bottom:3px}
  .examples-workspace [data-preview-panel=text] .examples-choice{font-size:11px;padding:4px 10px}
}
@media(max-width:900px){
  .examples-workspace .preview-text-output{font-size:12px;line-height:1.6}
}
@media(max-width:600px){
  .code-editor-header{grid-template-columns:1fr;gap:4px;padding-bottom:5px}
  .universal-showcase .code-editor-header .preview-label{justify-content:space-between}
  .universal-showcase .code-editor-header .code-editor-tab{justify-content:space-between;font-size:9px}
  .universal-showcase .preview-text-output{font-size:10px}
  .examples-workspace .preview-text-output{font-size:11px}
  .code-line{padding-left:2.1em}
  .code-line:before{width:2.1em;padding-right:.6em}
}

/* Let a wheel gesture continue to the article at either end of the code. */
#overview .preview-text-output{overscroll-behavior:auto}
