.brand-assets{--ba-border:var(--border,#303946);--ba-panel:var(--surface,#ffffff);--ba-ink:var(--text-pri,#172536);padding-bottom:110px}.ba-heading,.ba-panel-title,.ba-summary{display:flex;align-items:center;justify-content:space-between;gap:16px}.ba-heading h1{margin:0 0 6px}.ba-heading .eyebrow{margin:0 0 8px}.ba-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.brand-assets button,.brand-assets .btn{min-height:40px;padding:9px 12px;border:1px solid var(--ba-border);border-radius:8px;background:var(--ba-panel);color:var(--ba-ink);font:inherit;cursor:pointer;line-height:1.3;text-decoration:none}.brand-assets button:disabled{opacity:.55;cursor:not-allowed}.brand-assets button:focus-visible,.brand-assets canvas:focus-visible{outline:3px solid #38bdf8;outline-offset:3px}.brand-assets button[aria-pressed=true],.brand-assets button.selected{border-color:#38bdf8;background:color-mix(in srgb,#38bdf8 12%,var(--ba-panel))}.brand-assets .primary{background:#087fa5;color:#fff;border-color:#16a3c7}.ba-modes{display:flex;gap:8px;margin:24px 0 14px}.ba-modes button{min-width:110px;font-weight:700}.ba-save-note{border-left:3px solid #38bdf8;padding:8px 12px;font-size:13px;line-height:1.6}.ba-layout{display:grid;grid-template-columns:260px minmax(300px,1fr) 250px;gap:16px;align-items:start;margin-top:20px}.ba-brief,.ba-layers{background:var(--ba-panel);border:1px solid var(--ba-border);border-radius:12px;padding:16px;min-width:0}.brand-assets h2{font-size:19px;margin:0 0 12px}.brand-assets h3{font-size:15px;margin:16px 0 9px}.ba-contract{font-size:13px;color:#7dd3fc;line-height:1.8;border-bottom:1px solid var(--ba-border);padding-bottom:12px}.brand-assets label{display:grid;gap:6px;font-size:12px;font-weight:600;margin:12px 0;min-width:0}.brand-assets input:not([type=checkbox]):not([type=file]):not([type=range]),.brand-assets textarea,.brand-assets select{width:100%;min-width:0;box-sizing:border-box;padding:9px 10px;border:1px solid var(--ba-border);border-radius:6px;background:var(--bg,#0e141c);color:var(--ba-ink);font:inherit;font-weight:400;font-size:13px;line-height:1.5}.brand-assets textarea{resize:vertical}.ba-review{width:100%;margin-top:12px;font-weight:700!important}.ba-toolbar{display:flex;flex-wrap:wrap;gap:12px;padding:10px;border:1px solid var(--ba-border);border-radius:10px;background:var(--ba-panel);margin-bottom:16px}.ba-toolbar label:not(.btn){display:flex;align-items:center;gap:8px;margin:0}.ba-toolbar input[type=range]{width:85px}.ba-stage{position:relative;display:flex;align-items:center;justify-content:center;min-height:280px;border:1px solid var(--ba-border);border-radius:8px;overflow:hidden;background-color:#0b1118;padding:16px}.ba-stage canvas{display:block;width:100%;height:auto;max-width:100%;touch-action:none;cursor:crosshair;background-color:#e2e4e8;background-image:linear-gradient(45deg,#c7cbd1 25%,transparent 25%),linear-gradient(-45deg,#c7cbd1 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#c7cbd1 75%),linear-gradient(-45deg,transparent 75%,#c7cbd1 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0;outline:2px solid #16a3c7;outline-offset:0;box-shadow:0 0 0 5px rgba(22,163,199,.18),0 8px 28px rgba(0,0,0,.45)}.ba-empty{position:absolute;text-align:center;pointer-events:none;background:#111a24df;color:#fff;border:1px solid #fff3;border-radius:12px;padding:18px;line-height:1.8}.ba-summary{font-size:11px;color:var(--muted,#9ba8b8);padding:10px 0}.ba-pair{display:grid;grid-template-columns:1fr 1fr;gap:0 8px}.ba-check{display:flex!important;align-items:center;font-weight:400!important}.ba-layer-list{display:grid;gap:6px;max-height:320px;overflow:auto}.brand-assets .ba-layer{display:grid;grid-template-columns:38px 1fr;gap:6px 8px;align-items:center;text-align:left;min-height:58px;width:100%;padding:7px}.ba-layer img{width:38px;height:38px;object-fit:contain;grid-row:span 2;background:#ddd;border-radius:4px}.ba-layer span{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ba-layer small{font-size:10px;color:var(--muted,#9ba8b8)}.ba-region{border-left:3px solid var(--region-color);padding:8px;margin-top:12px;background:var(--bg,#0e141c);border-radius:4px}.brand-assets .ba-region button{font-size:12px}.ba-region.selected{outline:1px solid var(--region-color)}.ba-region label{margin:8px 0}.ba-model,.ba-receipt,.ba-quote,[data-ba-prompt],.ba-result{margin-top:18px;padding:16px;border:1px solid var(--ba-border);border-radius:10px;background:var(--ba-panel);font-size:13px;line-height:1.6}.ba-model summary{cursor:pointer;font-weight:600}.ba-result img{display:block;max-height:420px;max-width:100%;margin:12px auto;object-fit:contain}.brand-assets pre{white-space:pre-wrap;overflow-wrap:anywhere;font:12px/1.7 monospace;max-height:320px;overflow:auto}.ba-reference{display:grid;grid-template-columns:48px 1fr 28px;gap:6px;align-items:center;padding:8px 0;border-bottom:1px solid var(--ba-border)}.ba-reference img{width:48px;height:48px;object-fit:contain}.ba-reference label{margin:0}.ba-reference input{grid-column:1/-1;grid-row:2}.ba-reference button{padding:3px;min-height:32px}.ba-picker{padding:12px;border:1px solid var(--ba-border);border-radius:10px}.ba-picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(95px,1fr));gap:8px;max-height:340px;overflow:auto}.ba-picker-grid img{width:100%;height:80px;object-fit:contain}.ba-picker-grid span{font-size:11px;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ba-model a,.ba-save-note a{color:#7dd3fc}.brand-assets hr{border:0;border-top:1px solid var(--ba-border);margin:20px 0}.brand-assets .muted{line-height:1.6}.ba-work{min-width:0}@media(min-width:1700px){.ba-layout{grid-template-columns:290px minmax(400px,1fr) 280px}}@media(max-width:1150px){.ba-layout{grid-template-columns:230px minmax(280px,1fr)}.ba-layers{grid-column:1/-1}.ba-layer-list{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.ba-layers .ba-pair{max-width:500px}.ba-heading{align-items:flex-start;flex-direction:column}}@media(max-width:700px){.ba-layout{grid-template-columns:1fr}.ba-work{grid-row:1}.ba-brief{grid-row:2}.ba-layers{grid-row:3}.ba-modes{overflow:auto}.ba-modes button{min-width:90px}.ba-stage{min-height:170px}.ba-heading h1{font-size:25px}.ba-heading>.ba-actions{width:100%}.ba-heading>.ba-actions>*{flex:1}.ba-toolbar .btn,.ba-toolbar button{font-size:12px}.ba-brief,.ba-layers{padding:12px}}

/* References remain above the working canvas at every screen size. */
.ba-references{margin:18px 0;padding:16px;border:1px solid var(--ba-border);border-radius:12px;background:var(--ba-panel)}.ba-references .ba-panel-title h2{margin:0}.brand-assets .ba-reference-drop{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;min-height:92px;margin:14px 0 10px;padding:14px;border:2px dashed var(--ba-border);border-radius:10px;text-align:center;cursor:pointer;background:var(--bg,#0e141c)}.ba-reference-drop span{font-weight:400;color:var(--text-sec,#9ba8b8)}.brand-assets .ba-reference-drop:hover,.brand-assets .ba-reference-drop.is-dragover,.brand-assets .ba-reference-drop:focus-within{border-color:#38bdf8;background:color-mix(in srgb,#38bdf8 8%,var(--ba-panel))}.ba-reference-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px 20px}.ba-references .ba-reference{min-width:0}.ba-references .ba-reference img{border-radius:6px}.ba-references .muted{margin:8px 0}@media(max-width:600px){.ba-reference-grid{grid-template-columns:1fr}}

/* Plain-language canvas tools, grouped by task. */
.brand-assets .ba-layers{padding:0;background:transparent;border:0;display:grid;gap:16px}.ba-side-section{padding:18px;border:1px solid var(--ba-border);border-radius:12px;background:var(--ba-panel);min-width:0}.brand-assets .ba-side-section h2{font-size:16px;line-height:1.4;margin:0}.ba-side-section .ba-panel-title{align-items:flex-start;gap:10px;margin-bottom:12px}.ba-panel-count{font-size:11px;line-height:1.5;color:var(--text-sec,#9ba8b8);white-space:nowrap;padding-top:3px}.ba-side-help{font-size:13px;line-height:1.6;color:var(--text-sec,#9ba8b8);margin:0 0 14px}.ba-sidebar-empty{padding:16px 12px;text-align:center;border:1px dashed var(--ba-border);border-radius:8px;margin-bottom:12px}.ba-sidebar-empty b{font-size:13px;font-weight:600}.ba-sidebar-empty p{font-size:12px;line-height:1.6;color:var(--text-sec,#9ba8b8);margin:6px 0 0}.brand-assets .ba-add-image,.brand-assets .ba-add-region{width:100%;margin:4px 0 12px;text-align:center;font-weight:600}.ba-image-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}.brand-assets .ba-image-actions button{font-size:12px;padding:9px 6px}.ba-advanced{border-top:1px solid var(--ba-border);padding-top:14px;margin-top:16px}.ba-advanced summary{font-size:13px;font-weight:600;cursor:pointer;line-height:1.5}.ba-advanced[open] summary{margin-bottom:14px}.brand-assets .ba-advanced>.ba-check{align-items:flex-start;gap:8px;line-height:1.5}.ba-advanced>button{width:100%;margin:4px 0 12px}.ba-side-note{font-size:12px;margin:12px 0 0}.brand-assets .ba-side-section .ba-region>button{width:100%;text-align:left}.brand-assets .ba-side-section .ba-region{margin:12px 0;padding:10px}.ba-side-section .ba-layer-list:empty{display:none}

.brand-assets .ba-reference-drop{font-size:13px;line-height:1.6}.ba-reference-drop:focus-visible{outline:3px solid #38bdf8;outline-offset:3px}.ba-reference-drop [data-ba="choose-refs"]{margin-top:6px;min-height:36px;padding:7px 16px;font-size:12px}

.ba-modes{display:grid;grid-template-columns:repeat(4,minmax(120px,1fr));gap:10px}.ba-modes button{display:grid;gap:5px;text-align:left}.ba-modes button small{font-size:11px;font-weight:400;color:var(--text-sec,#9ba8b8)}.ba-modes button[aria-pressed=true] small{color:inherit}@media(max-width:700px){.ba-modes{grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible}.ba-modes button{min-width:0}}

/* Reference actions have their own rows; the narrow third column is only for remove. */
.brand-assets .ba-reference [data-ba-import-ref],.brand-assets .ba-reference [data-ba-import-flat]{grid-column:1/-1;grid-row:3;width:100%;min-width:0;box-sizing:border-box;padding:9px 12px;white-space:nowrap;text-align:center}
.brand-assets .ba-reference [data-ba-import-flat]{grid-row:4}
.brand-assets .ba-reference [data-ba-remove-ref]{grid-column:3;grid-row:1}

.brand-assets .ba-delete-layer{color:#fca5a5;border-color:#7f3a43}.brand-assets .ba-delete-layer:hover:not(:disabled){background:#522630;color:#fff}

.brand-assets .ba-review-feedback{font-size:12px;line-height:1.6;color:#7dd3fc;margin:8px 0}.brand-assets .ba-prompt-dialog{width:min(840px,calc(100vw - 40px));max-height:85vh;box-sizing:border-box;overflow:auto;padding:24px;border:1px solid var(--ba-border);border-radius:14px;background:var(--ba-panel);color:var(--ba-ink);box-shadow:0 20px 80px #0008}.ba-prompt-dialog::backdrop{background:#030913b8}.ba-prompt-dialog header,.ba-prompt-dialog footer{display:flex;justify-content:space-between;gap:12px;align-items:center}.brand-assets .ba-prompt-dialog h2{margin:0}.ba-prompt-dialog pre{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;font-size:13px;line-height:1.7}.ba-prompt-dialog [data-ba-prompt]{max-height:50vh;overflow:auto;margin:16px 0}.ba-prompt-dialog footer{justify-content:flex-end;flex-wrap:wrap}.ba-prompt-dialog>p{font-size:13px;line-height:1.6}

/* Brief first; the image-only editor is a separate, reversible step. */
.ba-flow{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:20px 0}.ba-flow>span{padding:10px 14px;border:1px solid var(--ba-border);border-radius:9px;color:var(--text-sec,#9ba8b8);font-size:13px}.ba-flow>[aria-current=step]{border-color:#16a3c7;color:var(--ba-ink);font-weight:700}.ba-flow button{margin-left:auto}.ba-edit-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:18px 18px 18px 38px;border:1px solid var(--ba-border);border-radius:12px;background:var(--ba-panel)}.ba-edit-steps li{padding-left:3px;font-size:13px;line-height:1.6}.ba-edit-steps span{display:block;color:var(--text-sec,#9ba8b8)}.ba-edit-dot{display:inline-block;width:12px;height:12px;border-radius:50%;background:var(--region-color);border:1px solid #ffffff80;flex-shrink:0;margin-right:7px}.ba-active-brush{display:flex;align-items:center;font-size:13px;font-weight:600;padding:8px}.brand-assets .ba-next{width:100%;min-height:50px;font-weight:700;margin:12px 0}.brand-assets [hidden]{display:none!important}.ba-screen-brief .ba-layout{grid-template-columns:minmax(0,720px);justify-content:center}.ba-screen-brief .ba-layers,.ba-screen-brief .ba-work>:not(.ba-result):not(.ba-receipt):not([data-ba-error]):not([data-ba-status]){display:none}.ba-screen-editor .ba-brief,.ba-screen-editor .ba-references,.ba-screen-editor .ba-modes{display:none}.ba-screen-editor .ba-layout{grid-template-columns:minmax(0,1fr) 320px}.ba-screen-editor .ba-layers .ba-side-section:first-child{order:2}.ba-screen-editor .ba-stage canvas{max-height:70vh;width:auto;max-width:100%}.ba-region.selected{box-shadow:0 0 0 1px var(--region-color)}
@media(max-width:900px){.ba-screen-editor .ba-layout{grid-template-columns:minmax(0,1fr)}.ba-screen-editor .ba-layers{grid-template-columns:repeat(2,minmax(0,1fr))}.ba-edit-steps{grid-template-columns:1fr;gap:10px}}@media(max-width:600px){.ba-screen-editor .ba-layers{grid-template-columns:1fr}.ba-flow button{margin-left:0;width:100%}}

/* Compact, theme-aware editing steps and visible request feedback. */
.brand-assets{color:var(--ba-ink)}
/* The dashboard already owns the sticky header; editor actions stay in page flow. */
.ba-heading{background:var(--bg);padding:10px 0;border-bottom:1px solid var(--ba-border)}
.ba-heading h1{font-size:27px}.ba-heading .eyebrow{display:none}.ba-heading p{margin:4px 0;font-size:13px}
.ba-load-status:empty{display:none}.ba-load-status{padding:10px 0;color:var(--text-sec);display:flex;align-items:center;gap:12px}
.ba-flow{margin:12px 0;gap:8px}.ba-flow button{margin-left:0;background:var(--surface);color:var(--text-sec)}
.ba-flow>[aria-current=step]{color:var(--text-pri);background:var(--accent-dim);border-color:var(--accent);font-weight:700}
.ba-modes{margin:12px 0}.ba-modes button small{color:var(--text-sec)}
.ba-references{padding:12px!important}.ba-reference-drop{min-height:80px!important;padding:12px!important}
.ba-contract,.ba-save-note a,.ba-model a{color:var(--accent-light)}
.ba-save-note{margin:10px 0;padding:4px 10px}.ba-layout{margin-top:12px}
.ba-screen-brief .ba-layout{grid-template-columns:minmax(0,1fr)}
.ba-brief{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px}
.ba-brief h2,.ba-brief .ba-side-help,.ba-brief .ba-contract,.ba-brief .ba-review,.ba-brief .ba-review-feedback,.ba-brief .gs-error,.ba-brief>.ba-next{grid-column:1/-1}
.ba-brief label{margin:4px 0}.ba-brief .ba-contract{display:none}.ba-screen-brief .ba-work:has(> [data-ba-status]:only-child){margin:0}
.ba-review{position:sticky;bottom:12px;z-index:5;box-shadow:0 2px 12px #0002}
@media(max-width:700px){.ba-brief{grid-template-columns:minmax(0,1fr)}.ba-heading{position:static}.ba-heading>.ba-actions>*{flex:1 1 auto}}

.ba-heading{padding:4px 0}.ba-heading p{display:none}.ba-heading h1{margin:0;font-size:25px}
.ba-reference-drop{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;min-height:0!important;padding:12px!important}
.ba-reference-drop>span{font-size:12px}.ba-references h2{font-size:17px;margin-bottom:8px}
.ba-references>p{margin:8px 0 0;font-size:12px}.ba-flow{margin:10px 0}.ba-modes{margin:10px 0}
.ba-review{position:static;box-shadow:none}.ba-brief>.ba-side-help{margin:0;font-size:12px}
@media(max-width:700px){.ba-reference-drop{display:grid;justify-content:stretch}.ba-reference-drop>button{width:100%}}

.brand-assets .ba-reference-drop{flex-direction:row;justify-content:space-between;margin:8px 0;min-height:0}
.brand-assets .ba-reference-drop [data-ba="choose-refs"]{margin-top:0}
.brand-assets .ba-references{margin:10px 0}
@media(max-width:700px){.brand-assets .ba-reference-drop{flex-direction:column;align-items:stretch}}
.brand-assets button.ba-working{cursor:progress;opacity:1;display:inline-flex;align-items:center;gap:8px}
.brand-assets button.ba-working::before{content:"";width:12px;height:12px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:ba-spin .8s linear infinite}
@keyframes ba-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.brand-assets button.ba-working::before{animation:none}}

.brand-assets .ba-describe{display:block;margin-top:12px}.brand-assets .ba-describe span{display:block;font-weight:600;margin-bottom:6px}.brand-assets .ba-describe textarea{width:100%;min-height:72px;resize:vertical;box-sizing:border-box}
.brand-assets .ba-canvas-size{align-self:center;font-weight:700;padding:0 6px;white-space:nowrap}.brand-assets .ba-expand input[type=number]{width:84px}

/* Pixel tools share the layer canvas; AI marks remain a separate guide. */
.brand-assets .ba-toolbar [hidden]{display:none!important}.brand-assets .ba-toolbar input[type="color"]{width:36px;height:30px;padding:2px}.brand-assets .ba-toolbar input[type="range"]{max-width:110px}.brand-assets .ba-toolbar button[aria-pressed="true"]{outline:2px solid var(--accent,#38bdf8);outline-offset:1px}.brand-assets .ba-stage canvas{touch-action:none}

/* Keep all edit descriptions and drawing controls beside the canvas. */
.ba-edit-panel .ba-describe{margin:14px 0 0}.ba-edit-panel .ba-describe textarea{min-height:100px}.ba-edit-panel .ba-describe small{display:block;margin-top:6px;font-size:12px;line-height:1.5}.ba-edit-review{margin-top:12px}.ba-edit-review .primary{width:100%}.ba-brush-tools{border-top:1px solid var(--ba-border);margin-top:18px;padding-top:2px}.ba-brush-tools .ba-actions{gap:8px}.ba-brush-tools label{display:flex;align-items:center;gap:8px;margin:4px 0;flex:1 1 100%}.ba-brush-tools input[type=range]{flex:1;min-width:0}.ba-brush-tools input[type=color]{width:36px!important;height:30px;padding:2px!important}.ba-brush-tools .ba-active-brush{padding:4px 0}.ba-screen-editor .ba-layout{grid-template-columns:minmax(0,1fr) minmax(320px,360px)}
@media(max-width:900px){.ba-screen-editor .ba-layout{grid-template-columns:minmax(0,1fr)}}

/* Compact expandable controls keep the canvas close to the toolbar. */
.ba-tool-groups{display:flex;flex-wrap:wrap;gap:8px;flex-basis:100%;align-items:flex-start}.ba-tool-groups details{flex:1 1 220px;min-width:0;border:1px solid var(--ba-border);border-radius:8px;background:var(--ba-panel)}.ba-tool-groups summary{cursor:pointer;padding:10px 12px;font-size:13px;font-weight:700;line-height:1.4}.ba-tool-groups summary:focus-visible{outline:3px solid #38bdf8;outline-offset:2px}.ba-tool-groups details[open] summary{border-bottom:1px solid var(--ba-border)}.ba-tool-content{padding:12px}.ba-tool-content .ba-tool-subtitle{margin:12px 0 4px;font-size:13px;font-weight:700}.ba-toolbar .ba-tool-content label:not(.ba-check){display:grid;margin:8px 0}.ba-tool-content .ba-brush-tools{border:0;margin:0;padding:0}.ba-tool-content .ba-brush-tools label{flex:1 1 130px}.ba-tool-content .ba-brush-tools input[type=range]{width:100%}.ba-tool-content .ba-image-actions{margin:10px 0}.ba-tool-content .ba-side-help{margin:0}
