/* Labs Studio: one dark working surface, with distinct input, preview and action layers. */
html body[data-page=labs][data-tool-page] #main-content{--studio-bg:#f9f4ec;--studio-panel:#eee4d6;--studio-control:#fffdf8;--studio-ink:#29221d;--studio-muted:#68594d;--studio-line:#c8b7a7;--studio-accent:#a6370b;--studio-selection-ink:#ffffff;--studio-action:#a6370b;--studio-selected:#edd0b5;--studio-selected-ink:#712800;--studio-hover:#eadccc}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench{--bg:var(--studio-bg);--bg-secondary:var(--studio-panel);--bg-tertiary:var(--studio-panel);--label:var(--studio-ink);--label-secondary:var(--studio-muted);--separator:var(--studio-line);--accent:var(--studio-accent);--control:var(--studio-control);--selected:var(--studio-selected);--control-ink:var(--studio-ink);--control-bg:var(--studio-control);--control-line:var(--studio-line);--cl-surface:var(--studio-control);--cl-ink:var(--studio-ink);--cl-muted:var(--studio-muted);--cl-line:var(--studio-line);--font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--studio-bg);color:var(--studio-ink);border:0;padding:28px;box-shadow:0 12px 32px rgb(28 21 38 / .08)}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :is(h2,h3,label,legend,summary,strong){color:var(--studio-ink)}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :is(.tool-help,.tool-status,.bg-status,.bg-upload p,.cl-status,.cl-row p,.release-storage-note,.release-form-help,.release-count){color:var(--studio-muted)}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :is(input:not([type=color]):not([type=range]):not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea){background:var(--studio-control);color:var(--studio-ink);border:1px solid var(--studio-line);border-radius:8px;font-family:var(--font-sans);caret-color:var(--studio-accent)}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :is(input,textarea)::placeholder{color:var(--studio-muted);opacity:1}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :is(button,.file-pick,.cl-upload){background:var(--studio-panel);color:var(--studio-ink);border-color:var(--studio-line);font-family:var(--font-sans);box-shadow:none}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :is(button,.file-pick,.cl-upload):hover:not(:disabled){background:var(--studio-hover)}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :is(button.primary,.bg-primary,.cl-primary,.release-save,#copy-text,#copy-output,#apply-batch,#export,#process,#export-png,.file-pick,.cl-upload){background:var(--studio-action);color:#fff;border-color:transparent}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :is(button.primary,.bg-primary,.cl-primary,.release-save,#copy-text,#copy-output,#apply-batch,#export,#process,#export-png,.file-pick,.cl-upload):hover:not(:disabled){background:#bd4512}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench button:disabled{opacity:.4}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :is(input[type=range],input[type=checkbox]){accent-color:var(--studio-accent)}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :is(.drop-surface,.bg-upload){background:var(--studio-control);border-color:var(--studio-line);border-style:dashed;padding:40px 24px}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :is(.drop-surface h2,.bg-upload h2,#cl-empty h2){font-family:alcyone,sans-serif;font-weight:400;font-size:clamp(1.6rem,2.6vw,2rem)}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :is(.drop-surface p,#cl-empty p){color:var(--studio-muted)}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :is(.release-preview,.release-changes,.cl-inspector,.meta-stage,.qr-stage,.framer-stage){background:var(--studio-panel);border-color:var(--studio-line);box-shadow:none}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench .cl-stage{background-color:var(--studio-control);border-color:var(--studio-line)}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :is(.cl-tabs,.release-tabs,.release-workspace-nav,.release-mobile-switch){background:var(--studio-control);border-color:var(--studio-line);box-shadow:none}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :is(.cl-tabs,.release-tabs,.release-workspace-nav,.release-mobile-switch,.meta-modes,.meta-platforms) button{border:0;background:transparent;color:var(--studio-muted)}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :is(.cl-tabs,.release-tabs,.release-workspace-nav,.release-mobile-switch,.meta-modes,.meta-platforms) button[aria-pressed=true]{background:var(--studio-selected);color:var(--studio-selected-ink)}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :focus-visible{outline:2px solid var(--studio-accent);outline-offset:4px}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench ::selection{background:var(--studio-accent);color:var(--studio-selection-ink)}
html body[data-page=labs][data-tool-page=role-customizer] .tool-workbench{padding:0;box-shadow:none}
.tool-pane-nav{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0 0 24px;border-bottom:1px solid var(--studio-line);padding-bottom:14px}
html body[data-page=labs][data-tool-page] .tool-pane-nav button{min-height:44px;padding:10px 20px;border:0;border-radius:8px;background:transparent;color:var(--studio-muted);font:500 .9375rem var(--font-sans);cursor:pointer}
html body[data-page=labs][data-tool-page] .tool-pane-nav button[aria-pressed=true]{color:var(--studio-selected-ink);background:var(--studio-selected)}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench .tool-pane-nav button:hover{background:var(--studio-hover)}
body[data-tool-page=qr-generator] .qr-layout{grid-template-areas:'content preview';grid-template-columns:minmax(280px,380px) minmax(0,1fr);gap:40px}
body[data-tool-page=qr-generator][data-tool-pane=design] .qr-layout{grid-template-areas:'design preview'}
body[data-tool-page=qr-generator] .qr-design{padding-top:0;border-top:0}
body[data-tool-page=meta-preview] .meta-layout{grid-template-columns:minmax(0,1fr)}
body[data-tool-page=meta-preview][data-tool-pane=design] .meta-layout{grid-template-columns:minmax(0,1fr) 300px}
body[data-tool-page=meta-preview] .tool-pane-nav{margin-top:24px}
@media(max-width:760px){html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench{padding:20px}.tool-pane-nav{gap:4px}body[data-tool-page=qr-generator] .qr-layout,body[data-tool-page=qr-generator][data-tool-pane=design] .qr-layout{grid-template-columns:minmax(0,1fr);grid-template-areas:'content' 'preview';gap:24px}body[data-tool-page=qr-generator][data-tool-pane=design] .qr-layout{grid-template-areas:'design' 'preview'}body[data-tool-page=meta-preview][data-tool-pane=design] .meta-layout{grid-template-columns:minmax(0,1fr)}html body[data-page=labs][data-tool-page=role-customizer] .tool-workbench{padding:0}}

