.composer-layout{grid-template-columns:340px minmax(0,1fr);height:calc(100vh - 65px)}.composer-layout aside{overflow:auto}.composer-workspace{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;overflow:auto;background:#07090b;border:1px solid #252b32;border-radius:10px;padding:14px}.canvas-shell{width:100%;display:flex;justify-content:center;align-items:flex-start;overflow:auto}.composertext{height:170px}.upload{display:block;border:1px dashed #47515d;padding:12px;border-radius:7px;text-align:center;cursor:pointer}.upload input{display:block;width:100%;margin-top:8px}.wide{width:100%;margin-top:10px}#canvas{position:relative;width:960px;height:540px;flex:0 0 auto;background:#15191e;overflow:hidden;transform-origin:top center}#bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:none;user-select:none;pointer-events:none}#empty{position:absolute;inset:0;display:grid;place-items:center;color:#65707c;font-size:18px}.chat-overlay{position:absolute;left:35px;top:35px;width:700px;padding:0;cursor:move;user-select:none;z-index:2}.chat-overlay .chat{font-family:Arial,sans-serif;font-weight:700;line-height:1.27;white-space:pre-wrap;overflow-wrap:anywhere;text-shadow:-1px -1px 0 #000,1px -1px 0 #000,-1px 1px 0 #000,1px 1px 0 #000}.composer-workspace #canvasinfo{margin-top:8px}@media(max-width:900px){.composer-layout{grid-template-columns:1fr;height:auto}#canvas{transform:none!important}}
.composer-workspace{overflow:hidden}
.canvas-shell{flex:1;min-height:0;overflow:hidden;align-items:center}
#canvas{transform-origin:center center}

#chatLayers{position:absolute;inset:0;pointer-events:none}
.chat-overlay{pointer-events:auto;cursor:move;user-select:none}
.chat-overlay.selected{outline:1px dashed rgba(255,255,255,.55);outline-offset:4px}
.segment-toolbar{display:flex;gap:6px;margin-bottom:8px}
.segment-list{display:flex;flex-direction:column;gap:5px;max-height:150px;overflow:auto;margin-bottom:9px}
.segment-item{display:flex;align-items:center;gap:7px;width:100%;text-align:left;padding:7px 8px;border:1px solid #303841;background:#151a20;color:#d9dfe6;border-radius:5px;cursor:pointer}
.segment-item.active{border-color:#8c98a5;background:#242b33}
.segment-item .seg-title{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.segment-item .seg-meta{font-size:10px;color:#8e98a3}

.wip-banner{margin:0;padding:9px 14px;background:#332b12;border-bottom:1px solid #725d1c;color:#eadca7;font-size:12px;line-height:1.45}
.wip-banner strong{color:#ffd86a}.wip-banner a{color:#ffe39a;text-decoration:underline;font-weight:700}
/* v1.9 UX PREVIEW: make the canvas the focus */
.composer-layout{grid-template-columns:330px minmax(0,1fr);max-width:1800px;margin:0 auto;gap:18px;padding:18px}.composer-layout aside{max-height:calc(100vh - 125px);overflow:auto;padding-right:4px}.composer-layout aside section{margin-bottom:10px}.composer-workspace{min-height:calc(100vh - 150px);display:flex;flex-direction:column;justify-content:center}.canvas-shell{flex:1;min-height:620px;display:flex;align-items:center;justify-content:center}.segment-list{max-height:180px;overflow:auto}.composertext{height:150px}.wide{font-size:14px;padding:11px}@media(max-width:950px){.composer-layout{grid-template-columns:1fr}.composer-layout aside{max-height:none}.canvas-shell{min-height:420px}}

.image-loader{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.image-loader #selectedfile{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.image-loader button:disabled{opacity:.45;cursor:not-allowed}