.workspace.has-image-canvas{display:flex;flex-direction:column;height:100%;min-height:0;overflow:hidden}
.workspace.has-image-canvas>.topbar,.workspace.has-image-canvas>#conversation-usage,.workspace.has-image-canvas>.composer-area{flex:none}
.workspace.has-image-canvas>.composer-area{align-self:center}
#image-canvas-workspace{display:flex;flex-direction:column;flex:1 1 0;gap:0;width:100%;min-width:0;min-height:0;margin:0;padding:0 18px 12px;overflow:hidden}
#image-canvas-workspace[hidden],#image-canvas-workspace [hidden]{display:none!important}
.image-canvas-heading{display:flex;align-items:center;gap:12px;flex-wrap:wrap;flex:none;padding:10px 0 6px;min-width:0}
.image-canvas-heading h2{font-size:16px;margin:0;white-space:nowrap}
.image-canvas-tools,.image-canvas-heading-actions{display:flex;align-items:center;gap:6px;min-width:0}
.image-canvas-heading-actions{margin-left:auto;flex-wrap:wrap;justify-content:flex-end}
.image-canvas-heading button,.image-canvas-save-status button,.image-canvas-history-heading button{font:inherit;font-size:12px;min-height:36px;padding:6px 10px;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--text);white-space:nowrap}
.image-canvas-heading button:hover:not(:disabled),.image-canvas-save-status button:hover:not(:disabled),.image-canvas-history-heading button:hover{background:var(--soft)}
.image-canvas-tools button[aria-pressed=true]{background:var(--selected);border-color:var(--accent);color:var(--text)}
.image-canvas-save-status{display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:none;min-width:0;padding:0 2px 6px;font-size:11px;color:var(--muted)}
.image-canvas-save-status [data-error=true]{color:var(--danger,#be493b)}
.image-canvas-body{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:12px;flex:1 1 0;min-width:0;min-height:0;overflow:hidden}
.image-canvas-body:has(#image-canvas-commerce-sidebar:not([hidden])){grid-template-columns:minmax(0,1fr) minmax(220px,260px)}
#image-canvas-conversation-sidebar{display:flex;flex-direction:column;min-width:0;min-height:0;overflow:hidden;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
#image-canvas-conversation-title{flex:none;margin:0;padding:12px 14px;border-bottom:1px solid var(--line);font-size:14px}
#image-canvas-conversation-resizer{display:none;position:absolute;top:0;bottom:0;left:var(--image-canvas-conversation-width,640px);width:12px;z-index:4;cursor:col-resize;touch-action:none;outline:none}
#image-canvas-conversation-resizer::after{content:'';position:absolute;top:50%;left:5px;width:2px;height:44px;transform:translateY(-50%);border-radius:2px;background:var(--line)}
#image-canvas-conversation-resizer:hover::after,#image-canvas-conversation-resizer:focus-visible::after,.image-canvas-resizing #image-canvas-conversation-resizer::after{background:var(--accent)}
#image-canvas-conversation-resizer:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-radius:4px}
.image-canvas-resizing,.image-canvas-resizing *{cursor:col-resize!important;user-select:none!important}
#image-canvas-conversation-sidebar #conversation-scroll{flex:1 1 0;min-height:80px;min-width:0;width:100%;padding:14px;overflow:auto}
#image-canvas-conversation-sidebar .welcome{margin:24px auto;padding:0;background:none;border:0;box-shadow:none}
#image-canvas-conversation-sidebar .welcome h2{font-size:20px;letter-spacing:0}
#image-canvas-conversation-sidebar .welcome p{font-size:12px}
#image-canvas-conversation-sidebar .welcome-mark img{width:48px;height:48px}
#image-canvas-conversation-sidebar .messages{gap:18px;max-width:100%;padding:0}
#image-canvas-conversation-sidebar .message{font-size:13px;line-height:1.7}
#image-canvas-conversation-sidebar .message.assistant{gap:8px}
#image-canvas-conversation-sidebar .message.user{padding:10px 12px}
#image-canvas-conversation-sidebar .output-actions{flex-wrap:wrap;gap:8px}
#image-canvas-conversation-sidebar .composer-area{flex:none;min-width:0;min-height:0;width:100%;max-width:none;max-height:60%;padding:12px;border-top:1px solid var(--line);overflow:auto}
#image-canvas-conversation-sidebar .composer{padding:12px;border-radius:12px;box-shadow:none}
#image-canvas-conversation-sidebar .composer textarea{min-height:88px;font-size:14px}
#image-canvas-conversation-sidebar .composer-tools{flex-wrap:wrap}
#image-canvas-conversation-sidebar .image-output-settings-fields{grid-template-columns:minmax(0,1fr)}
#image-canvas-conversation-sidebar .composer-footnote{line-height:1.6}
#image-canvas-commerce-sidebar{min-width:0;min-height:0;overflow:hidden}
#image-canvas-workspace #commerce-workbench{height:100%;max-height:none;min-height:0;margin:0;padding:14px;border-radius:10px}
#image-canvas-workspace #commerce-workbench{overflow:auto;overflow-anchor:none;overscroll-behavior:contain}
#image-canvas-workspace .commerce-item.is-selected{background:var(--selected,var(--soft));box-shadow:0 0 0 1px var(--accent)}
.commerce-card-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:12px 0}
.commerce-card-actions>button{min-width:0;padding:8px 4px;white-space:normal}
#commerce-workbench .regeneration-form{min-width:0;max-width:100%;margin-top:12px}
#commerce-workbench .regeneration-input{display:block;width:100%;min-width:0;box-sizing:border-box;min-height:88px;resize:vertical}
#commerce-workbench .regeneration-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
#image-canvas-mount[data-commerce-selected=true] [data-canvas-action=regenerate],#image-canvas-mount[data-commerce-selected=true] [data-canvas-action=download]{display:none}
#image-canvas-mount{min-width:0;min-height:0;overflow:hidden}
#image-canvas-workspace .shared-canvas-title{display:none}
#image-canvas-workspace .shared-canvas-save-state:empty{display:none}
#image-canvas-workspace .shared-canvas:not(:has(.shared-canvas-object.is-selected)) .shared-canvas-selection{display:none}
#image-canvas-workspace .shared-canvas-help{flex:none;padding:6px 12px;font-size:11px}
.has-image-canvas .composer-area>#image-shortcuts{display:none}
#image-canvas-history-dialog{width:min(1040px,calc(100vw - 32px));height:min(900px,calc(100dvh - 40px));max-height:calc(100dvh - 40px);padding:0;overflow:hidden}
#image-canvas-history-dialog[open]{display:flex;flex-direction:column}
.image-canvas-history-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:none;padding:14px 20px;border-bottom:1px solid var(--line)}
.image-canvas-history-heading h2{margin:0;font-size:16px}
#image-canvas-history-notice{flex:none;max-height:25%;margin:0;padding:10px 20px;border-bottom:1px solid var(--line);overflow:auto;font-size:12px}
#image-canvas-history-notice.error{color:var(--danger,#be493b)}
#image-canvas-history-dialog #conversation-scroll{flex:1 1 0;min-height:0;width:100%;padding:20px 24px;overflow:auto}
@media(min-width:1101px){
 .image-canvas-body{grid-template-columns:var(--image-canvas-conversation-width,640px) minmax(0,1fr)}
 .image-canvas-body:has(#image-canvas-commerce-sidebar:not([hidden])){grid-template-columns:var(--image-canvas-conversation-width,640px) minmax(0,1fr) minmax(220px,260px)}
 #image-canvas-conversation-resizer{display:block}
}
@media(max-width:1279px){
 .image-canvas-body:has(#image-canvas-commerce-sidebar:not([hidden])){grid-template-columns:minmax(0,1fr)}
 #image-canvas-commerce-sidebar{position:absolute;inset:0 auto 0 0;z-index:3;width:min(340px,calc(100% - 32px));background:var(--surface);border-radius:10px;box-shadow:8px 0 24px var(--dialog-shadow)}
}
@media(min-width:1101px) and (max-width:1279px){
 .image-canvas-body:has(#image-canvas-commerce-sidebar:not([hidden])){grid-template-columns:var(--image-canvas-conversation-width,640px) minmax(0,1fr)}
 #image-canvas-commerce-sidebar{inset:0 0 0 auto;max-width:calc(100% - 352px)}
}
@media(max-width:760px){
 #image-canvas-workspace{padding:0 10px 6px}
 .image-canvas-heading{gap:6px;padding:6px 0}
 .image-canvas-heading h2{display:none}
 .image-canvas-tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:5px}
 .image-canvas-tools button{min-width:0;min-height:40px;padding:6px 4px;font-size:12px}
 .image-canvas-heading-actions{width:100%;gap:5px}
 .image-canvas-heading-actions button{min-height:32px;padding:4px 9px;font-size:11px}
 .image-canvas-save-status{font-size:10px;padding-bottom:4px;line-height:1.4}
 #image-canvas-workspace .shared-canvas-toolbar{padding:7px 10px}
 #image-canvas-workspace .shared-canvas-view-controls{margin-left:auto}
 #image-canvas-workspace .shared-canvas-help{padding:5px 10px;font-size:10px;line-height:1.4}
 #image-canvas-history-dialog{width:calc(100vw - 16px);height:calc(100dvh - 20px);max-height:calc(100dvh - 20px)}
 .image-canvas-history-heading{padding:10px 12px}
 #image-canvas-history-dialog #conversation-scroll{padding:14px 12px}
}
.commerce-canvas-layout-controls{display:flex;gap:4px;flex-wrap:wrap;align-items:center}.commerce-canvas-layout-controls[hidden]{display:none}.commerce-canvas-layout-controls button{min-height:32px;padding:4px 8px;font-size:11px;background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:6px}.commerce-canvas-layout-controls button[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}#image-canvas-conversation-sidebar>.image-canvas-tools,#image-canvas-conversation-sidebar .composer-area>.image-canvas-tools{flex:none;display:flex;gap:4px;flex-wrap:wrap;margin-bottom:8px}.composer-area>.image-canvas-tools{margin-bottom:8px}.composer-area>.image-canvas-tools button{min-height:36px}.shared-canvas-media img{object-fit:contain;background:white}.shared-canvas-object[data-commerce=true] .shared-canvas-media img{background:transparent}#image-canvas-workspace .shared-canvas-toolbar{flex-wrap:wrap}

#image-canvas-workspace[data-settings-expanded=true] #image-canvas-conversation-sidebar .composer-area{max-height:32%;padding:8px}
#image-canvas-workspace[data-settings-expanded=true] #image-canvas-conversation-sidebar .composer textarea{min-height:54px}
#image-canvas-workspace[data-settings-expanded=true] #image-canvas-conversation-sidebar .composer-area>#notice:not(.error),#image-canvas-workspace[data-settings-expanded=true] #image-canvas-conversation-sidebar #billing-context{display:none}
#image-canvas-workspace[data-settings-expanded=true] #image-canvas-conversation-sidebar .composer-area>.composer-footnote{margin:4px 0;font-size:9px;line-height:1.3}
/* Briefs join the layout at compact widths too; none of the side regions cover canvas pixels. */
@media(max-width:1279px){#image-canvas-commerce-sidebar{position:static;inset:auto;width:auto;max-width:none;box-shadow:none}}
@media(min-width:1101px) and (max-width:1279px){.image-canvas-body:has(#image-canvas-commerce-sidebar:not([hidden])){grid-template-columns:var(--image-canvas-conversation-width,640px) minmax(0,1fr) minmax(190px,220px)}}
@media(max-width:1100px){
 .image-canvas-body,.image-canvas-body:has(#image-canvas-commerce-sidebar:not([hidden])){grid-template-columns:minmax(0,1fr)}
 #image-canvas-workspace[data-settings-expanded=true] .image-canvas-body{grid-template-rows:minmax(0,.42fr) minmax(100px,.58fr)}
 #image-canvas-workspace[data-settings-expanded=true] #image-canvas-mount{grid-row:1}
 #image-canvas-workspace[data-settings-expanded=true] #image-preview-dialog{grid-row:2;border:1px solid var(--line);border-radius:8px}
 #image-canvas-workspace[data-settings-expanded=true] #image-canvas-commerce-sidebar{display:none}
 #image-canvas-workspace[data-settings-expanded=false] .image-canvas-body:has(#image-canvas-commerce-sidebar:not([hidden])){grid-template-rows:minmax(95px,1fr) minmax(160px,1fr)}
 .workspace.has-image-canvas>.composer-area{width:100%;max-height:28%;overflow:auto;padding-top:8px;padding-bottom:8px}
 #image-preview-dialog .image-preview-buttons.commerce-actions{grid-template-columns:repeat(3,minmax(0,1fr))}
 #image-preview-dialog .commerce-actions #image-preview-show,#image-preview-dialog .commerce-actions #image-preview-cancel,#image-preview-dialog .commerce-actions #image-preview-apply{grid-column:auto;grid-row:auto}
 #image-preview-dialog .image-preview-actions>span{font-size:10px;line-height:1.4}
}