/* Shared safe Markdown presentation: live bubbles and restored/result documents. */
.cs-markdown { white-space: normal; overflow-wrap: anywhere; min-width: 0; }
.cs-markdown p { margin: .65em 0; }
.cs-markdown > :first-child { margin-top: 0; }
.cs-markdown > :last-child { margin-bottom: 0; }
.cs-markdown ul, .cs-markdown ol { padding-left: 1.4em; }
.cs-markdown pre { max-width: 100%; overflow-x: auto; white-space: pre; background: var(--surface); border: 1px solid var(--border); border-radius: 8px; padding: 12px; }
.cs-markdown code { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 13px; }
.cs-markdown pre code { padding: 0; background: transparent; }
.cs-markdown blockquote { margin: .7em 0; padding-left: 12px; border-left: 3px solid var(--border); }
.cs-table-scroll { max-width: 100%; overflow-x: auto; margin: 12px 0; }
.cs-markdown table { border-collapse: collapse; width: 100%; text-align: left; }
.cs-markdown th, .cs-markdown td { border: 1px solid var(--border); padding: 7px 10px; min-width: 70px; }
.cs-markdown th { background: var(--surface); font-weight: 700; }
.cs-msg { flex-shrink: 0; min-width: 0; }
.cs-msg-ai .cs-bubble { min-width: 0; flex: 1; }
.cs-ai-avatar { flex-shrink: 0; }
.cs-chat-answer { margin-top: 10px; }
.cs-history-more { align-self: center; flex-shrink: 0; }
.studio .opt-menu { position: fixed; min-width: 0; z-index: 100; }
.prompt-box{position:relative}.prompt-drop-hint{position:absolute;inset:6px;z-index:20;display:none;place-content:center;justify-items:center;gap:5px;border:2px dashed var(--primary);border-radius:14px;background:color-mix(in srgb,var(--surface) 94%,var(--primary));color:var(--text);text-align:center;pointer-events:none}.prompt-drop-hint i{font-size:24px;color:var(--primary)}.prompt-drop-hint span,.prompt-file-help{font-size:11px;color:var(--text-muted)}.prompt-box.is-dragover .prompt-drop-hint{display:grid}.prompt-box.is-dragover{box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 22%,transparent)}.prompt-file-help{align-self:center;white-space:nowrap}
@media (max-width: 600px) {
  .cs-doc { padding: 20px 16px; }
}
/* Numbered, scrollable references never push the prompt off-screen on phones. */
.image-references { max-height:190px; overflow:auto; padding:8px 8px 0; }
.image-ref-summary { font-size:12px; color:var(--text-muted); margin:0 0 6px; }
.image-ref-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(76px,1fr)); gap:8px; }
.image-ref-cell { position:relative; min-width:0; }
.image-ref-cell img { width:100%; height:64px; object-fit:contain; border-radius:8px; background:#f3f4f6; }
.image-ref-cell span { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:11px; }
.image-ref-cell button { position:absolute; top:0; right:0; width:28px; height:28px; border:1px solid #bbb; border-radius:50%; background:white; color:#222; font-size:20px; cursor:pointer; }
.image-ref-cell button:disabled { opacity:.4; cursor:wait; }
.image-privacy-note { display:none; }
.studio[data-type="image"] .cs-dock:after { content:"참조는 비공개 7일 보관 · 생성 시 선택 API에 전송 · 원본 10MB 이하(큰 파일 자동 압축)"; display:block; padding:5px 10px; font-size:11px; color:var(--text-muted); }
.studio[data-type="video"] .cs-dock:after { content:"첨부는 비공개 7일 보관 · 생성 시 FAL API에 전송"; display:block; padding:5px 10px; font-size:11px; color:var(--text-muted); }
.video-model-note { margin:0; padding:4px 10px 7px; color:var(--text-muted); font-size:11px; line-height:1.5; max-height:64px; overflow-y:auto; overflow-wrap:anywhere; }
.image-reuse { margin:8px 0; }
.chat-memory { padding:8px 4px; font-size:12px; color:var(--text-muted); }
.chat-memory-head,.chat-memory-controls { display:flex; flex-wrap:wrap; gap:6px; align-items:center; justify-content:space-between; }
.chat-memory-head>span { flex:1; min-width:120px; }
.chat-memory details { margin:6px 0; }
.chat-memory summary { cursor:pointer; }
.chat-memory #chat-memory-summary { max-height:160px; overflow:auto; white-space:pre-wrap; }
.chat-memory select { max-width:185px; min-height:32px; border:1px solid var(--border); border-radius:6px; background:var(--surface); color:var(--text); }
.studio .opt-pill-wrap[hidden],.studio .chat-memory label[hidden]{display:none!important}
#image-model-note.is-invalid{color:var(--red)}
.chat-memory small { display:block; margin-top:6px; line-height:1.4; }
.chat-memory-images { display:flex; gap:6px; overflow:auto; max-height:95px; }
.chat-memory-images[hidden] { display:none; }
.chat-memory-image { flex:0 0 70px; padding:3px; background:var(--surface); border:1px solid var(--border); border-radius:6px; cursor:pointer; }
.chat-memory-image img { display:block; width:64px; height:55px; object-fit:contain; }
.chat-image-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; margin-top:10px; }
/* Reserve preview space before private/lazy images load, keeping the current reply in view. */
.chat-image-grid img { display:block; width:100%; aspect-ratio:1 / 1; max-height:420px; object-fit:contain; border-radius:8px; }
.chat-image-grid a { margin-left:8px; font-size:12px; }
@media(min-width:641px) and (max-width:900px) {
  .code-studio[data-type="text"] { display:block; overflow-y:auto; }
  .studio[data-type="text"] .cs-left { height:auto; min-height:0; }
  .studio[data-type="text"] .cs-conversation { flex:none; max-height:50vh; min-height:160px; padding:12px; }
  .studio[data-type="text"] .cs-right { height:55vh; min-height:320px; }
  .studio[data-type="text"] .image-references { max-height:140px; }
}
@media (min-width:641px) and (max-width:900px) {
  .code-studio[data-type="image"] { display:block; overflow-y:auto; }
  .studio[data-type="image"] .cs-left { height:auto; min-height:0; }
  .studio[data-type="image"] .cs-left-head { flex-wrap:wrap; padding:12px; }
  .studio[data-type="image"] .cs-left-title { white-space:nowrap; }
  .studio[data-type="image"] .cs-conversation { flex:none; max-height:220px; min-height:100px; padding:12px; }
  .studio[data-type="image"] .cs-right { height:65vh; min-height:380px; }
  .studio[data-type="image"] .image-references { max-height:160px; }
}
@media (max-width:640px) {
  .code-studio[data-type="text"],.code-studio[data-type="image"],.code-studio[data-type="video"] { overflow:hidden; }
  .studio[data-type="text"] .cs-left,.studio[data-type="image"] .cs-left,.studio[data-type="video"] .cs-left { height:auto; min-height:0; }
  .studio[data-type="text"] .cs-conversation,.studio[data-type="image"] .cs-conversation,.studio[data-type="video"] .cs-conversation { flex:1 1 auto; max-height:none; min-height:0; padding:10px 12px; }
  .studio[data-type="text"] .cs-right,.studio[data-type="image"] .cs-right,.studio[data-type="video"] .cs-right { height:auto; min-height:0; }
  .studio[data-type="image"] .cs-left-head,.studio[data-type="video"] .cs-left-head { flex-wrap:nowrap; padding:7px 12px; }
  .studio[data-type="text"] .image-references,.studio[data-type="image"] .image-references,.studio[data-type="video"] .image-references { max-height:92px; }
  .prompt-file-help{display:none}
}