#visual-carousel[hidden]{display:none!important}
#templates.has-visual-carousel>#journey-shell,#templates.has-visual-carousel>#cv-start-new{display:none!important}
#visual-carousel{display:grid;height:calc(100dvh - 168px);min-height:400px;padding:0;color:var(--ui-text,#fff)}
#visual-carousel *{box-sizing:border-box}
#visual-carousel .cv-action,.cv-upload{border:1px solid var(--ui-border,#333);background:var(--ui-raised,#242424);border-radius:12px;padding:8px 12px;font-size:13px;min-height:36px;cursor:pointer;text-align:center}
#visual-carousel button:disabled{opacity:.4;cursor:default}
#visual-carousel .cv-action[aria-pressed=true]{border-color:var(--ui-text,#fff)}
.cv-work{align-self:stretch;justify-self:stretch;width:100%;height:100%;max-width:none;margin:0;display:flex;flex-direction:column;gap:8px;min-width:0;min-height:0;background:var(--ui-stage,var(--ui-raised,#f7f8f9));border-radius:16px;padding:8px}
.cv-toolbar{display:flex;justify-content:space-between;gap:8px}.cv-views{display:flex;gap:5px}
.cv-viewport{position:relative;display:flex;align-items:center;flex:1;overflow:auto;scrollbar-width:thin;min-height:200px;padding:12px;overscroll-behavior:contain}
#cv-canvas{display:block;flex:none;max-width:none;box-shadow:0 6px 30px #0003;touch-action:none;margin:0;outline-offset:4px}
#cv-empty{position:absolute;left:10%;right:10%;text-align:center;pointer-events:none;color:#bbb;font-size:15px}
.cv-pages{display:flex;justify-content:center;gap:5px;flex-wrap:wrap}.cv-pages button{padding:6px 10px!important}
.cv-status:empty{display:none}
.cv-status{font-size:12px;margin:0;min-height:16px;color:var(--ui-muted,#999)}
.cv-count{display:flex;align-items:center;gap:10px;margin-bottom:18px;font-size:13px}
.cv-upload{display:block;margin:10px 0;position:relative}.cv-upload input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}

.cv-layer-actions{display:flex;flex-wrap:wrap;gap:6px}#cv-new{margin-top:24px;width:100%}#cv-copy{resize:vertical}
#cv-start-new{margin:8px 20px}
@media(max-width:760px){#visual-carousel{display:flex;flex-direction:column;height:auto;gap:12px;padding:0;min-height:0}.cv-work{height:clamp(360px,70dvh,720px);flex:none}.cv-inspector{overflow:visible}.cv-toolbar .cv-action{font-size:12px}.cv-upload,#visual-carousel .cv-action{min-height:44px}}

/* Visual editor owns its three columns; legacy modules stay mounted for old drafts. */
body.site-design #templates.has-visual-carousel:not([hidden]){display:block!important;position:relative}
body.site-design #templates.has-visual-carousel>#template-design{display:none!important}
@media(min-width:761px){body.site-design #templates.has-visual-carousel{overflow:hidden}#visual-carousel{height:100%;min-height:0}.cv-viewport{min-height:0}}

#templates.has-visual-carousel:has(>#journey-shell[aria-busy=true])>#visual-carousel{display:none!important}

.cv-surface{position:relative;flex:none;margin:auto}
#visual-carousel .cv-resize{position:absolute;z-index:2;transform:translate(-50%,-50%);width:24px;height:24px;min-height:24px;padding:0;border:0;border-radius:0;background:transparent;touch-action:none}
#visual-carousel .cv-resize::after{content:"";position:absolute;inset:6px;background:#ffff61;border:1px solid #111;border-radius:2px;box-shadow:0 0 0 1px #ffff61}
#visual-carousel .cv-resize[hidden]{display:none}
#visual-carousel .cv-resize:focus-visible{outline:2px solid #ffff61;outline-offset:1px}

/* Shared studio-toolbar.css owns all three column widths and inspector fields;
   motion-library.css owns the treatment panel, cards, titles and selection. */
.cv-treatments{min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-width:thin}
.cv-treatment-list .effect-media{display:flex;align-items:center;background:#141414}
.cv-treatment-list svg{display:block;width:100%;height:100%}
body.site-design #visual-carousel>.cv-inspector{position:relative;top:auto;align-self:stretch;max-height:100%;min-height:0}
#visual-carousel .cv-inspector .editor{border-top:1px solid var(--ui-border)}
#visual-carousel .cv-inspector .editor h3{font-size:13px;font-weight:400;margin:20px 0 10px}


@media(min-width:761px){#visual-carousel{grid-template-rows:minmax(0,1fr)}#visual-carousel>.cv-work{grid-column:2;grid-row:1;overflow:hidden}}

.cv-typing-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
html body.site-design .cv-typing-overlay textarea.motion-text-input{white-space:pre-wrap;overflow-wrap:normal;line-height:1.15}
#visual-carousel .cv-resize[data-text=true]::after{background:#2389ff;box-shadow:0 0 0 1px #2389ff;border-color:#fff}