html body[data-page=labs][data-tool-page] .tool-workbench .tool-pane-nav button[aria-pressed=true]{color:var(--studio-selected-ink);background:var(--studio-selected)}
html body[data-page=labs][data-tool-page] .tool-workbench .cl-tabs button[aria-selected=true]{color:var(--studio-selected-ink);background:var(--studio-selected)}
body[data-tool-page=screenshot-framer] .tool-workbench:has(#empty:not([hidden])) .frame-presets canvas{display:none}
body[data-tool-page=screenshot-framer] .tool-workbench:has(#empty:not([hidden])) .frame-presets button{min-height:44px}
body[data-tool-page=meta-preview] .meta-layout:has(.meta-edit-disclosure[open]){grid-template-columns:minmax(0,1fr) 300px}
.meta-edit-disclosure{padding-top:16px;border-top:1px solid var(--studio-line)}
.meta-edit-disclosure>summary{cursor:pointer;min-height:44px}
.meta-edit-disclosure .tool-inspector{border:0;padding-top:16px}
@media(max-width:760px){body[data-tool-page=meta-preview] .meta-layout:has(.meta-edit-disclosure[open]){grid-template-columns:minmax(0,1fr)}}

html[data-theme=dark] body[data-page=labs][data-tool-page] #main-content{--studio-bg:#252220;--studio-panel:#332d28;--studio-control:#1b1816;--studio-ink:#faf3eb;--studio-muted:#c7b7a8;--studio-line:#64554a;--studio-accent:#ff9a6d;--studio-selection-ink:#29221d;--studio-action:#a6370b;--studio-selected:#58301e;--studio-selected-ink:#ffc5a2;--studio-hover:#47382d}
html:not([data-theme=dark]) body[data-page=labs][data-tool-page]{background-color:#e5dbcd;background-image:none}
html[data-theme=dark] body[data-page=labs][data-tool-page]{background-color:#141210;background-image:none}
html body[data-page=labs][data-tool-page] .role-app{--bg:var(--studio-bg);--bg-secondary:var(--studio-panel);--label:var(--studio-ink);--label-secondary:var(--studio-muted);--separator:var(--studio-line);--accent:var(--studio-accent);--action:var(--studio-action);--selected:var(--studio-selected);box-shadow:none}
html body[data-page=labs][data-tool-page] .role-app :is(.role-tabs,.role-fill-tabs){background:var(--studio-panel)}
html body[data-page=labs][data-tool-page] .role-app .role-symbol-filter :is(input,select){background:var(--studio-control)!important}
html body[data-page=labs][data-tool-page] .role-app .role-icon-library button:hover{background:var(--studio-hover)}
html body[data-page=labs][data-tool-page] .role-app .role-icon-library button[aria-pressed=true]{color:#fff;background:var(--studio-action)}
html body[data-page=labs][data-tool-page] .role-app :is(input,select){color:var(--studio-ink);border-color:var(--studio-line)}
html body[data-page=labs][data-tool-page] .tool-workbench :is(.cl-tabs,.meta-modes,.frame-presets) :is([aria-selected=true],[aria-pressed=true]){background:var(--studio-selected);color:var(--studio-selected-ink);border-color:var(--studio-accent)}
html body[data-page=labs][data-tool-page] .tool-workbench :is(.qr-stage,.framer-stage,.meta-stage){border:0;border-radius:12px}
html body[data-page=labs][data-tool-page] .tool-shell-info>summary{border:0;margin:0}
.tool-workbench .tool-inspector-disclosure{border-top:1px solid var(--studio-line);padding-top:16px}
.tool-inspector-disclosure>summary{cursor:pointer;min-height:44px;font-weight:600}
.tool-inspector-disclosure .tool-inspector{border:0;padding-top:16px}
.tool-layout:has(.tool-inspector-disclosure:not([open])){grid-template-columns:minmax(0,1fr)}
html body[data-page=labs][data-tool-page] .tool-workbench{box-shadow:none}
html body[data-page=labs][data-tool-page] .role-workspace{grid-template-columns:minmax(0,1fr) minmax(340px,.9fr)}
html body[data-page=labs][data-tool-page] .role-icon-library{grid-template-columns:repeat(8,minmax(0,1fr))}
@media(max-width:760px){html body[data-page=labs][data-tool-page] .role-icon-library{grid-template-columns:repeat(6,minmax(0,1fr))}}

/* Shared task rhythm: context, input, result, export. Optional work stays quiet. */
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench{font-family:var(--font-body,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif)}
html body[data-page=labs][data-tool-page]:not([data-tool-page=role-customizer]) .tool-workbench :is(h2,h3){font-weight:600;line-height:1.3}
.studio-options{border-top:1px solid var(--studio-line);padding:8px 0;margin-top:16px;min-width:0}
.studio-options>summary{min-height:44px;cursor:pointer;font-size:14px;align-content:center}
.studio-options[open]>summary{margin-bottom:12px}
.studio-options>details{border:0;margin-top:0}
.studio-export{display:flex;align-items:end;flex-wrap:wrap;gap:12px;margin-top:24px;padding-top:20px;border-top:1px solid var(--studio-line)}
.studio-export>label{flex:1 1 120px;max-width:200px;margin:0}
.studio-export :is(input,select){margin-bottom:0!important}
.studio-export>button{flex:1 1 160px;min-height:44px}
.tool-workbench .tool-actions{justify-content:start;gap:12px}
.tool-workbench .tool-actions>button{flex:0 1 auto;min-height:44px}
.tool-workbench .studio-upload-actions{margin:16px 0 24px;justify-content:center}
html body[data-page=labs][data-tool-page] .tool-workbench .studio-upload-actions #example{background:transparent;border-color:transparent;color:var(--studio-muted)}
html body[data-page=labs][data-tool-page] .tool-workbench :is(.studio-editor,.release-compose){background:transparent;padding:0;border:0;box-shadow:none}
html body[data-page=labs][data-tool-page] .tool-workbench .release-primary{background:var(--studio-action);color:#fff;border-color:transparent}
html body[data-page=labs][data-tool-page] .tool-workbench :is(.release-project-bar,.release-workspace-nav){margin-top:0;padding-top:0}
.release-project-bar{gap:12px;flex-wrap:wrap;padding-bottom:20px}
.release-project-bar>label{width:auto;max-width:360px;flex:1}
.release-project-bar>.studio-history{margin-left:auto;background:transparent!important;border:0!important}
.release-project-menu>div{max-width:calc(100vw - 72px);left:auto;right:0}
.release-project-menu .release-local-label{margin:0}
.release-workspace-nav{margin-top:20px!important}
.release-workspace-nav button{min-width:0}
.release-layout{gap:32px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding-top:24px}
.release-language-bar{gap:8px;align-items:center;margin:0 0 16px}
#release-languages{flex:0 1 auto;padding:0}
.release-add-language{margin:0;border:0;padding:0}
.release-add-language>summary{font-size:13px}
.release-add-language>label{width:200px}
.release-main .release-compose-head{margin-bottom:12px}
.release-changes-head{margin:0}
.release-main #change-text{min-height:176px;margin-bottom:12px}
.release-input-help{font-size:13px;margin:0 0 8px}
.release-change-controls{grid-template-columns:1fr auto;gap:12px}
.release-change-controls #add-change{min-height:44px}
.release-added #sort-changes{margin-bottom:12px}
.release-main .release-preview{padding:24px;top:104px;border-radius:12px}
.release-main #release-output{min-height:180px;padding:20px 0;font-size:15px;line-height:1.65}
.release-main #download-texts{background:transparent;border:0;font-size:13px;margin-top:8px}
.release-save-options .release-metadata{max-width:none}
.release-main .release-save-options #save-release{width:100%;background:var(--studio-panel);border-color:var(--studio-line);color:var(--studio-ink)}
.release-main .release-inline-actions:empty{display:none}
.release-main .release-style>label{max-width:520px}
.release-style .studio-options{max-width:520px}
body[data-tool-page=meta-preview] .meta-report{margin-top:16px}
body[data-tool-page=meta-preview] .meta-entry{max-width:none}
body[data-tool-page=meta-preview] #check-panel{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end;margin-top:20px}
body[data-tool-page=meta-preview] #check-panel label{margin:0}
body[data-tool-page=meta-preview] #check-panel input{margin-bottom:0}
body[data-tool-page=meta-preview] #check-panel .tool-actions{margin:0}
body[data-tool-page=meta-preview] .meta-layout{margin-top:24px}
body[data-tool-page=meta-preview] .meta-edit-disclosure{padding-top:0}
body[data-tool-page=meta-preview] .meta-edit-disclosure .tool-inspector>h2{display:none}
body[data-tool-page=meta-preview] .meta-report :is(.meta-audit,.meta-sources){padding:12px 0;border:0}
body[data-tool-page=meta-preview] .meta-report h2{font-size:16px}
body[data-tool-page=meta-preview] .meta-stage{padding:20px}
body[data-tool-page=meta-preview] .meta-modes{gap:4px}
body:is([data-tool-page=screenshot-framer],[data-tool-page=image-compressor]) .tool-layout{grid-template-columns:minmax(0,1fr) 300px;gap:32px}
body:is([data-tool-page=screenshot-framer],[data-tool-page=image-compressor]) .tool-layout:has(#empty:not([hidden])){grid-template-columns:minmax(0,1fr)}
body:is([data-tool-page=screenshot-framer],[data-tool-page=image-compressor]) .tool-layout:has(#empty:not([hidden])) .studio-editor{display:none}
body[data-tool-page=screenshot-framer] .tool-workbench:has(#empty:not([hidden])) #presets{display:none}
body[data-tool-page=image-compressor] .tool-workbench #clear:disabled{display:none}
body[data-tool-page=screenshot-framer] .tool-workbench .studio-presets{margin-top:24px}
body[data-tool-page=screenshot-framer] .studio-editor .frame-dimensions{margin:12px 0}
body[data-tool-page=qr-generator] .qr-stage{max-width:400px;margin:0 auto;padding:24px}
body[data-tool-page=qr-generator] .qr-proof .tool-actions #png{flex:1}
body[data-tool-page=qr-generator] .qr-proof>p{font-size:13px;margin:8px 0}
body[data-tool-page=qr-generator] .qr-print-settings{border-top:1px solid var(--studio-line);margin-top:16px;padding:8px 0}
body[data-tool-page=background-remover] .bg-controls .studio-options .bg-modes{margin:12px 0}
body[data-tool-page=background-remover] .bg-workspace{gap:32px}
body[data-tool-page=background-remover] .bg-topbar{padding-bottom:20px}
body[data-tool-page=color-lab] #cl-status:empty{display:none}
body[data-tool-page=color-lab] .cl-workspace{margin-top:24px;gap:32px}
body[data-tool-page=color-lab] .cl-inspector{border:0!important;padding:24px}
body[data-tool-page=color-lab] .cl-sampling-group{margin-top:20px}
body[data-tool-page=color-lab] .cl-tabs{border:0!important;padding:4px}
body[data-tool-page=color-lab] .cl-tabs button{min-height:44px}
body[data-tool-page=color-lab] .cl-stage:has(#cl-image-wrap[hidden])~.cl-help{display:none}
@media(max-width:1024px){.release-layout{grid-template-columns:minmax(0,1fr)}.release-mobile-switch{margin-top:16px}.release-main .release-preview{position:static}.release-project-bar>label{max-width:none}.release-main .release-change-controls{grid-template-columns:minmax(0,1fr) auto}}
@media(max-width:760px){
 body:is([data-tool-page=screenshot-framer],[data-tool-page=image-compressor]) .tool-layout{grid-template-columns:minmax(0,1fr);gap:24px}
 .studio-export{gap:8px}.studio-export>button{flex:1 1 100%}
 .release-project-bar{gap:8px}.release-project-bar>label{flex:1 1 100%}
 .release-project-menu{flex:1}.release-project-bar>.studio-history{margin-left:0}
 .release-main .release-preview{padding:20px}.release-main #change-text{min-height:160px}
 .release-main .release-change-controls{grid-template-columns:minmax(0,1fr)}
 body[data-tool-page=meta-preview] #check-panel{grid-template-columns:minmax(0,1fr)}
 body[data-tool-page=meta-preview] #check-panel .tool-actions>button{flex:1}
 body[data-tool-page=color-lab] .cl-tabs{display:grid;grid-template-columns:1fr 1fr}
 .tool-workbench .studio-upload-actions{gap:8px;flex-wrap:wrap}
 .studio-upload-actions .file-pick{flex:1 1 100%;text-align:center;justify-content:center}
}
.release-main:has([data-release-view=compose]:not([hidden])) .release-workspace-nav{display:none}
.release-main:has([data-release-view=compose]:not([hidden])) .release-layout{padding-top:24px}
body[data-tool-page=screenshot-framer] .studio-editor .frame-dimensions:has(input:disabled){display:none}
.tool-workbench .studio-upload-actions{justify-content:start}
body:is([data-tool-page=screenshot-framer],[data-tool-page=image-compressor]) .tool-layout:has(#empty:not([hidden])) .studio-upload-actions{justify-content:center}
@media(max-width:760px){body:is([data-tool-page=screenshot-framer],[data-tool-page=image-compressor]) .tool-layout:has(#empty[hidden]) .studio-editor{order:-1}}

/* Release actions share the same desktop and touch target floor. */
html body[data-page=labs][data-tool-page=release-notes] #main-content :is(button,summary){min-height:44px}
