/* Compact, shared arrangement. Renderers and exported dimensions are independent. */
.has-workbench [data-workbench] { display:grid; grid-template-columns:minmax(260px,.8fr) minmax(0,1.45fr); grid-template-areas:'input result' 'settings result'; align-items:start; gap:18px; }
.workbench-essential { grid-area:input; min-width:0; }
.workbench-result { grid-area:result; min-width:0; }
.workbench-settings { grid-area:settings; min-width:0; padding:0; }
.workbench-settings > summary,.workbench-original > summary,.workbench-formats > summary,.workbench-readme-sections > summary { display:list-item; cursor:pointer; min-height:44px; padding:12px 16px; font-weight:600; }
.workbench-settings-body { padding:0 16px 16px; }
.workbench-essential .field { margin:0 0 12px; min-width:0; }
.workbench-essential .workbench-font { margin-bottom:0; }
.workbench-essential #text-input { min-height:4rem; max-height:14rem; height:5rem; resize:vertical; }
.workbench-suggestions { margin-top:12px!important; min-height:44px; max-width:100%; }
.workbench-result .toolbar.workbench-primary-actions { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 8px; }
.workbench-primary-actions .button { min-height:44px; box-shadow:none; font-size:.9rem; padding:10px 12px; }
.workbench-primary-actions .workbench-copy { background:var(--accent,#2dd4bf); color:#041016; border-color:transparent; }
.workbench-result .ascii-output { margin-bottom:0; min-height:0; max-height:420px; }
.workbench-result pre#ascii-output,.workbench-result pre#text-ascii-output { min-height:160px; max-height:none; }
.workbench-result .preview-fit-active pre#ascii-output,.workbench-result .preview-fit-active pre#text-ascii-output { min-height:0; }
.workbench-result pre[data-state="empty"],.workbench-result pre[data-state="error"],.workbench-result pre[data-state="loading"] { font-family:var(--sans,system-ui); font-size:.9rem; line-height:1.5; white-space:normal; }
.workbench-result .preview-view-controls { margin:10px 0; gap:8px; }
.workbench-result .preview-view-controls .button { min-height:44px; }
.workbench-result .preview-view-controls p { flex-basis:100%; margin:0; }
.workbench-result .growth-width-status { font-size:.82rem; margin:8px 0; }
.workbench-formats { border-top:1px solid var(--border,#253241); margin-top:16px; }
.workbench-format-body { padding:0 0 12px; }
.workbench-comparison { margin-top:16px; border-top:1px solid var(--border,#253241); }
.workbench-comparison > summary { min-height:44px; padding:12px 0; cursor:pointer; font-weight:600; }
.workbench-style-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:12px 0; }
.workbench-style { min-width:0; background:var(--bg,#0b0f14); padding:10px; border-radius:8px; }
.workbench-style h3 { font-size:1rem; margin:0 0 8px; }
.workbench-style img { display:block; width:100%; height:180px; object-fit:contain; background:#0b0f14; }
.workbench-style .button { min-height:44px; width:100%; margin-top:8px; white-space:normal; }
.workbench-result .workbench-original { padding:0; margin-top:0; }
.workbench-original-body { padding:0 16px 16px; }
.workbench-original-body > h2,.workbench-original-body > h3 { display:none; }
.workbench-essential #dropzone { min-height:0; padding:14px; }
.workbench-essential .clip-actions { gap:8px; margin-bottom:0; }
.workbench-essential .growth-image-examples { margin:12px 0 0; padding:0; border:0; }
.workbench-essential .growth-image-examples > div { grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; }
.workbench-essential .growth-image-example { padding:6px; min-width:0; font-size:.72rem; }
.workbench-essential .growth-image-example img { width:100%; height:44px; object-fit:contain; }
.workbench-readme-jump { margin-top:12px; min-height:44px; }
.workbench-readme-sections { border:1px solid var(--border,#253241); border-radius:8px; }
.workbench-readme-sections > :not(summary) { margin:12px; }
.has-workbench .readme-starters { margin:1rem 0; padding:.25rem 0; }
.workbench-starters > summary { cursor:pointer; min-height:44px; padding:10px 0; font-weight:600; }
.has-workbench #readme-preview { max-height:28rem; overflow:auto; }
.has-workbench #readme-markdown { max-height:28rem; }
.has-workbench .growth-composer [data-workbench] > .panel:first-child { display:block; }
.has-workbench :is(.workbench-settings,.workbench-original,.workbench-formats,.workbench-readme-sections) :focus-visible { outline:2px solid var(--accent,#2dd4bf); outline-offset:3px; }
@media(max-width:980px) {
  .has-workbench [data-workbench] { grid-template-columns:minmax(0,1fr); grid-template-areas:'input' 'result' 'settings'; }
  .has-workbench main > .section { padding-top:24px; }
  .has-workbench .workbench-result .ascii-output { max-height:240px; }
  .has-workbench .workbench-result pre#ascii-output,.has-workbench .workbench-result pre#text-ascii-output { min-height:100px; }
  .has-workbench .workbench-result .preview-fit-active pre#ascii-output,.has-workbench .workbench-result .preview-fit-active pre#text-ascii-output { min-height:0; }
  .workbench-primary-actions .button { flex:1 1 calc(50% - 8px); justify-content:center; white-space:normal; }
  .has-workbench .workbench-essential .clip-actions .small { display:block; font-size:.75rem; }
  .has-workbench #readme-preview { max-height:22rem; }
}
@media(prefers-reduced-motion:reduce) { .has-workbench * { scroll-behavior:auto; } }
@media(max-width:600px) { .workbench-style-grid { grid-template-columns:minmax(0,1fr); } }