/* Workbench chrome only. Product artwork and frozen output styles are unchanged. */
body.portrait-workspace{--accent:#2858d6;--portrait-nav:64px;--portrait-action:60px;background:#f4f6f9;font-size:15px;height:100dvh;overflow:hidden}
.portrait-workspace :is(button,.secondary-button,.primary-button,.text-button,.icon-button){min-height:48px;font-size:14px;touch-action:manipulation}
.portrait-workspace .icon-button{min-width:48px;width:48px;height:48px}
.portrait-workspace :is(input:not([type=checkbox]):not([type=range]),textarea,select){font-size:16px;min-height:48px}
.portrait-workspace .workspace-header{height:auto;min-height:72px;display:flex;flex-wrap:wrap;gap:8px;padding:8px 16px;flex-shrink:0}
.portrait-workspace .workspace-brand{display:none}
.portrait-back{color:#52627b;text-decoration:none;display:grid;place-items:center;min-width:64px;min-height:48px;font-size:14px}
.portrait-workspace #current-product{flex:1;min-width:0;padding:0 8px;border:0;text-align:left}
.portrait-workspace #current-product small{font-size:12px;line-height:1.4;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:230px}
.portrait-workspace #current-product strong{font-size:16px;display:block;line-height:1.5}
.portrait-workspace #current-product .product-switch{display:none}
.portrait-workspace .workspace-actions{margin:0;gap:4px}
.portrait-workspace .workspace-actions #portrait-product-menu{font-size:13px}
.portrait-workspace #downloads-link{font-size:14px;text-decoration:none;min-height:48px}
.portrait-workspace #delivery-open{flex:none;min-height:48px}
.portrait-workspace #save-bar{display:flex!important;flex:0 0 100%;order:8;min-height:24px;max-width:none;gap:8px;margin:0;border:0;padding:0;background:none;flex-wrap:wrap}
.portrait-workspace #save-status{font-size:12px;overflow-wrap:anywhere;white-space:normal}
.portrait-workspace .save-bar-tools{display:none}
.portrait-workspace #save-bar button:not([hidden]){min-height:36px}
.portrait-workspace .document-toolbar,.portrait-workspace .workbench-toolbar,.portrait-workspace .canvas-status{display:none}
.portrait-workspace .editor{min-height:0;overflow:hidden;position:relative;display:flex;flex-direction:column}
.portrait-workspace #portrait-object-bar{height:56px;display:flex;align-items:center;padding:4px 16px;gap:8px;background:#fff;border-bottom:1px solid #e5e9ef;flex-shrink:0}
#portrait-object-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;color:#263755;font-weight:600}
.portrait-workspace #editor-panel{display:block;min-height:0;flex:1;overflow:auto;padding:0;background:#f4f6f9;overscroll-behavior:contain}
.portrait-workspace #editor-panel>.inspector{display:none}
.portrait-workspace #editor-panel>.pages-pane{display:block;width:100%;border:0;background:none;overflow:visible;padding:0}
.portrait-workspace .pages-pane>.pane-heading,.portrait-workspace #page-list-footer{display:none}
.portrait-workspace #page-list{display:block;padding:16px 24px 24px;overflow:visible;max-width:960px;margin:0 auto}
.portrait-workspace #editor-panel:not(.flow-layout)>.canvas-workspace{display:none}
.portrait-workspace .flow-layout>.pages-pane{display:none!important}
.portrait-workspace .flow-layout>.canvas-workspace{display:flex;flex-direction:column;height:100%;width:100%;min-width:0}
.portrait-workspace .flow-layout .canvas-toolbar{flex:none;min-height:40px;height:auto;padding:4px 16px;font-size:12px;display:flex;gap:8px;justify-content:space-between}
.portrait-workspace .canvas-toolbar #zoom-label,.portrait-workspace .canvas-toolbar [data-action=zoom-in],.portrait-workspace .canvas-toolbar [data-action=zoom-out]{display:none}
.portrait-workspace #canvas-scroll{width:100%;padding:16px 24px;min-width:0;flex:1;overflow:auto;overscroll-behavior:contain}
.portrait-workspace #canvas{width:100%;min-width:0;margin:0;display:block}
.portrait-workspace #portrait-actions{display:flex;justify-content:center;gap:8px;padding:6px 16px;background:#fff;min-height:60px;flex-shrink:0;border-top:1px solid #e5e9ef}
.portrait-workspace #portrait-actions button{flex:1;max-width:240px}
.portrait-workspace #output-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));height:calc(64px + env(safe-area-inset-bottom));padding:4px 12px calc(4px + env(safe-area-inset-bottom));background:white;border-top:1px solid #e5e9ef;flex-shrink:0;gap:4px}
.portrait-workspace #output-tabs .output-tab{padding:0;margin:0;font-size:15px;border-radius:10px;height:56px;min-width:0;color:#6b7689}
.portrait-workspace #output-tabs .output-tab.active{background:#edf2ff;color:#2858d6;font-weight:650}
.portrait-workspace #output-tabs .output-tab:after{display:none}
.portrait-workspace .main-edit-card,.portrait-workspace .sku-edit-card{display:none!important;position:relative;border:0;background:none;padding:0;box-shadow:none;border-radius:0;width:100%;min-width:0}
.portrait-workspace :is(.main-edit-card,.sku-edit-card).portrait-active{display:block!important}
.portrait-workspace .main-image-pick,.portrait-workspace .sku-image-pick{display:block;width:100%;padding:0;background:white;border:1px solid #e4e8ee;border-radius:12px;overflow:hidden;min-height:0}
.portrait-workspace .sku-card-image{display:block;width:100%;aspect-ratio:1;border-radius:0;padding:0;margin:0;overflow:hidden;background:white}
.portrait-workspace .sku-card-image :is(img,canvas){display:block;width:100%;height:100%;object-fit:contain}
.portrait-workspace :is(.main-row-settings,.main-row-sort,.sku-adjustments,.sku-sort-actions,.portrait-fields,.portrait-select-object,.main-common-title,.main-common-fields,.other-image-settings){display:none}
.portrait-workspace .sku-edit-card>[data-reset-sku-image]{display:none}
.portrait-workspace .main-common-settings{border:0;padding:0;background:none;margin:0 0 12px}
.portrait-workspace .main-ratio-control{display:flex;gap:12px;align-items:center;justify-content:center}
.portrait-workspace .main-ratio-control .segmented{display:flex;gap:4px}
.portrait-workspace .main-ratio-control button{min-width:80px;background:#fff;border:1px solid #e0e5ee;border-radius:8px}
.portrait-workspace .main-ratio-control button.active{background:#eaf0ff;border-color:#2858d6;color:#2858d6}
.portrait-workspace .other-type-nav{display:flex;gap:8px;margin:0 0 12px}
.portrait-workspace .other-type-nav button{flex:1;padding:8px}
.portrait-workspace .other-type-nav svg{display:none}
.portrait-workspace .other-image-card{display:block;border:0;padding:0;background:none}
.portrait-workspace .other-image-preview{width:100%;display:block;background:#fff;overflow:hidden;border:1px solid #e4e8ee;border-radius:10px}
.portrait-workspace .other-image-preview canvas{width:100%;display:block}
.portrait-workspace[data-portrait-panel=text] :is(.main-common-fields,.sku-edit-card.portrait-active .portrait-fields),.portrait-workspace[data-portrait-panel=more] :is(.main-edit-card.portrait-active .main-row-settings,.sku-edit-card.portrait-active .sku-sort-actions,.other-image-settings){display:flex;flex-direction:column;gap:14px;position:fixed;z-index:80;bottom:var(--portrait-keyboard,0px);left:0;right:0;background:#fff;border:1px solid #dce2ec;border-radius:18px 18px 0 0;padding:16px 24px calc(20px + env(safe-area-inset-bottom));max-height:min(55dvh,calc(100dvh - var(--portrait-keyboard,0px) - 72px));overflow:auto;box-shadow:0 -10px 40px #172b4d20}
.portrait-workspace .portrait-fields>header,.portrait-workspace .main-common-fields>header{display:flex;align-items:center;justify-content:space-between;gap:12px;position:sticky;top:-16px;background:#fff;z-index:1}
.portrait-workspace .portrait-fields .sku-text-field{display:flex;flex-direction:column;gap:8px;margin:0}
.portrait-workspace .portrait-fields .sku-text-field textarea{min-height:72px;width:100%;height:auto}
.portrait-workspace .portrait-fields label{font-size:14px;display:flex;flex-direction:column;gap:6px}
.portrait-workspace .portrait-fields .sku-image-info{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:0;border:0}
.portrait-workspace .portrait-fields .sku-image-info label{display:grid;grid-template-columns:24px 1fr;align-items:center}
.portrait-workspace .portrait-fields .sku-image-info label input:not([type=checkbox]){grid-column:1/-1;width:100%;min-width:0}
.portrait-workspace .portrait-fields input[type=number]{width:100%}
.portrait-workspace .portrait-fields input[type=checkbox]{width:22px;height:22px}
.portrait-workspace.portrait-overlay #output-tabs,.portrait-workspace.portrait-adjusting #output-tabs{visibility:hidden}
.portrait-workspace.portrait-managing #editor-panel{padding:12px 0}
.portrait-workspace.portrait-managing .flow-layout>.pages-pane{display:block!important}
.portrait-workspace.portrait-managing .flow-layout>.canvas-workspace{display:none}
.portrait-workspace.portrait-managing .workbench-toolbar{display:block;padding:8px 16px;background:#fff}
.portrait-workspace.portrait-managing .workbench-heading{display:none}
.portrait-workspace.portrait-managing #context-tools{display:flex;flex-wrap:wrap;gap:8px}
.portrait-workspace.portrait-managing #page-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.portrait-workspace.portrait-managing :is(.main-edit-card,.sku-edit-card){display:flex!important;flex-direction:column;padding:12px;background:#fff;border:1px solid #e1e6ee;border-radius:12px;gap:8px}
.portrait-workspace.portrait-managing .portrait-select-object{display:block;width:100%;text-align:left;overflow-wrap:anywhere}
.portrait-workspace.portrait-managing .main-row-sort,.portrait-workspace.portrait-managing .sku-sort-actions{display:flex;position:static;justify-content:flex-end;gap:8px}
.portrait-workspace.portrait-managing .main-common-settings{grid-column:1/-1}
.portrait-workspace.portrait-managing #page-list-footer{display:flex;gap:12px;padding:16px;flex-wrap:wrap}
.portrait-workspace.portrait-managing .page-item{width:100%;height:auto;padding:12px;min-height:64px}
.portrait-workspace.portrait-managing .flow-list-item{background:white;border:1px solid #e0e6ef;border-radius:10px;padding:8px}
.portrait-workspace.portrait-managing .flow-list-actions{justify-content:flex-start;flex-wrap:wrap}
.portrait-workspace.portrait-managing .flow-copy-open{display:none}
.portrait-workspace .source-review-bar{padding:6px 16px;font-size:12px;min-height:32px;flex-shrink:0}
.portrait-workspace dialog{position:fixed;inset:auto 0 var(--portrait-keyboard,0px);margin:0 auto;width:min(100%,960px);max-width:100%;max-height:calc(100dvh - var(--portrait-keyboard,0px) - 24px);padding:0;border:0;border-radius:18px 18px 0 0;box-shadow:0 -8px 40px #172b4d30}
.portrait-workspace dialog[open]{display:flex;flex-direction:column}
.portrait-workspace dialog .dialog-header{padding:12px 20px;min-height:64px;flex:none}
.portrait-workspace dialog .dialog-header h2{font-size:18px}
.portrait-workspace #dialog-body,.portrait-workspace #save-dialog-body{overflow:auto;min-height:0;padding:16px 20px;flex:1}
.portrait-workspace dialog footer{padding:12px 20px calc(12px + env(safe-area-inset-bottom));flex-shrink:0;background:#fff;border-top:1px solid #e2e7ef}
.portrait-workspace #portrait-menu{padding:16px;max-height:80dvh}
#portrait-menu>header{display:flex;justify-content:space-between;align-items:center;gap:12px}
#portrait-menu-body{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.portrait-workspace .asset-picker-shell{display:block}
.portrait-workspace .asset-picker-menu{display:flex;flex-wrap:wrap;gap:6px;padding:0 0 12px;border:0;max-height:180px;overflow:auto}
.portrait-workspace .asset-picker-menu h3{flex-basis:100%;margin:8px 0;font-size:13px}
.portrait-workspace .asset-picker-menu button{width:auto;padding:8px 12px;min-height:48px}
.portrait-workspace .asset-grid{columns:auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.portrait-workspace .asset-card{margin:0;padding:0}
.portrait-workspace .asset-picture{aspect-ratio:1;display:grid;place-items:center}
.portrait-workspace .asset-picture img{height:100%;width:100%;object-fit:contain}
.portrait-workspace .asset-picker-hint{display:none}
.portrait-workspace #portrait-update{padding:8px 16px;display:flex;justify-content:space-between;background:#fff2d4}
.portrait-workspace .on-image-bar{max-width:calc(100vw - 24px);flex-wrap:wrap;gap:6px}
.portrait-workspace .on-image-bar input{min-width:0;width:72px}
@media(min-width:1200px){.portrait-workspace #page-list{max-width:850px}.portrait-workspace #canvas-scroll{padding-inline:max(24px,calc((100vw - 1000px)/2))}.portrait-workspace #output-tabs{padding-inline:calc((100vw - 900px)/2)}}
@media(max-width:650px){.portrait-workspace .workspace-header{padding:6px 10px;gap:4px}.portrait-workspace #portrait-product-menu{min-width:48px}.portrait-workspace #page-list{padding:12px}.portrait-workspace #canvas-scroll{padding:12px}.portrait-workspace .asset-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.portrait-workspace #current-product small{max-width:160px}.portrait-workspace #portrait-actions{gap:4px;padding:6px 10px}}
body.portrait-workspace:not(.portrait-managing) #editor-panel #page-list-footer{display:none!important}
body.portrait-workspace #portrait-menu-body #source-review-bar{grid-column:1/-1;display:flex;flex-wrap:wrap;background:none;padding:0}
body.portrait-workspace #editor-panel #source-review-bar{min-height:32px}
body.portrait-workspace #editor-panel .canvas-toolbar{min-height:40px}
body.portrait-workspace .main-row-settings>header{display:flex;justify-content:space-between;align-items:center}
body.portrait-workspace[data-portrait-panel=more] .main-row-sliders{display:none}
body.portrait-workspace[data-portrait-panel=more] .main-row-actions{display:flex;flex-wrap:wrap;gap:8px}
body.portrait-workspace #portrait-menu-body #source-review-bar span{white-space:normal}
body.portrait-workspace #delivery-dialog.portrait-delivery-page{inset:0;width:100%;max-width:none;height:100dvh;max-height:100dvh;border-radius:0}
body.portrait-workspace #delivery-dialog #delivery-body{max-width:960px;width:100%;margin:0 auto;flex:1;overflow:auto}
body.portrait-workspace .on-image-values{display:flex;flex-wrap:wrap;gap:6px;max-width:calc(100vw - 24px)}
body.portrait-workspace .on-image-values label{min-width:72px;flex:1}
body.portrait-workspace .on-image-values input{min-width:0;width:100%}
body.portrait-workspace .on-image-values button{min-height:48px;flex:1}

body.portrait-workspace .on-image-values{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:min(620px,calc(100vw - 24px));max-width:calc(100vw - 24px)}
body.portrait-workspace .on-image-values label{min-width:0}
body.portrait-workspace .on-image-values button{min-width:48px}
body.portrait-workspace.portrait-overlay #portrait-actions{visibility:hidden}
body.portrait-workspace #portrait-object-name:after{content:'⌄';padding-left:8px;color:#8794aa}
body.portrait-workspace[data-portrait-panel=more] .other-image-settings .other-slider{display:none}

body.portrait-workspace #editor-panel #page-list-footer{display:none!important}

body.portrait-workspace #portrait-object-name.portrait-static-name{opacity:1;cursor:default}body.portrait-workspace #portrait-object-name.portrait-static-name:after{display:none}

body.portrait-workspace #portrait-object-bar button{min-width:48px}

body.portrait-workspace .flow-layout .canvas-toolbar{display:none}

/* Phone-sized artwork is an editor preference, never an output-size change. */
body.portrait-workspace[data-portrait-kind=main]:not(.portrait-managing) #page-list{max-width:438px}
body.portrait-workspace[data-portrait-kind=flow] #canvas .flow-stage{margin-inline:auto}
@media(min-width:760px){
 body.portrait-workspace:is([data-portrait-kind=main],[data-portrait-kind=flow],[data-portrait-kind=sku]):not(.portrait-managing) .editor{display:grid;grid-template-columns:minmax(0,1fr) 300px;grid-template-rows:auto auto minmax(0,1fr) auto}
 body.portrait-workspace:is([data-portrait-kind=main],[data-portrait-kind=flow],[data-portrait-kind=sku]):not(.portrait-managing) #portrait-object-bar{grid-column:1/-1;grid-row:1}
 body.portrait-workspace:is([data-portrait-kind=main],[data-portrait-kind=flow],[data-portrait-kind=sku]):not(.portrait-managing) #source-review-bar{grid-column:1/-1;grid-row:2}
 body.portrait-workspace:is([data-portrait-kind=main],[data-portrait-kind=flow],[data-portrait-kind=sku]):not(.portrait-managing) #editor-panel{grid-column:1;grid-row:3;min-width:0}
 body.portrait-workspace:is([data-portrait-kind=main],[data-portrait-kind=flow],[data-portrait-kind=sku]):not(.portrait-managing) #portrait-actions{grid-column:2;grid-row:3;align-self:start;display:flex;flex-direction:column;padding:12px 16px;gap:10px;border:0;background:transparent}
 body.portrait-workspace:is([data-portrait-kind=main],[data-portrait-kind=flow],[data-portrait-kind=sku]):not(.portrait-managing) #portrait-actions button{flex:none;max-width:none;width:100%}
 body.portrait-workspace:is([data-portrait-kind=main],[data-portrait-kind=flow],[data-portrait-kind=sku]):not(.portrait-managing) #output-tabs{grid-column:1/-1;grid-row:4}
 body.portrait-workspace[data-portrait-kind=flow] #canvas-scroll{padding-inline:16px}
 body.portrait-workspace[data-portrait-kind=main]:not(.portrait-managing) #page-list{padding-inline:16px;max-width:422px}
 body.portrait-workspace[data-portrait-kind=main][data-portrait-panel=text] .main-common-fields,
 body.portrait-workspace[data-portrait-kind=main][data-portrait-panel=more] .main-edit-card.portrait-active .main-row-settings{left:auto;right:16px;top:var(--phone-tools-top,180px);bottom:auto;width:268px;box-sizing:border-box;padding:16px;max-height:calc(100dvh - var(--phone-tools-top,180px) - 80px - var(--portrait-keyboard,0px));border-radius:12px}
 body.portrait-workspace:is([data-portrait-kind=main],[data-portrait-kind=flow],[data-portrait-kind=sku]) .on-image-values{position:fixed!important;left:auto!important;right:16px;top:var(--phone-tools-top,180px)!important;bottom:auto!important;width:268px!important;max-height:calc(100dvh - var(--phone-tools-top,180px) - 80px - var(--portrait-keyboard,0px));overflow:auto;grid-template-columns:repeat(2,minmax(0,1fr));padding:12px}
 body.portrait-workspace[data-portrait-kind=flow] #dialog.flow-copy-dialog{left:auto;right:16px;top:var(--phone-tools-top,180px);bottom:auto;width:300px;max-height:calc(100dvh - var(--phone-tools-top,180px) - 80px - var(--portrait-keyboard,0px));border-radius:12px}
 body.portrait-workspace[data-portrait-kind=flow] #dialog.flow-copy-dialog .flow-copy-browser{display:block}
}
body.portrait-workspace[data-portrait-kind=main]:not(.portrait-managing) .main-edit-card.portrait-active{max-width:390px;margin-inline:auto}

body.portrait-workspace[data-portrait-kind=sku]:not(.portrait-managing) .sku-edit-card.portrait-active{max-width:390px;margin-inline:auto}
body.portrait-workspace #dialog.asset-picker-dialog #dialog-body{display:flex;flex-direction:column;overflow:hidden;min-height:0}
body.portrait-workspace #dialog.asset-picker-dialog .asset-picker-shell{display:flex;flex-direction:column;flex:1;min-height:0;height:100%;overflow:hidden}
body.portrait-workspace #dialog.asset-picker-dialog .asset-picker-menu{flex:none;max-height:150px;overflow:auto}
body.portrait-workspace #dialog.asset-picker-dialog .asset-picker-content{flex:1;min-height:0;overflow:hidden}
body.portrait-workspace #dialog.asset-picker-dialog .asset-picker-results{flex:1;min-height:0;overflow-y:auto;touch-action:pan-y;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
@media(min-width:760px){
body.portrait-workspace[data-portrait-kind=sku][data-portrait-panel=text] .sku-edit-card.portrait-active .portrait-fields,
body.portrait-workspace[data-portrait-kind=sku][data-portrait-panel=more] .sku-edit-card.portrait-active .sku-sort-actions{left:auto;right:16px;top:var(--phone-tools-top,180px);bottom:auto;width:268px;box-sizing:border-box;padding:16px;max-height:calc(100dvh - var(--phone-tools-top,180px) - 80px - var(--portrait-keyboard,0px));border-radius:12px}
}

/* Compact image choices; video cards keep their playback controls. */
body.portrait-workspace #dialog.asset-picker-dialog .asset-grid:not(.asset-video-grid){display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px;columns:auto;align-items:start}
body.portrait-workspace #dialog.asset-picker-dialog .asset-grid:not(.asset-video-grid) .asset-card{display:block;min-width:0;margin:0}
body.portrait-workspace #dialog.asset-picker-dialog .asset-grid:not(.asset-video-grid) .asset-picture{aspect-ratio:1;display:grid;place-items:center}
body.portrait-workspace #dialog.asset-picker-dialog .asset-grid:not(.asset-video-grid) .asset-picture img{width:100%;height:100%;max-height:150px;object-fit:contain}
