/* Compact creator UI; scope is this video page, not the other tools. */
body[data-composer-ui]{--cc-bg:#fff;--cc-soft:#f5f6f8;--cc-line:#dfe4ea;--cc-ink:#252a31;--cc-muted:#606a76}
html[data-wwx-appearance=dark] body[data-composer-ui]{--cc-bg:#252930;--cc-soft:#30363e;--cc-line:#414954;--cc-ink:#e8ebef;--cc-muted:#b5beca}
body[data-composer-ui] .studio-header{display:flex!important;align-items:center;gap:12px;height:56px!important;min-height:56px!important;padding:6px 18px!important}
body[data-composer-ui] .studio-header .brand{flex:1;min-width:0}
.composer-site-tools{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-left:auto;min-width:0;flex:none}
.composer-site-tools>.wwx-experience-controls{order:0!important}.composer-site-tools>.sidebar-account{order:1!important}.composer-site-tools>[data-site-home]{order:2!important}
body[data-composer-ui] .composer-site-tools .wwx-experience-controls{position:static!important;inset:auto!important;display:flex!important;gap:5px;margin:0!important;transform:none!important;flex:none}
body[data-composer-ui] .composer-site-tools .sidebar-account{display:flex!important;align-items:center;gap:7px;margin:0!important;padding:0!important;flex:none}
body[data-composer-ui] .composer-site-tools :is(.sidebar-balance,.avatar-button,.studio-site-home,.wwx-find-button,.wwx-theme-toggle){position:static!important;display:inline-flex!important;align-items:center;justify-content:center;gap:5px;width:auto!important;min-width:0!important;height:36px!important;min-height:36px!important;padding:6px 10px!important;border:1px solid var(--cc-line)!important;border-radius:8px!important;font-size:12px!important;line-height:1.3!important;text-decoration:none;background:var(--cc-bg);color:var(--cc-muted);white-space:nowrap}
body[data-composer-ui] .composer-site-tools .sidebar-balance{flex-direction:row!important;max-width:132px;overflow:hidden}
body[data-composer-ui] .composer-site-tools .sidebar-balance :is(strong,small){font-size:12px!important;font-weight:400!important}
body[data-composer-ui] .composer-site-tools .avatar-button{min-width:36px!important;border-radius:20px!important;background:var(--cc-ink)!important;color:var(--cc-bg)!important;border-color:var(--cc-ink)!important}
body[data-composer-ui] .composer-site-tools .wwx-theme-toggle{width:32px!important;padding:5px!important}
body[data-composer-ui] .composer-site-tools kbd{display:none!important}
body[data-composer-ui] .studio-shell{padding-top:56px!important}
body[data-composer-ui] .studio-sidebar{top:56px!important}
body[data-composer-ui] .chat-welcome{min-height:0!important;align-items:flex-start!important;text-align:left!important;justify-content:flex-start!important}
body[data-composer-ui] .chat-welcome-icon{display:none!important}
body[data-composer-ui] .chat-welcome h2{font-size:15px!important;margin:0 0 5px!important}
body[data-composer-ui] .chat-welcome>p{display:block!important;font-size:12px!important;line-height:1.65;margin:0 0 10px!important}
body[data-composer-ui] .chat-welcome>p br{display:none}
.composer-inspiration{width:100%}.composer-inspiration>summary{font-size:12px;min-height:32px;color:var(--cc-muted);cursor:pointer}.composer-inspiration[open]>summary{display:none}.composer-has-writing .composer-inspiration[open]>summary{display:list-item}
body[data-composer-ui] .prompt-suggestions{display:flex!important;flex-wrap:wrap;gap:5px!important;max-width:none!important;padding:0!important;width:100%}
body[data-composer-ui] .prompt-suggestions button{width:auto;min-width:0;min-height:32px!important;padding:5px 8px!important;font-size:11px!important;border-radius:7px!important;background:var(--cc-bg)!important}

/* The approved card keeps the native controls; only its editing area scrolls. */
body[data-composer-ui] .material-composer{box-sizing:border-box;display:flex!important;flex-direction:column;gap:0;padding:12px!important;border:1px solid var(--cc-line)!important;border-radius:14px!important;background:var(--cc-bg)!important;min-width:0;min-height:0!important;max-height:none!important;height:auto!important;flex:0 1 auto!important;overflow:visible}
.composer-content{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:'head' 'slots' 'note' 'reference' 'status' 'product' 'writing-head' 'writing' 'copy' 'fee';min-width:0;min-height:0;flex:1 1 auto;overflow:visible}
.composer-content>*{min-width:0;grid-column:1}
.composer-material-heading{grid-area:head;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:6px;min-height:28px;margin-bottom:4px}
.composer-material-heading h3{font-size:13px;line-height:20px;font-weight:650;margin:0;color:var(--cc-ink);white-space:nowrap}
#composer-material-count{font-size:12px;line-height:20px;color:var(--cc-muted);white-space:nowrap;text-align:center}
body[data-composer-ui] .composer-material-heading button{min-height:28px;padding:2px 0;border:0;background:transparent;color:var(--cc-muted);font:inherit;font-size:12px;white-space:nowrap;cursor:pointer}
body[data-composer-ui] .composer-material-heading .attachment-help{display:grid;place-items:center;margin:0!important;width:24px;min-width:24px;padding:2px!important}
body[data-composer-ui] .composer-material-heading .attachment-help .ui-icon{width:18px;height:18px}
body[data-composer-ui] :is(.attachment-toolbar,.chat-attachments){grid-area:slots;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));align-items:start;gap:5px!important}
body[data-composer-ui] .attachment-toolbar{position:relative}
body[data-composer-ui] .attachment-toolbar>button{position:relative;display:flex!important;flex-direction:column!important;justify-content:flex-start;align-items:center!important;gap:4px!important;width:100%!important;max-width:none!important;flex:none!important;min-height:72px!important;padding:0!important;border:0!important;border-radius:8px;background:transparent!important}
body[data-composer-ui] .attachment-toolbar>button:before{display:none!important}
body[data-composer-ui] .attachment-toolbar .attachment-tile{position:relative;display:flex!important;align-items:center;justify-content:center;flex:0 0 48px;width:48px!important;height:48px!important;border:1px solid var(--cc-line)!important;border-radius:9px!important;background:var(--cc-soft)!important}
body[data-composer-ui] .attachment-symbol,body[data-composer-ui] .attachment-tile .ui-icon{width:28px;height:28px}
body[data-composer-ui] .reference-video-glyph{font-size:24px}
body[data-composer-ui] .attachment-toolbar .upload-badge{display:block;width:20px;height:20px;right:-3px;bottom:-3px;z-index:2}
body[data-composer-ui] .upload-badge circle{fill:var(--cc-bg);stroke:var(--cc-line);stroke-width:1.2}
body[data-composer-ui] .upload-badge path{stroke:var(--cc-muted);stroke-width:1.5}
body[data-composer-ui] .attachment-toolbar .attachment-label{width:100%!important;font-size:12px!important;line-height:20px!important;text-align:center!important;white-space:nowrap}
body[data-composer-ui] .attachment-toolbar>button.has-files .attachment-tile{visibility:hidden}
body[data-composer-ui] .chat-attachments{position:relative!important;inset:auto!important;height:48px!important;max-height:none!important;margin:0!important;padding:0!important;pointer-events:none;overflow:visible!important;z-index:3}
body[data-composer-ui] .material-stack[data-role]{position:relative!important;left:auto!important;grid-row:1;width:100%!important;max-width:none!important;min-width:0!important;height:48px!important;pointer-events:auto}
body[data-composer-ui] .material-stack[data-role=person]{grid-column:1}body[data-composer-ui] .material-stack[data-role=product]{grid-column:2}body[data-composer-ui] .material-stack[data-role=audio]{grid-column:3}body[data-composer-ui] .material-stack[data-role=reference-video]{grid-column:4}
body[data-composer-ui] .material-stack .composer-stack-preview{position:absolute;left:calc(50% - 24px);top:0;display:grid;place-items:center;width:48px;height:48px;min-width:48px;min-height:48px;padding:0;border:1px solid var(--cc-line);border-radius:9px;background:var(--cc-soft);color:var(--cc-muted);font-size:20px;cursor:pointer}
.composer-stack-preview img{display:block;width:100%;height:100%;border-radius:8px;object-fit:cover}
body[data-composer-ui] .material-stack .stack-toggle,.composer-slot-count{display:block!important;position:absolute;top:-3px;left:calc(50% - 27px);right:auto;z-index:4;margin:0;padding:0;width:18px;height:18px;min-width:18px;min-height:18px;border:1px solid var(--cc-bg);border-radius:50%;background:var(--cc-ink);color:var(--cc-bg);font-size:10px;line-height:16px;text-align:center;cursor:pointer}
.composer-slot-count{pointer-events:none}
body[data-composer-ui] .material-stack .stack-toggle::before{content:"";position:absolute;inset:-7px}
body[data-composer-ui] .material-stack .composer-slot-add::before{content:"";position:absolute;inset:-6px}
body[data-composer-ui] .material-stack .composer-slot-add{display:block;position:absolute;left:calc(50% + 9px);top:30px;width:20px;height:20px;min-width:20px;min-height:20px;padding:0;border:1px solid var(--cc-line);border-radius:50%;background:var(--cc-bg);color:var(--cc-muted);font:inherit;font-size:16px;line-height:18px;z-index:8;cursor:pointer}
.composer-material-note{grid-area:note;display:flex;align-items:center;justify-content:flex-end;min-height:24px;margin:2px 0 4px;color:var(--cc-muted);font-size:12px;line-height:20px}
.composer-reference-entry{grid-area:reference;min-height:32px;text-align:left;font:inherit;font-size:12px;color:var(--cc-muted);padding:4px 0;border:0;background:transparent;cursor:pointer}
.composer-visible-status{grid-area:status;display:flex;align-items:flex-start;gap:8px;padding:8px 9px;margin:4px 0 8px;background:var(--cc-soft);border:1px solid var(--cc-line);border-radius:7px;color:var(--cc-muted);font-size:12px;line-height:1.6}
.composer-visible-status>span{flex:1;min-width:0;overflow-wrap:anywhere}.composer-visible-status button{flex:none;border:0;background:transparent;color:inherit;text-decoration:underline;font:inherit;padding:0;min-height:30px;cursor:pointer}
body[data-composer-ui] #product-info-trigger{grid-area:product;display:flex;align-items:center;justify-content:space-between;width:100%;max-width:100%;min-height:28px!important;margin:0 0 4px!important;padding:3px 0!important;border:0;border-top:1px solid var(--cc-line);border-bottom:1px solid var(--cc-line);border-radius:0;background:transparent;font-size:12px!important;color:var(--cc-muted)}
.composer-writing-heading{grid-area:writing-head;display:flex;align-items:center;gap:6px;min-height:24px;margin-bottom:2px;font-size:13px;color:var(--cc-ink)}
.composer-writing-heading label{font-weight:650}.composer-writing-heading output{font-size:12px;color:var(--cc-muted);margin-left:auto;white-space:nowrap}.composer-draft-status{font-size:12px;color:var(--cc-muted);white-space:nowrap}
.composer-expand-input{flex:none;min-height:24px;padding:2px 0 2px 4px;border:0;background:transparent;color:var(--cc-muted);font:inherit;font-size:12px;cursor:pointer}
body[data-composer-ui] .chat-prompt{grid-area:writing;margin:0!important}
body[data-composer-ui] #product-facts{display:block;box-sizing:border-box;width:100%;font-size:16px!important;line-height:1.6!important;min-height:96px!important;height:96px;max-height:300px!important;padding:0 0 6px!important;margin:0;resize:vertical;border:0!important;background:transparent!important;color:var(--cc-ink)!important}
body[data-composer-ui] .material-composer.composer-input-expanded #product-facts{height:192px}
.composer-cost-copy{grid-area:fee;min-width:0;margin-top:4px}
.composer-copy-entry{grid-area:copy;min-height:32px;border:0;background:transparent;text-align:left;font:inherit;font-size:12px;color:var(--cc-muted);cursor:pointer;padding:4px 0}
body[data-composer-ui] .composer-options{display:grid!important;grid-template-columns:minmax(0,1fr) 40px!important;grid-template-rows:minmax(24px,auto) minmax(24px,auto)!important;gap:0 10px!important;align-items:center;flex:0 0 auto;min-width:0;margin-top:4px!important;padding-top:6px;border-top:1px solid var(--cc-line);background:var(--cc-bg)}
body[data-composer-ui] .composer-options #settings-trigger{grid-row:1!important;grid-column:1!important;justify-self:stretch;min-height:24px;padding:0!important;font-size:13px!important;line-height:22px;text-align:left;min-width:0}
body[data-composer-ui] .composer-options #settings-summary{white-space:normal;overflow-wrap:anywhere}
body[data-composer-ui] .composer-cost-row{display:block!important;grid-column:1;grid-row:2;min-width:0;max-width:100%;margin:0}
.composer-cost-details{font-size:12px;color:var(--cc-muted);line-height:22px;min-width:0;max-width:100%}
.composer-cost-details>summary{min-height:24px;display:list-item;list-style-position:inside;cursor:pointer}
body[data-composer-ui] .composer-cost-copy :is(#video-segment-plan,.video-cost-boundary){font-size:12px!important;line-height:1.7!important;margin:4px 0!important}
body[data-composer-ui] .composer-options .director-submit{grid-column:2!important;grid-row:1/3!important;align-self:center;display:inline-flex;align-items:center;justify-content:center;width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;padding:0!important;border-radius:50%!important;background:var(--cc-ink)!important;color:var(--cc-bg)!important;gap:0}
body[data-composer-ui] .composer-options .director-submit .director-submit-label{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
body[data-composer-ui] .composer-options .director-submit svg{width:22px;height:22px}
body[data-composer-ui] .composer-options .director-submit:disabled,body[data-composer-ui] .composer-slot-add:disabled{opacity:.45!important;cursor:not-allowed}
body[data-composer-ui] :is(#generation-cost,.composer-action-hint){display:none!important}
body[data-composer-ui] :is(.composer-expand-input,.composer-stack-preview,.stack-toggle,.composer-slot-add,.composer-cost-details>summary):focus-visible{outline:2px solid #7891ad;outline-offset:2px}

/* A clicked material group opens a wide top-layer panel. Its native cards and
   audio remain in #chat-attachments so redraw and draft cleanup still own them. */
body[data-composer-ui] .material-stack .stack-row.composer-stack-panel{display:none!important;box-sizing:border-box;position:fixed!important;inset:auto;left:8px!important;top:8px!important;margin:0!important;width:300px;max-width:calc(100vw - 16px)!important;height:auto!important;max-height:calc(100dvh - 24px);padding:10px!important;border:1px solid var(--cc-line);border-radius:12px;background:var(--cc-bg);color:var(--cc-ink);overflow:auto!important;overscroll-behavior:contain;box-shadow:0 12px 36px #11182733;pointer-events:auto}
body[data-composer-ui] .material-stack .stack-row.composer-stack-panel:popover-open{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:8px}
.composer-stack-panel::backdrop{background:transparent}
.composer-stack-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--cc-ink);font-size:13px;line-height:24px}
.composer-stack-heading>button{width:28px;height:28px;min-height:28px;border:0;border-radius:6px;background:var(--cc-soft);color:var(--cc-muted);font-size:20px;cursor:pointer}
body[data-composer-ui] .composer-stack-panel .chat-attachment{box-sizing:border-box;position:relative!important;inset:auto!important;display:grid;grid-template-columns:48px minmax(0,1fr) 28px;grid-template-rows:auto auto;align-items:center;gap:4px 8px;flex:none!important;width:100%!important;height:auto!important;min-height:76px;min-width:0!important;padding:8px;border:1px solid var(--cc-line);border-radius:8px;background:var(--cc-soft);box-shadow:none}
body[data-composer-ui] .composer-stack-panel .chat-attachment .attachment-view,body[data-composer-ui] .composer-stack-panel .chat-attachment .attachment-play{grid-column:1;grid-row:1/3;width:48px;height:48px;min-width:48px;min-height:48px;padding:0;border:0;border-radius:7px;background:var(--cc-bg);color:var(--cc-muted)}
body[data-composer-ui] .composer-stack-panel .chat-attachment .attachment-info{position:static!important;clip-path:none!important;clip:auto!important;overflow:visible!important;margin:0!important;padding:0!important;width:auto!important;height:auto!important;white-space:normal!important;grid-column:2;grid-row:1;min-width:0}
body[data-composer-ui] .composer-stack-panel .attachment-name{font-size:12px;line-height:18px;max-width:none!important;white-space:normal!important;overflow-wrap:anywhere}
body[data-composer-ui] .composer-stack-panel .attachment-info small{font-size:11px;line-height:16px;color:var(--cc-muted);overflow-wrap:anywhere}
body[data-composer-ui] .composer-stack-panel .attachment-number{display:grid!important;left:3px;top:3px;min-width:16px;height:16px;width:auto;padding:0 3px;line-height:16px;font-size:10px}
body[data-composer-ui] .composer-stack-panel .chat-attachment .attachment-remove{position:static!important;grid-column:3;grid-row:1;justify-self:end;width:28px;height:28px;min-width:28px;min-height:28px;padding:0;border:1px solid var(--cc-line);background:var(--cc-bg);color:var(--cc-muted);font-size:18px;line-height:26px;opacity:1!important;pointer-events:auto}
body[data-composer-ui] .composer-stack-panel .chat-attachment .attachment-remove[aria-disabled=true]{opacity:.45!important;cursor:wait}
body[data-composer-ui] .composer-stack-panel .material-removal-status{margin:0;padding:6px 8px;border:1px solid var(--cc-line);border-radius:6px;background:var(--cc-soft);color:var(--cc-muted);font-size:12px;line-height:1.6}
body[data-composer-ui] .composer-stack-panel .chat-attachment .attachment-mention{position:static!important;grid-column:2/4;grid-row:2;width:auto;min-width:0;min-height:28px;justify-self:start;padding:3px 7px;border:1px solid var(--cc-line);border-radius:6px;color:var(--cc-muted);background:var(--cc-bg);font-size:12px}
body[data-composer-ui] .composer-stack-panel .audio-caption{display:none}
body[data-composer-ui] .composer-stack-panel audio[hidden]{display:none!important}
body[data-composer-ui] .material-stack .composer-stack-panel .attachment-more{display:block!important;flex:none;width:100%;min-height:32px;height:32px;padding:0;border:1px solid var(--cc-line);border-radius:7px;background:var(--cc-soft);color:var(--cc-muted);font-size:22px;line-height:28px;cursor:pointer}
.composer-material-details{box-sizing:border-box;width:min(480px,calc(100vw - 28px));max-height:calc(100dvh - 28px);margin:auto;padding:16px;border:1px solid var(--cc-line);border-radius:14px;background:var(--cc-bg);color:var(--cc-ink);font-size:13px;line-height:1.6;overflow:auto;overscroll-behavior:contain;box-shadow:0 16px 60px #11182733}.composer-material-details::backdrop{background:#17212f44}.composer-material-dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}.composer-material-dialog-heading h3{font-size:16px;margin:0}.composer-material-dialog-heading button{min-width:36px;min-height:36px;padding:0;border:0;border-radius:8px;background:var(--cc-soft);color:var(--cc-muted);font-size:22px;cursor:pointer}.composer-material-details :is(.ml-draft-save,.video-material-library){width:100%;box-sizing:border-box;margin:12px 0;padding:10px;border:1px solid var(--cc-line);border-radius:9px;background:var(--cc-bg);color:var(--cc-ink)}.composer-material-details .ml-draft-save{display:flex;align-items:flex-start;flex-direction:column;gap:9px}.composer-material-details .ml-draft-save>button{font-size:13px;min-height:40px}.composer-material-details .ml-draft-save>span{font-size:12px;white-space:normal;line-height:1.7}.composer-material-details .video-material-library>summary{min-height:36px;cursor:pointer}.composer-material-details #video-channel-media-status{margin:0 0 12px;font-size:12px;color:var(--cc-muted)}.composer-material-details #reference-video-options{max-height:none;overflow:visible;margin-top:12px;padding:12px;border:1px solid var(--cc-line);background:var(--cc-bg);color:var(--cc-ink)}
body[data-composer-ui] .product-info-heading{position:sticky;top:-22px;background:var(--cc-bg);z-index:2;padding-block:8px}body[data-composer-ui] .product-info-dialog{background:var(--cc-bg)!important;color:var(--cc-ink)!important}
body[data-composer-ui] :is(.composer-material-heading button,.composer-visible-status button,.composer-reference-entry,.composer-copy-entry):focus-visible{outline:2px solid #7891ad;outline-offset:2px}
/* One workflow bar; optional layouts and destructive actions live in menus. */
body[data-composer-ui] #video-workflow{padding:8px 12px!important;margin-bottom:10px!important}
.composer-workflow-row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
body[data-composer-ui] .composer-workflow-row .video-workflow-steps{display:flex;flex-wrap:nowrap;gap:5px;min-width:0}
.composer-workflow-actions{display:flex;gap:5px;flex:none}
body[data-composer-ui] .composer-toolbar-trigger{display:inline-flex;align-items:center;justify-content:center;min-height:32px;padding:5px 10px;border:1px solid var(--cc-line);border-radius:7px;background:var(--cc-bg);color:var(--cc-muted);font:inherit;font-size:12px;white-space:nowrap;cursor:pointer}
body[data-composer-ui] #video-settings-readout{margin:5px 0 0!important;font-weight:400;color:var(--cc-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body[data-composer-ui] .workspace-layout-tools.composer-layout-handles{height:0;min-height:0;margin:0!important;padding:0;border:0}
.composer-toolbar-popup{box-sizing:border-box;position:fixed;inset:auto;margin:0;width:160px;max-width:calc(100vw - 16px);padding:5px;border:1px solid var(--cc-line);border-radius:10px;background:var(--cc-bg);color:var(--cc-ink);box-shadow:0 8px 24px #11182726}
.composer-toolbar-popup:popover-open{display:flex;flex-direction:column;gap:2px}
.composer-toolbar-popup::backdrop{background:transparent}
body[data-composer-ui] .composer-toolbar-popup>button{box-sizing:border-box;display:block;width:100%;min-height:38px;text-align:left;padding:8px 10px;border:0;border-radius:6px;background:transparent;color:inherit;font:inherit;font-size:12px;cursor:pointer}
body[data-composer-ui] .composer-toolbar-popup>button:is(:hover,[aria-pressed=true]){background:var(--cc-soft)}
body[data-composer-ui] .composer-toolbar-popup>button:disabled{opacity:.5;cursor:default}
body[data-composer-ui] .composer-toolbar-popup #clear-video-drafts{color:#b0473b}
html[data-wwx-appearance=dark] body[data-composer-ui] .composer-toolbar-popup #clear-video-drafts{color:#f0a79e}
body[data-composer-ui] :is(.composer-toolbar-trigger,.composer-toolbar-popup>button,.composer-cost-details>summary):focus-visible{outline:2px solid #7891ad;outline-offset:2px}
@media(max-width:760px){
 .composer-workflow-row{flex-wrap:wrap;gap:6px}
 body[data-composer-ui] .composer-workflow-row .video-workflow-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:4px}
 body[data-composer-ui] .composer-workflow-row .video-workflow-steps>button{padding:6px 4px!important;min-height:40px!important;font-size:12px!important;white-space:nowrap}
 .composer-workflow-actions{margin-left:auto}
 body[data-composer-ui] .composer-toolbar-trigger{min-height:36px}
 body[data-composer-ui] .composer-toolbar-popup>button{min-height:44px;font-size:13px}
}


/* Desktop panes fit the space below the workflow rather than forcing 520px. */
@media(min-width:980px){
 body.video-generation-page[data-composer-ui][data-video-step] .video-workspace-grid{height:var(--composer-workspace-height,calc(100dvh - 170px))!important;min-height:0!important;max-height:var(--composer-workspace-height,calc(100dvh - 170px))!important}
 body[data-composer-ui] .video-workspace-grid>.video-config-column{height:100%!important;min-height:0!important;overflow:hidden!important}
 body[data-composer-ui] .chat-scroll{flex:1 1 auto!important;min-height:0!important;max-height:none!important;overflow:auto;padding:8px 14px!important;overscroll-behavior:contain}
 body[data-composer-ui] .material-composer{margin-top:auto!important;min-height:0!important}
 body[data-composer-ui] .composer-content{min-height:20px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}
 body[data-composer-ui] .scene-selector{flex-shrink:0}

}
body[data-composer-ui] .chat-welcome.composer-has-writing>h2,body[data-composer-ui] .chat-welcome.composer-has-writing>p{display:none!important}
@media(max-width:979px){body[data-composer-ui] .studio-sidebar{top:auto!important}body[data-composer-ui] .chat-scroll{max-height:none!important;min-height:0!important;overflow:auto;padding:8px 14px!important}body[data-composer-ui] .video-config-column{overflow:visible!important}body[data-composer-ui] .material-composer{margin-top:0;flex:none!important}}
@media(max-width:760px){
 body[data-composer-ui] .studio-header{padding-inline:10px!important;gap:5px!important}body[data-composer-ui] .studio-header .brand{display:none!important}.composer-site-tools{gap:5px;width:100%;justify-content:flex-end}
 body[data-composer-ui] .composer-site-tools :is(.sidebar-balance,.avatar-button,.studio-site-home,.wwx-find-button,.wwx-theme-toggle){min-height:40px!important;height:40px!important;padding-inline:8px!important;font-size:12px!important}
 body[data-composer-ui] .composer-site-tools .sidebar-account{gap:5px}body[data-composer-ui] .composer-site-tools .sidebar-balance{max-width:100px}body[data-composer-ui] .composer-site-tools .wwx-theme-toggle{width:28px!important}
 body[data-composer-ui] .composer-draft-status{display:none}body[data-composer-ui] .prompt-suggestions button{min-height:36px!important}
 body[data-composer-ui] .attachment-toolbar>button{min-height:76px!important}
 body[data-composer-ui] .composer-material-heading button{min-height:32px}
 body[data-composer-ui] .composer-options{grid-template-columns:minmax(0,1fr) 44px!important}
 body[data-composer-ui] .composer-options .director-submit{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important}
 body[data-composer-ui] .composer-expand-input{min-height:32px;padding-inline:5px}
 body[data-composer-ui] .composer-material-dialog-heading button{min-width:44px;min-height:44px}
 body[data-composer-ui] .composer-stack-panel .chat-attachment .attachment-mention{min-height:36px}
 body[data-composer-ui] .composer-stack-panel .chat-attachment .attachment-remove{min-height:36px;width:30px}
 body[data-composer-ui] .material-stack .composer-slot-add::before{inset:-12px}
 body[data-composer-ui] .material-stack .stack-toggle::before{inset:-13px}
}
@media(max-width:359px){body[data-composer-ui] .composer-site-tools .wwx-find-button>span{display:none!important}body[data-composer-ui] .composer-site-tools .wwx-find-button{width:32px!important;padding:6px!important}body[data-composer-ui] .composer-site-tools .sidebar-balance{max-width:89px}}
body[data-composer-ui] [hidden]{display:none!important}
/* Keep the native hover/click image preview above an open material popover. */
body[data-composer-ui] .material-image-preview[popover]{position:fixed;inset:auto;margin:0;padding:0;border:0;background:transparent}
/* Blocking and original-request notices retain their native actions beside
   the footer, rather than disappearing with a collapsed conversation area. */
body[data-composer-ui] .composer-notices{flex:0 1 auto;min-width:0;min-height:0}
body[data-composer-ui] .composer-notices .director-status{font-size:12px;line-height:1.6}
body[data-composer-ui] .composer-notices .draft-conflict-notice{margin:4px 0;padding:8px}
body[data-composer-ui] .composer-notices .director-status:has(span:not(:empty)){padding:6px 0}
body[data-composer-ui] .composer-notices #vm-unsaved-notice{margin:4px 0;font-size:12px;line-height:1.6}
@media(min-width:980px){body[data-composer-ui] .composer-notices{max-height:35dvh;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}body[data-composer-ui] .composer-notices[data-has-message=true]{min-height:24px}}

/* Reference composition: one quiet mode guide above a horizontal composer.
   Scoped to this page version; global navigation and other tools keep their UI. */
body[data-composer-layout=reference-v1]{--cc-soft:#fafafa;--cc-line:#e4e4e7;--cc-ink:#202023;--cc-muted:#7b7b80}
html[data-wwx-appearance=dark] body[data-composer-layout=reference-v1]{--cc-soft:#2c3037;--cc-line:#454a53;--cc-ink:#f1f1f3;--cc-muted:#b7bac2}
body[data-composer-layout=reference-v1] #video-workflow{display:none!important}
body[data-composer-layout=reference-v1] .video-studio-main{padding-top:12px!important}
body[data-composer-layout=reference-v1] .video-config-column{background:var(--cc-bg)!important;border-color:var(--cc-line);border-radius:14px}
body[data-composer-layout=reference-v1] .scene-picker-card{margin:0!important;padding:12px 18px!important}
body[data-composer-layout=reference-v1] .scene-toggle h2{font-size:15px!important;line-height:22px}
body[data-composer-layout=reference-v1] .scene-toggle p{font-size:12px!important;line-height:20px}
body[data-composer-layout=reference-v1] .chat-scroll{padding:16px 22px 12px!important}
body[data-composer-layout=reference-v1] .chat-welcome{display:flex;flex-direction:column;align-items:center!important;justify-content:flex-start!important;text-align:center!important;width:100%;max-width:460px;margin:0 auto;padding:8px 0 0!important;gap:0}
body[data-composer-layout=reference-v1] .welcome-mode-image{display:block;flex:none;width:64px;height:64px;object-fit:cover;border:3px solid var(--cc-bg);border-radius:20px;box-shadow:0 0 0 1px var(--cc-line),0 8px 18px #2020230c;margin:0 0 17px}
body[data-composer-layout=reference-v1] .chat-welcome h2,body[data-composer-layout=reference-v1] .chat-welcome.composer-has-writing>h2{display:block!important;margin:0 0 7px!important;font-size:20px!important;font-weight:650;line-height:1.45;color:var(--cc-ink);letter-spacing:0}
body[data-composer-layout=reference-v1] .chat-welcome>p,body[data-composer-layout=reference-v1] .chat-welcome.composer-has-writing>p{display:block!important;font-size:14px!important;line-height:22px;margin:0!important;color:var(--cc-muted)}
body[data-composer-layout=reference-v1] .welcome-change-mode{display:inline-flex;align-items:center;justify-content:center;flex:none;min-height:30px;margin:12px 0 0;padding:4px 14px;border:1px solid var(--cc-line);border-radius:20px;background:var(--cc-bg);color:var(--cc-muted);font:inherit;font-size:13px;line-height:20px;cursor:pointer}
body[data-composer-layout=reference-v1] .welcome-steps{width:100%;max-width:360px;list-style:none;padding:0;margin:26px auto 0;text-align:left;display:flex;flex-direction:column;gap:18px}
.welcome-steps li{position:relative;display:flex;align-items:flex-start;gap:13px;min-height:42px;margin:0;padding:0}
.welcome-steps li:not(:last-child)::after{content:"";position:absolute;top:25px;bottom:-18px;left:11px;width:1px;background:var(--cc-line)}
.welcome-step-number{position:relative;z-index:1;display:grid;place-items:center;flex:0 0 24px;width:24px;height:24px;border:1px solid var(--cc-line);border-radius:50%;background:var(--cc-bg);color:var(--cc-muted);font-size:14px;font-weight:600;line-height:1}
.welcome-steps li:first-child .welcome-step-number{border-color:var(--cc-ink);background:var(--cc-ink);color:var(--cc-bg)}
.welcome-steps li>div{min-width:0;display:grid;gap:3px;padding-top:1px}
.welcome-steps strong{font-size:14px;line-height:21px;font-weight:600;color:var(--cc-ink)}
.welcome-steps small{font-size:13px;line-height:20px;color:var(--cc-muted);overflow-wrap:anywhere}
body[data-composer-layout=reference-v1] .welcome-examples{width:100%;margin:28px 0 0;text-align:left}
body[data-composer-layout=reference-v1] .welcome-example-caption{margin:0 0 8px!important;font-size:13px!important;line-height:20px!important;font-weight:500;color:var(--cc-muted)}
body[data-composer-layout=reference-v1] .prompt-suggestions{display:flex!important;flex-direction:column;gap:7px!important;flex-wrap:nowrap;width:100%;padding:0!important}
body[data-composer-layout=reference-v1] .prompt-suggestions button{display:flex;align-items:center;gap:10px;width:100%;min-height:38px!important;padding:8px 12px!important;border:1px solid var(--cc-line);border-radius:10px!important;background:var(--cc-bg)!important;color:var(--cc-ink);text-align:left;font:inherit;font-size:14px!important;font-weight:400;line-height:21px;white-space:normal;overflow-wrap:anywhere;box-shadow:none}
body[data-composer-layout=reference-v1] .prompt-suggestions button::before{content:'→';flex:none;color:var(--cc-muted);font-size:16px;line-height:20px}
body[data-composer-layout=reference-v1] :is(.welcome-change-mode,.prompt-suggestions button):hover{background:var(--cc-soft)!important;border-color:var(--cc-muted)}
body[data-composer-layout=reference-v1] :is(.welcome-change-mode,.prompt-suggestions button,.settings-trigger):focus-visible{outline:2px solid #7891ad;outline-offset:3px}

body[data-composer-layout=reference-v1] .material-composer{position:relative;container:video-composer / inline-size;margin:8px 18px 16px!important;padding:12px!important;border-radius:14px!important;flex:0 0 auto!important;max-height:62dvh!important}
body[data-composer-layout=reference-v1] .composer-content{position:relative;grid-template-areas:'slots' 'media' 'writing' 'meta' 'product' 'note' 'reference' 'copy' 'fee';overflow:auto;flex:1 1 auto;min-height:0}
body[data-composer-layout=reference-v1] .composer-material-heading{display:none}
body[data-composer-layout=reference-v1] .attachment-toolbar{grid-area:slots;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;align-items:center;flex-wrap:nowrap;gap:clamp(2px,1.2cqw,6px)!important;margin:0 0 10px}
body[data-composer-layout=reference-v1] .attachment-toolbar>button{display:inline-flex!important;flex-direction:row!important;justify-content:center;align-items:center!important;flex:0 1 auto!important;width:100%!important;min-width:0;min-height:30px!important;gap:clamp(2px,1.2cqw,5px)!important;padding:4px clamp(2px,1.8cqw,8px)!important;border:1px solid var(--cc-line)!important;border-radius:18px!important;background:var(--cc-bg)!important;white-space:nowrap}
body[data-composer-layout=reference-v1] .attachment-toolbar .attachment-tile{flex:0 0 14px!important;width:14px!important;height:16px!important;border:0!important;border-radius:0!important;background:transparent!important;color:var(--cc-muted);visibility:visible!important}
body[data-composer-layout=reference-v1] .attachment-toolbar :is(.attachment-symbol,.ui-icon){width:15px!important;height:15px!important}
body[data-composer-layout=reference-v1] .attachment-toolbar .reference-video-glyph{font-size:13px}
body[data-composer-layout=reference-v1] .attachment-toolbar .upload-badge{display:none}
body[data-composer-layout=reference-v1] .attachment-toolbar .attachment-label{width:auto!important;min-width:0;white-space:nowrap!important;font-size:clamp(10px,3.2cqw,13px)!important;line-height:20px!important;color:var(--cc-muted)}
body[data-composer-layout=reference-v1] .attachment-toolbar .composer-slot-count{position:static;flex:none;width:16px;min-width:16px;height:16px;line-height:14px;font-size:10px}
/* Bounded thumbnails keep tall product images out of the writing area. The
   original group, count, add and item controls keep their native handlers. */
body[data-composer-ui][data-composer-layout=reference-v1] .chat-attachments{grid-area:media;display:flex!important;gap:12px!important;height:60px!important;margin:0 0 10px!important;padding:4px 0 0!important;align-items:start;box-sizing:border-box}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack[data-role]{flex:none!important;width:52px!important;max-width:52px!important;height:56px!important;grid-column:auto;grid-row:auto}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack>.composer-stack-preview{left:0;top:0;box-sizing:border-box;display:grid;grid-template: minmax(0,1fr) / minmax(0,1fr);width:52px;height:52px;min-width:52px;min-height:52px;margin:0;padding:4px;overflow:hidden;border:1px solid var(--cc-line);border-radius:10px;background:var(--cc-soft);font-size:18px;line-height:1}
body[data-composer-ui][data-composer-layout=reference-v1] .composer-stack-preview>img{display:block;box-sizing:border-box;width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;max-width:100%!important;max-height:100%!important;object-fit:contain;object-position:center;border-radius:5px}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack>.stack-toggle{top:-4px;left:-4px;right:auto;margin:0;width:16px;height:16px;min-width:16px;min-height:16px;line-height:14px;font-size:10px;box-shadow:0 0 0 2px var(--cc-bg)}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack>.composer-slot-add{top:40px;left:40px;width:18px;height:18px;min-width:18px;min-height:18px;font-size:14px;line-height:16px;box-shadow:0 0 0 2px var(--cc-bg)}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack>:is(.composer-stack-preview,.composer-slot-add):hover{border-color:var(--cc-muted);color:var(--cc-ink)}
body[data-composer-layout=reference-v1] .chat-prompt{grid-area:writing;min-height:64px}
body[data-composer-layout=reference-v1] #product-facts{font-family:inherit;font-size:14px!important;line-height:1.75!important;min-height:64px!important;height:64px;max-height:260px!important;padding:0 0 4px!important;resize:none;box-shadow:none}
body[data-composer-layout=reference-v1] #product-facts::placeholder{color:#9aa9bd;opacity:1}
body[data-composer-layout=reference-v1] .material-composer.composer-input-expanded #product-facts{height:190px}
body[data-composer-layout=reference-v1] .composer-writing-heading{grid-area:meta;display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:3px 8px;min-height:22px;margin:0;font-size:11px;color:var(--cc-muted)}
body[data-composer-layout=reference-v1] .composer-writing-heading>label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
body[data-composer-layout=reference-v1] .composer-writing-heading output{font-size:11px;margin-left:0}
body[data-composer-layout=reference-v1] .composer-draft-status{display:none}
body[data-composer-layout=reference-v1] .composer-expand-input{font-size:11px;min-height:20px;padding:0 2px}
body[data-composer-layout=reference-v1] #product-info-trigger{width:auto;max-width:190px;min-height:22px!important;margin:0 auto 0 0!important;border:0;padding:0!important;font-size:11px!important;gap:3px}
body[data-composer-layout=reference-v1] #product-info-summary{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body[data-composer-layout=reference-v1] :is(#composer-manage-materials,.composer-copy-entry){flex:none;min-height:22px;padding:0;border:0;background:transparent;color:var(--cc-muted);font:inherit;font-size:11px;cursor:pointer}
body[data-composer-layout=reference-v1] .composer-writing-heading .attachment-help{display:grid!important;place-items:center;flex:none;min-height:22px!important;width:16px!important;margin:0!important;padding:0!important;border:0;background:transparent;color:var(--cc-muted)}
body[data-composer-layout=reference-v1] .composer-writing-heading .attachment-help .ui-icon{width:14px;height:14px}
body[data-composer-layout=reference-v1] .composer-options{grid-template-columns:minmax(0,1fr) auto 34px!important;grid-template-rows:auto!important;align-items:center;gap:6px!important;min-height:34px;margin-top:8px!important;padding:0;border:0}
body[data-composer-layout=reference-v1] .composer-options #settings-trigger{grid-column:1!important;grid-row:1!important;justify-self:start;display:inline-flex;align-items:center;gap:4px;max-width:100%;width:max-content;min-height:24px;padding:2px 6px!important;border:1px solid var(--cc-line);border-radius:7px;background:var(--cc-bg);color:var(--cc-muted);font-size:12px!important;line-height:18px}
body[data-composer-layout=reference-v1] #settings-summary{white-space:nowrap!important;overflow:hidden;text-overflow:ellipsis}
body[data-composer-layout=reference-v1] .settings-control-icon{flex:none;width:14px;height:14px}
body[data-composer-layout=reference-v1] .composer-cost-row{grid-column:2!important;grid-row:1!important;max-width:150px;justify-self:end}
body[data-composer-layout=reference-v1] .composer-cost-details>summary{display:block;min-height:30px;list-style:none;line-height:30px;padding:0;max-width:150px}
body[data-composer-layout=reference-v1] .composer-cost-details>summary::-webkit-details-marker{display:none}
body[data-composer-layout=reference-v1] #generation-cost{display:block!important;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px!important;line-height:30px;color:var(--cc-muted)}
body[data-composer-layout=reference-v1] .composer-options .director-submit{grid-column:3!important;grid-row:1!important;width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important}
body[data-composer-layout=reference-v1] .composer-options .director-submit svg{width:19px;height:19px}
body[data-composer-layout=reference-v1] .composer-notices{max-height:24dvh}
body[data-composer-layout=reference-v1] .composer-notices .director-status[data-kind=sent]{position:absolute!important;width:1px;height:1px;min-height:0;margin:0;padding:0!important;overflow:hidden;clip-path:inset(50%)}
body[data-composer-layout=reference-v1] .composer-visible-status{align-items:center;margin:5px 0;font-size:11px;line-height:20px;padding:3px 6px}
body[data-composer-layout=reference-v1] .composer-visible-status>span{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden}
body[data-composer-layout=reference-v1] .composer-visible-status>button{min-height:20px;line-height:20px}
body[data-composer-layout=reference-v1] .composer-cost-copy{margin:4px 0 0;padding:0 2px}
body[data-composer-layout=reference-v1] :is(#vs-recovery-archive,#vs-assets-fold,#vs-manual-edit){display:none!important}
body[data-composer-layout=reference-v1] :is(#vs-status[data-quiet=true],.director-dock-status [data-kind=saved]){display:none!important}
body[data-composer-layout=reference-v1] .director-dock-status{min-height:0;margin:0;padding:0}
body[data-composer-layout=reference-v1] #generation-settings{box-sizing:border-box;width:min(344px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:18px;border:1px solid var(--cc-line);border-radius:16px;background:var(--cc-bg);color:var(--cc-ink);font-size:13px;line-height:1.5;box-shadow:0 8px 32px #2020231a;overflow:auto;overscroll-behavior:contain}
body[data-composer-layout=reference-v1] .generation-settings .settings-heading{margin:0 0 14px}
body[data-composer-layout=reference-v1] .generation-settings .settings-heading h2{font-size:16px;font-weight:600;line-height:24px}
body[data-composer-layout=reference-v1] .generation-settings :is(.settings-section-label,legend,.duration-heading){font-size:13px!important;line-height:20px;font-weight:500;color:var(--cc-ink)}
body[data-composer-layout=reference-v1] .generation-settings :is(fieldset,.duration-heading){margin:14px 0 0}
body[data-composer-layout=reference-v1] .generation-settings :is(.model-hint,.settings-price-note){font-size:11px!important;line-height:1.65!important;color:var(--cc-muted);margin:6px 0 0}
body[data-composer-layout=reference-v1] .generation-settings .language-options label>span{min-height:34px!important;padding:7px 10px!important;border-color:var(--cc-line);border-radius:8px;font-size:13px!important;line-height:20px}
body[data-composer-layout=reference-v1] .generation-settings .model-copy strong{font-size:14px}
body[data-composer-layout=reference-v1] .generation-settings .model-copy small{font-size:11px}
body[data-composer-layout=reference-v1] .generation-settings #model-picker-trigger{min-height:48px!important;padding:8px 10px!important;border-color:var(--cc-line);border-radius:10px;background:var(--cc-soft)}
body[data-composer-layout=reference-v1] .generation-settings .duration-heading output{font-size:13px}
@media(min-width:1180px){
 /* Bound the input pane at wide/zoomed-out desktop sizes. Extra space belongs
    to the script and video, with the queue remaining a compact fourth pane. */
 body.video-generation-page[data-composer-layout=reference-v1] .video-workspace-grid{--chat-width:min(clamp(260px,27vw,460px),calc(100% - var(--queue-width) - 642px));--queue-width:144px;grid-template-columns:var(--chat-width) minmax(320px,1fr) minmax(280px,1.25fr) var(--queue-width)}
 body.video-generation-page[data-composer-layout=reference-v1] .video-workspace-grid:has(.video-task-panel.is-collapsed){grid-template-columns:var(--chat-width) minmax(320px,1fr) minmax(280px,1.25fr) 64px}
 /* Restored/completed tasks can legitimately hide an empty chat history. Keep
    the same bottom input position in that state without a placeholder block. */
 body[data-composer-layout=reference-v1] .video-config-column>.material-composer{margin-top:auto!important}
}
@media(min-width:980px) and (max-height:900px){
 body[data-composer-layout=reference-v1] .chat-scroll{padding:8px 20px!important}
 body[data-composer-layout=reference-v1] .welcome-mode-image{width:44px;height:44px;border-radius:15px;margin-bottom:12px}
 body[data-composer-layout=reference-v1] .chat-welcome h2{font-size:18px!important;margin-bottom:4px!important}
 body[data-composer-layout=reference-v1] .chat-welcome>p{font-size:13px!important}
 body[data-composer-layout=reference-v1] .welcome-change-mode{margin-top:8px;min-height:28px}
 body[data-composer-layout=reference-v1] .welcome-steps{margin-top:16px;gap:10px}
 body[data-composer-layout=reference-v1] .welcome-steps li:not(:last-child)::after{bottom:-10px}
 body[data-composer-layout=reference-v1] .welcome-examples{margin-top:16px}
 body[data-composer-layout=reference-v1] .prompt-suggestions{gap:6px!important}
 body[data-composer-layout=reference-v1] .prompt-suggestions button{min-height:34px!important;padding:6px 10px!important;font-size:13px!important}
}
@media(max-width:1179px){
 body[data-composer-layout=reference-v1] .video-workspace-grid{height:auto!important;max-height:none!important}
 body[data-composer-layout=reference-v1] .video-config-column{height:auto!important;min-height:0!important;overflow:visible!important}
 body[data-composer-layout=reference-v1] .chat-scroll{max-height:none!important;flex:none!important}
 body[data-composer-layout=reference-v1] .material-composer{max-height:none!important;margin-top:12px!important}
}
@media(max-width:760px){
 body[data-composer-layout=reference-v1] .chat-scroll{padding:16px!important}
 body[data-composer-layout=reference-v1] .chat-welcome{padding:8px 0!important}
 body[data-composer-layout=reference-v1] .chat-welcome h2{font-size:19px!important}
 body[data-composer-layout=reference-v1] .welcome-mode-image{width:56px;height:56px}
 body[data-composer-layout=reference-v1] .material-composer{margin:10px 12px 14px!important}
 body[data-composer-layout=reference-v1] .attachment-toolbar{gap:5px!important}
 body[data-composer-layout=reference-v1] .attachment-toolbar>button{min-height:36px!important;padding:5px 8px!important}
 body[data-composer-layout=reference-v1] #product-facts{font-size:16px!important;min-height:100px!important;height:100px}
 body[data-composer-layout=reference-v1] .composer-options{grid-template-columns:minmax(0,1fr) auto 36px!important}
 body[data-composer-layout=reference-v1] .composer-options .director-submit{width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important}
 body[data-composer-layout=reference-v1] .composer-options #settings-trigger{font-size:11px!important;gap:3px;padding-inline:5px!important}
 body[data-composer-layout=reference-v1] .composer-cost-row,body[data-composer-layout=reference-v1] .composer-cost-details>summary,body[data-composer-layout=reference-v1] #generation-cost{max-width:96px}
 body[data-composer-layout=reference-v1] .settings-control-icon{display:none}
}
/* Native hidden state must win over the presentation rules above, including
   an empty attachment row and onboarding after the first accepted message. */
body[data-composer-ui][data-composer-layout=reference-v1] [hidden],
body[data-composer-layout=reference-v1] :is(#chat-attachments,#chat-welcome)[hidden]{display:none!important}

/* Inline image strip: every selected image is directly reachable. Keep the
   original item/remove/reference handlers; only the presentation changes. */
body[data-composer-ui][data-composer-layout=reference-v1] .chat-attachments:has(.inline-image-stack){flex-wrap:wrap!important;gap:10px!important;height:auto!important;min-height:72px;padding:6px 4px!important;align-items:flex-start;pointer-events:auto}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack.inline-image-stack,
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack.inline-image-stack>.stack-row{display:contents!important}
body[data-composer-ui][data-composer-layout=reference-v1] .material-composer:has(.inline-image-stack) :is(#add-images,#add-person-images) .composer-slot-count{display:none!important}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack.inline-image-stack .chat-attachment{box-sizing:border-box;position:relative!important;inset:auto!important;display:block!important;flex:0 0 60px!important;width:60px!important;height:90px!important;min-width:60px!important;max-width:60px!important;min-height:90px!important;margin:0!important;padding:4px!important;overflow:visible!important;border:1px solid var(--cc-line);border-radius:10px;background:var(--cc-soft);box-shadow:none}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack.inline-image-stack .attachment-view{display:block;width:100%!important;height:50px!important;min-width:0!important;min-height:0!important;margin:0;padding:0!important;border:0!important;border-radius:6px;background:transparent}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack.inline-image-stack .attachment-role{box-sizing:border-box;position:relative;display:block;width:60px;max-width:none;height:28px!important;min-height:28px!important;margin:4px -5px 0;padding:1px 15px 1px 3px!important;border:1px solid var(--cc-line)!important;border-radius:6px!important;background-color:var(--cc-bg)!important;background-position:right 2px center!important;background-size:12px!important;color:var(--cc-ink)!important;font:inherit;font-size:12px!important;line-height:24px!important;white-space:nowrap;cursor:pointer}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack.inline-image-stack .attachment-view img{display:block;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain;object-position:center;border-radius:6px}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack.inline-image-stack :is(.attachment-number,.attachment-more){display:none!important}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack.inline-image-stack .attachment-mention{box-sizing:border-box;position:absolute!important;inset:auto!important;top:-5px!important;left:-5px!important;z-index:4;display:grid!important;place-items:center;width:18px!important;height:18px!important;min-width:18px!important;min-height:18px!important;margin:0;padding:0!important;border:2px solid var(--cc-bg);border-radius:50%;background:#232323;color:#fff;font-size:10px;line-height:14px;cursor:pointer}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack.inline-image-stack .chat-attachment .attachment-remove{box-sizing:border-box;position:absolute!important;inset:auto!important;top:-5px!important;right:-5px!important;z-index:5;display:grid;place-items:center;width:20px!important;height:20px!important;min-width:20px!important;min-height:20px!important;margin:0;padding:0!important;border:2px solid var(--cc-bg);border-radius:50%;background:#232323;color:#fff;font-size:15px;line-height:16px;opacity:0!important;pointer-events:none!important;cursor:pointer}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack.inline-image-stack .chat-attachment:is(:hover,:focus-within) .attachment-remove{opacity:1!important;pointer-events:auto!important}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack.inline-image-stack .chat-attachment:is(:hover,:focus-within) .attachment-remove[aria-disabled=true]{opacity:.5!important;cursor:wait}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack.inline-image-stack :is(.attachment-view,.attachment-remove,.attachment-mention,.attachment-role):focus-visible{outline:2px solid var(--cc-muted);outline-offset:2px}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack.inline-image-stack .material-removal-status{box-sizing:border-box;flex:1 0 100%;margin:0;padding:5px 8px;border:1px solid var(--cc-line);border-radius:6px;background:var(--cc-soft);color:var(--cc-muted);font-size:12px;line-height:1.6}
body[data-composer-ui][data-composer-layout=reference-v1] .material-stack.inline-image-stack .material-removal-status[hidden],
body[data-composer-ui][data-composer-layout=reference-v1] .inline-image-stack~.inline-image-stack .material-removal-status{display:none!important}
@media(hover:none),(pointer:coarse){
 body[data-composer-ui][data-composer-layout=reference-v1] .material-stack.inline-image-stack .chat-attachment .attachment-remove{width:26px!important;height:26px!important;min-width:26px!important;min-height:26px!important;opacity:1!important;pointer-events:auto!important}
}
@container video-composer (max-width:300px){
 body[data-composer-layout=reference-v1] .attachment-toolbar .attachment-tile{display:none!important}
 body[data-composer-layout=reference-v1] .attachment-toolbar>button{padding-inline:2px!important}
}
/* Three balanced groups keep the reference's breathing room. Only gaps and
   the cover size adapt to a short window; body copy stays legible. */
body[data-composer-layout=reference-v1] .chat-welcome{justify-content:space-between!important;gap:18px;padding:8px 0 2px!important;box-sizing:border-box}
body[data-composer-layout=reference-v1] .welcome-intro{display:flex;flex-direction:column;align-items:center;flex:none;width:100%;text-align:center}
body[data-composer-layout=reference-v1] .welcome-intro .welcome-mode-image{width:56px;height:56px;margin:0 0 14px;border-radius:18px}
body[data-composer-layout=reference-v1] .welcome-intro h2{font-size:19px!important;line-height:27px;margin:0 0 6px!important}
body[data-composer-layout=reference-v1] .welcome-intro>p{font-size:14px!important;line-height:22px;color:var(--cc-muted);margin:0!important}
body[data-composer-layout=reference-v1] .welcome-change-mode{margin-top:12px;min-height:28px;padding:3px 13px}
body[data-composer-layout=reference-v1] .welcome-steps{flex:none;margin:0 auto;gap:14px;max-width:360px}
body[data-composer-layout=reference-v1] .welcome-steps li{min-height:40px;gap:13px}
body[data-composer-layout=reference-v1] .welcome-steps li:not(:last-child)::after{bottom:-14px}
body[data-composer-layout=reference-v1] .welcome-steps li>div{gap:2px;padding-top:0}
body[data-composer-layout=reference-v1] .welcome-steps strong{font-size:14px;line-height:21px}
body[data-composer-layout=reference-v1] .welcome-steps small{font-size:13px;line-height:20px}
body[data-composer-layout=reference-v1] .welcome-examples{flex:none;margin:0;width:100%}
body[data-composer-layout=reference-v1] .welcome-example-caption{font-size:13px!important;line-height:20px!important;margin:0 0 8px!important}
body[data-composer-layout=reference-v1] .prompt-suggestions{gap:7px!important}
body[data-composer-layout=reference-v1] .prompt-suggestions button{font-size:13px!important;line-height:20px;min-height:34px!important;padding:6px 10px!important}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=compact]{gap:14px}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=compact] .welcome-intro .welcome-mode-image{width:52px;height:52px;margin-bottom:12px}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=compact] .welcome-change-mode{margin-top:8px}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=compact] .welcome-steps{gap:11px}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=compact] .welcome-steps li:not(:last-child)::after{bottom:-11px}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=compact] .welcome-steps strong{font-size:13px;line-height:20px}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=compact] .welcome-steps small{font-size:12px;line-height:19px}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=compact] .prompt-suggestions{gap:6px!important}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=compact] .prompt-suggestions button{font-size:13px!important;line-height:19px;min-height:32px!important;padding:5px 10px!important}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=tight]{gap:12px;padding-top:4px!important}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=tight] .welcome-intro .welcome-mode-image{width:56px;height:56px;margin-bottom:10px}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=tight] .welcome-intro h2{font-size:18px!important;line-height:25px;margin-bottom:4px!important}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=tight] .welcome-intro>p{font-size:13px!important;line-height:21px}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=tight] .welcome-change-mode{margin-top:7px;min-height:26px;padding:2px 12px}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=tight] .welcome-steps{gap:9px}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=tight] .welcome-steps li:not(:last-child)::after{bottom:-9px}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=tight] .welcome-steps strong{font-size:13px;line-height:20px}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=tight] .welcome-steps small{font-size:12px;line-height:18px}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=tight] .welcome-example-caption{font-size:12px!important;line-height:19px!important;margin-bottom:6px!important}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=tight] .prompt-suggestions{gap:5px!important}
body[data-composer-layout=reference-v1] .chat-welcome[data-density=tight] .prompt-suggestions button{font-size:13px!important;line-height:20px;min-height:32px!important;padding:5px 10px!important}
/* Keep secondary actions beside their heading and retain readable compact navigation. */
body[data-composer-layout=reference-v1] .task-panel-header{display:flex;align-items:center;gap:2px;min-width:0}
body[data-composer-layout=reference-v1] .task-panel-header .task-panel-heading{flex:1;min-width:0;width:auto;gap:2px}
body[data-composer-layout=reference-v1] .task-panel-header .queue-heading-label{gap:2px;min-width:0}
body[data-composer-layout=reference-v1] .task-panel-header .queue-heading-label strong{font-size:13px;white-space:nowrap}
body[data-composer-layout=reference-v1] .task-panel-header .queue-heading-label>span{max-width:18px;font-size:10px;padding:2px 3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body[data-composer-layout=reference-v1] .task-panel-header .queue-chevron{width:10px;height:10px;flex:none}
body[data-composer-layout=reference-v1] .video-batch-download-mini{flex:none;min-width:32px;min-height:24px;margin:0;padding:2px 4px;border:1px solid var(--cc-line);border-radius:6px;background:var(--cc-bg);color:var(--cc-muted);font:inherit;font-size:11px;line-height:18px;white-space:nowrap;cursor:pointer}
body[data-composer-layout=reference-v1] .video-batch-download-mini:focus-visible{outline:2px solid #7891ad;outline-offset:2px}
body[data-composer-layout=reference-v1] .video-task-panel.is-collapsed .video-batch-download-mini{display:none}
body[data-composer-layout=reference-v1] [data-shared-workspace-nav] .ws-nav-short-label{display:none}
@media(min-width:980px){
 body[data-composer-layout=reference-v1].workspace-nav-collapsed [data-shared-workspace-nav]{width:72px;min-width:72px;max-width:72px;overflow-x:hidden;gap:10px}
 body[data-composer-layout=reference-v1].workspace-nav-collapsed [data-shared-workspace-nav] :is(a,summary,[data-sidebar-toggle]){display:flex;flex-direction:column!important;align-items:center!important;justify-content:center;gap:3px!important;min-height:48px!important;padding:7px 0!important}
 body[data-composer-layout=reference-v1].workspace-nav-collapsed [data-shared-workspace-nav] :is(a,summary,[data-sidebar-toggle])>.ws-nav-short-label{display:block!important;flex:none;width:100%;max-width:52px;padding:0;background:transparent;color:inherit;font-size:10px;line-height:14px;font-weight:400;letter-spacing:0;white-space:nowrap;text-align:center}
 body[data-composer-layout=reference-v1].workspace-nav-collapsed [data-shared-workspace-nav] :is(a,summary,[data-sidebar-toggle]) svg{width:18px;height:18px;flex:none}
}
