/* 5183 작업실과 5190 공개 페이지가 함께 쓰는 캐릭터 채팅 본체. 한쪽만 고치는 규칙을 두지 않는다. */
/* 색 토큰은 여기 한 곳 — 캐릭터 채팅 무대(.character-chat-stage)든 스토리 미리보기·플레이든 채팅 본체가 붙는 곳이면 어디든 같은 값을 받는다.
   (전에는 무대에만 있어서 무대 없는 스토리 화면은 아래 color-mix(var(--cc-fg)) 가 전부 무효가 되고 입력창 테두리·배경이 사라졌다.) */
.character-chat-stage,.shared-character-chat{
  --cc-bg:var(--ed-bg,var(--bg,#171918));
  --cc-panel:var(--ed-bg,var(--panel,#1d201f));
  --cc-fg:var(--ed-fg,var(--text,#f3f1eb));
  --cc-muted:var(--text-dim,var(--soft,#aaa8a1));
  --cc-line:var(--border,var(--line,#343735));
  --cc-accent:var(--accent,var(--amber,#d48a12));
}
.shared-character-chat{
  --font-size-body:16px;--font-size-label:15px;
  width:100%;height:100%;min-width:0;min-height:0;margin:0;display:flex;flex-direction:column;
  overflow:hidden;background:var(--cc-bg,var(--ed-bg,var(--bg)));color:var(--cc-fg,var(--ed-fg,var(--text)));container:character-chat / inline-size;
}
.shared-character-chat *{box-sizing:border-box}
.shared-character-chat button,.shared-character-chat textarea,.shared-character-chat select{font:inherit}
.shared-character-chat-toolbar{
  position:relative;z-index:24;flex:0 0 42px;height:42px;min-width:0;padding:0 10px;display:flex;align-items:center;gap:3px;
  border:0;border-bottom:1px solid var(--cc-line,var(--border));background:var(--cc-bg,var(--ed-bg,var(--bg)));
}
.shared-character-chat-history{position:relative;min-width:0}
.shared-character-chat-title,.shared-character-chat-new{
  height:32px;padding:0 5px;display:inline-flex;align-items:center;gap:6px;border:0;border-radius:6px;
  background:transparent;color:var(--cc-fg,var(--text));cursor:pointer;
}
.shared-character-chat-title{max-width:250px;font-size:var(--font-size-label);font-weight:700}
.shared-character-chat-title:hover,.shared-character-chat-title.is-open,.shared-character-chat-new:hover{background:color-mix(in srgb,var(--cc-fg) 7%,transparent)}
.shared-character-chat-title>svg:first-child{width:15px;height:15px}.shared-character-chat-title>svg:last-child{width:11px;height:11px;color:var(--cc-muted,var(--text-dim))}
.shared-character-chat-title>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.shared-character-chat-spacer{flex:1;min-width:4px}
.shared-character-chat-new{width:32px;padding:0;justify-content:center;color:var(--cc-muted,var(--text-dim))}
.shared-character-chat-new svg{width:15px;height:15px}.shared-character-chat-new:disabled{opacity:.4;cursor:default}
/* 위 줄 아이콘 단추(전체화면 해제 등) — 새 대화 단추와 같은 크기·같은 hover. */
.shared-character-chat-toolbar-button{width:32px;height:32px;padding:0;display:grid;place-items:center;border:0;border-radius:7px;background:transparent;color:var(--cc-muted,var(--text-dim));cursor:pointer}
.shared-character-chat-toolbar-button:hover{background:color-mix(in srgb,var(--cc-fg) 7%,transparent);color:var(--cc-fg,var(--text))}
.shared-character-chat-toolbar-button.is-on{color:var(--cc-accent,var(--accent))}
.shared-character-chat-toolbar-button svg{width:16px;height:16px}
.shared-character-chat-history-pop{
  position:absolute;z-index:80;top:39px;left:0;width:min(330px,calc(100vw - 28px));max-height:min(430px,66vh);overflow:auto;
  padding:5px;border:1px solid var(--cc-line,var(--border));border-radius:10px;background:var(--cc-bg,var(--bg));
  box-shadow:0 16px 42px color-mix(in srgb,#000 38%,transparent);
}
.shared-character-chat-history-head{min-height:42px;padding:0 8px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--cc-line,var(--border));font-size:var(--font-size-label)}
.shared-character-chat-history-head span{color:var(--cc-muted,var(--text-dim))}
.shared-character-chat-history-list{padding-top:4px}.shared-character-chat-history-list>p{margin:0;padding:18px 10px;color:var(--cc-muted,var(--text-dim));font-size:var(--font-size-label);text-align:center}
.shared-character-chat-history-row{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;border-radius:7px}
.shared-character-chat-history-row:hover,.shared-character-chat-history-row.is-current{background:color-mix(in srgb,var(--cc-fg) 7%,transparent)}
.shared-character-chat-history-row.is-current{box-shadow:inset 2px 0 var(--cc-accent,var(--accent))}
.shared-character-chat-history-row>button:first-child{min-width:0;min-height:48px;padding:7px 9px;display:block;border:0;background:transparent;color:var(--cc-fg,var(--text));text-align:left;cursor:pointer}
.shared-character-chat-history-row>button span{min-width:0;display:grid;gap:3px}.shared-character-chat-history-row strong,.shared-character-chat-history-row small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.shared-character-chat-history-row strong{font-size:var(--font-size-label)}.shared-character-chat-history-row small{color:var(--cc-muted,var(--text-dim));font-size:var(--font-size-label)}
.shared-character-chat-history-delete{width:26px;height:26px;margin-right:5px;border:0;border-radius:6px;background:transparent;color:var(--cc-muted,var(--text-dim));cursor:pointer}.shared-character-chat-history-delete:hover{background:color-mix(in srgb,#c84a4a 14%,transparent);color:#c84a4a}

.shared-character-chat-messages{flex:1;min-height:0;overflow-y:auto;scrollbar-gutter:stable both-edges}
.shared-character-chat-column{
  width:100%;max-width:var(--ed-width,760px);min-height:100%;margin:0 auto;padding:10px var(--ed-pad,20px) 8px;
  display:flex;flex-direction:column;justify-content:flex-start;gap:10px;
  font-family:var(--ed-font,inherit);font-size:max(var(--ed-size,var(--font-size-body)),var(--font-size-label));line-height:var(--ed-lh,1.65);
}
.shared-character-chat-message{min-width:0;margin:0;padding:0;color:var(--cc-fg,var(--ed-fg,var(--text)));white-space:normal;overflow-wrap:anywhere}
/* 대화 모양 둘 — 뿌리 .shared-character-chat.is-bubble(기본, 읽기 편함) / .is-plain(효율, 제타·크랙 방식). 화면 설정 「대화 모양」에서 고른다(2026-09-05 건우님 "예전 말풍선이 글 읽기가 더 편하다, 설정에서 선택할 수 있게"). */
.shared-character-chat-message.is-error{color:#bd3f3f}
/* 장면 그림 — 제작자가 올린 그림 그대로(안 자름). 가로 그림은 칸 폭을 꽉 채우고(작은 그림도 늘림 — 2026-09-07 건우님 "완전 와이드로 했는데 왜 좌우가 짤리지", 320px GIF 가 실제 크기로 떠 양옆이 비었다), 세로 그림은 높이만 화면에 맞춘다. 첫 메시지와 그림이 바뀐 답변 위에만 붙는다.
   **좌우 끝은 아래 입력창과 한 줄로 딱 맞춘다(2026-09-08 건우님 "난 딱 맞는 걸 좋아해, 밑에 채팅창 크기와 맞춰야").** 그래서 그림은 **말풍선 칸(article) 밖, 글 칸(column)의 직계 자식**이다 —
   캐릭터 말풍선은 오른쪽에 여백을 두려고 92% 라(아래 .is-assistant) 그 안에 있으면 그림도 같이 92% 로 줄어 입력창보다 짧았다. 칸(column)과 입력창 칸(foot)은 폭 규칙이 같으니 여기서 width:100% 면 끝이다.
   ⛔ **칸을 뚫는 full-bleed(100cqw)도, article 안으로 되돌리는 것도 하지 말 것** — 2026-09-08 에 둘 다 겪고 되돌린 자리다. 더 크게 보려면 화면 설정 「본문 폭」을 늘린다(셋이 함께 커진다). */
.shared-character-chat-column>figure{width:100%;margin:0;overflow:hidden;border-radius:10px;background:#121319}
.shared-character-chat-column>figure img,.shared-character-chat-column>figure video{display:block;width:100%;height:auto;max-height:min(62vh,560px);object-fit:contain}
.shared-character-chat-roleplay{display:flex;flex-direction:column;gap:14px}.shared-character-chat-roleplay p{margin:0;white-space:pre-wrap}
.shared-character-chat-turn{min-width:0;margin:0;padding:0}
.shared-character-chat-thinking{color:var(--cc-muted,var(--text-dim))}
/* 「이전 대화 더 보기」 — 대화를 열면 최근 한 쪽만 받고, 위로 올리면 그 앞을 더 받는다(2026-09-08). */
.shared-character-chat-earlier{align-self:center;height:30px;margin:2px 0 6px;padding:0 14px;border:1px solid color-mix(in srgb,var(--cc-fg) 14%,transparent);border-radius:999px;background:transparent;color:var(--cc-muted,var(--text-dim));font:inherit;font-size:var(--font-size-label);cursor:pointer}
.shared-character-chat-earlier:hover:not(:disabled){background:color-mix(in srgb,var(--cc-fg) 7%,transparent);color:var(--cc-fg,var(--text))}
.shared-character-chat-earlier:disabled{opacity:.55;cursor:default}
/* 「다시 받기」 줄 — 마지막 답변 아래에만. 판본이 둘 이상이면 ‹ 2/3 › 로 되돌아간다(2026-09-08). */
.shared-character-chat-variants{display:flex;align-items:center;gap:2px;margin-top:8px;color:var(--cc-muted,var(--text-dim));font-size:var(--font-size-label)}
.shared-character-chat-variants button{height:26px;min-width:26px;padding:0;display:inline-flex;align-items:center;justify-content:center;gap:5px;border:0;border-radius:7px;background:transparent;color:inherit;font:inherit;font-size:var(--font-size-label);cursor:pointer}
.shared-character-chat-variants button:hover:not(:disabled){background:color-mix(in srgb,var(--cc-fg) 8%,transparent);color:var(--cc-fg,var(--text))}
.shared-character-chat-variants button:disabled{opacity:.32;cursor:default}
.shared-character-chat-variants button:focus-visible{outline:2px solid var(--cc-accent,var(--accent));outline-offset:2px}
.shared-character-chat-variants>span{min-width:34px;padding:0 2px;text-align:center;font-variant-numeric:tabular-nums}
.shared-character-chat-variants .shared-character-chat-reroll{padding:0 9px 0 7px}
.shared-character-chat-variants svg{width:13px;height:13px}
/* 평문 — 말풍선·아바타·이름 머리줄 없음. 서술은 본문(살짝 흐리게), 대사는 「이름」(강조색) + 대사, 내 말은 위아래 선 한 줄씩. 굵기 없음. */
.shared-character-chat.is-plain .shared-character-chat-message.is-user{width:100%;margin-top:6px;align-self:stretch}
.shared-character-chat.is-plain .shared-character-chat-user{padding:12px 0;border-top:1px solid color-mix(in srgb,var(--cc-fg) 14%,transparent);border-bottom:1px solid color-mix(in srgb,var(--cc-fg) 14%,transparent);color:var(--cc-fg);white-space:pre-wrap}
.shared-character-chat.is-plain .shared-character-chat-message.is-assistant{width:100%;align-self:stretch}
.shared-character-chat.is-plain .shared-character-chat-turn.is-narration,.shared-character-chat.is-plain .shared-character-chat-turn.is-action{color:color-mix(in srgb,var(--cc-fg) 78%,transparent)}.shared-character-chat.is-plain .shared-character-chat-turn.is-action{font-style:italic}
.shared-character-chat-speaker{margin-right:6px;color:var(--cc-accent,var(--accent))}
/* 말풍선 — 지문·대사 각각 상자, 대사 첫 줄엔 아바타 + 이름, 내 말은 오른쪽 상자. */
.shared-character-chat.is-bubble .shared-character-chat-message.is-user{max-width:82%;margin-top:8px;align-self:flex-end}
.shared-character-chat.is-bubble .shared-character-chat-user{padding:9px 12px;border:1px solid color-mix(in srgb,var(--cc-fg) 16%,transparent);border-radius:14px 0 14px 14px;background:color-mix(in srgb,var(--cc-fg) 9%,var(--cc-bg));color:var(--cc-fg);white-space:pre-wrap}
.shared-character-chat.is-bubble .shared-character-chat-message.is-assistant{width:92%;align-self:flex-start}
.shared-character-chat.is-bubble .shared-character-chat-roleplay{gap:16px}
.shared-character-chat-turn-head{min-height:36px;margin-bottom:4px;display:flex;align-items:center;gap:8px}
.shared-character-chat-turn-head strong{color:color-mix(in srgb,var(--cc-accent) 78%,var(--cc-fg));font-size:var(--font-size-label);font-weight:400}
.shared-character-chat-avatar{width:36px;height:36px;flex:0 0 36px;display:grid;place-items:center;overflow:hidden;border:1px solid color-mix(in srgb,var(--cc-fg) 16%,transparent);border-radius:50%;background:color-mix(in srgb,var(--cc-accent) 12%,var(--cc-bg));color:var(--cc-accent);font-size:var(--font-size-label);box-shadow:0 5px 13px color-mix(in srgb,#000 9%,transparent)}
/* 얼굴은 그림일 수도 영상일 수도 있다 — 카드도 채팅과 같은 MP4 한 벌을 쓴다(2026-09-08). 둘을 같은 규칙으로 잡는다. */
.shared-character-chat-avatar img,.shared-character-chat-avatar video{width:100%;height:100%;display:block;object-fit:cover}
.shared-character-chat.is-bubble .shared-character-chat-turn.is-dialogue:not(.is-continuation){display:grid;grid-template-columns:36px minmax(0,1fr);grid-template-rows:auto auto;column-gap:8px}.shared-character-chat.is-bubble .shared-character-chat-turn.is-dialogue:not(.is-continuation) .shared-character-chat-turn-head{display:contents}.shared-character-chat.is-bubble .shared-character-chat-turn.is-dialogue:not(.is-continuation) .shared-character-chat-avatar{grid-column:1;grid-row:1/span 2;align-self:start}.shared-character-chat.is-bubble .shared-character-chat-turn.is-dialogue:not(.is-continuation) .shared-character-chat-turn-head strong{grid-column:2;grid-row:1;min-height:24px;margin-bottom:4px;display:flex;align-items:center}.shared-character-chat.is-bubble .shared-character-chat-turn.is-dialogue:not(.is-continuation) .shared-character-chat-bubble{grid-column:2;grid-row:2}.shared-character-chat.is-bubble .shared-character-chat-turn.is-dialogue.is-continuation,.shared-character-chat.is-bubble .shared-character-chat-turn.is-narration,.shared-character-chat.is-bubble .shared-character-chat-turn.is-action{padding-left:44px}
.shared-character-chat-bubble{padding:11px 14px;display:grid;gap:8px;border:1px solid color-mix(in srgb,var(--cc-fg) 13%,transparent);border-radius:0 14px 14px 14px;background:color-mix(in srgb,var(--cc-fg) 5%,var(--cc-bg))}
.shared-character-chat-turn.is-narration .shared-character-chat-bubble,.shared-character-chat-turn.is-action .shared-character-chat-bubble{background:color-mix(in srgb,var(--cc-fg) 7%,var(--cc-bg))}.shared-character-chat-bubble .is-action{font-style:italic;color:color-mix(in srgb,var(--cc-fg) 64%,transparent)}
.shared-character-chat-bubble .is-narration{color:color-mix(in srgb,var(--cc-fg) 64%,transparent)}
.shared-character-chat-choices{margin-top:9px;display:flex;flex-wrap:wrap;gap:6px}.shared-character-chat-choices button{padding:7px 10px;border:1px solid var(--cc-line,var(--border));border-radius:8px;background:var(--cc-bg,var(--bg));color:var(--cc-muted,var(--text-dim));cursor:pointer}.shared-character-chat-choices button:hover{border-color:var(--cc-accent);color:var(--cc-fg)}
/* ── 카드 한 벌 — 가운데 칸의 캐릭터·상태창·현재 장면 셋과 메시지 줄(폰)의 같은 카드(2026-09-05 건우님 "하나로 묶어서, 박스, 테두리 없음, 접고 펼치기, 양식 동일, 최대한 심플").
   테두리 없이 바탕만 살짝 밝은 상자, 머리줄 = 제목 + 화살표(누르면 접힘), 본문 줄 = 라벨 | 값 격자 하나. 종류(is-profile·is-status·is-scene)는 본문 안 배치만 다르다. */
.character-chat-card{min-width:0;margin:0;padding:0;overflow:hidden;container:hud-card / inline-size;border-radius:10px;background:color-mix(in srgb,var(--cc-fg) 4%,var(--cc-bg));font-family:var(--ui-font,'Pretendard Variable','Malgun Gothic',sans-serif);font-size:var(--font-size-label);line-height:1.5}
.character-chat-card-head{width:100%;min-height:42px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;gap:8px;border:0;background:transparent;color:var(--cc-fg);font:inherit;font-size:var(--font-size-label);font-weight:400;text-align:left;cursor:pointer}
.character-chat-card-head:hover{background:color-mix(in srgb,var(--cc-fg) 4%,transparent)}.character-chat-card-head:focus-visible{outline:2px solid var(--cc-accent);outline-offset:-2px}
.character-chat-card-head>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.character-chat-card-head>svg{flex:0 0 auto;color:var(--cc-muted,var(--text-dim));transition:transform .14s ease}.character-chat-card.is-open .character-chat-card-head>svg{transform:rotate(180deg)}
.character-chat-card-body{padding:0 12px 12px}
/* 본문 줄 = 라벨 | 값. 상태창·현재 장면 카드는 줄마다가 아니라 카드 전체가 라벨 칸 폭 하나를 같이 쓴다(subgrid) — 선 없는 표(2026-09-05 건우님 "좌측, 우측을 표 형태로 간격을 맞추자").
   카드 안엔 굵은 글씨·다른 글자 크기가 없다(같은 날 "굵은 글씨 쓰지 마, 글씨체도 크기도 동일하게"). */
.character-chat-card-row{min-width:0;margin:0;padding:3px 0;display:grid;grid-template-columns:minmax(56px,auto) minmax(0,1fr);column-gap:10px;align-items:start}
.character-chat-card-row>b,.character-chat-card-row>dt{color:var(--cc-accent,var(--accent));font-weight:400}
@supports (grid-template-columns:subgrid){
.character-chat-card.is-status>.character-chat-card-body,.character-chat-card.is-scene>.character-chat-card-body{display:grid;grid-template-columns:fit-content(40%) minmax(0,1fr);column-gap:10px;align-content:start}
.character-chat-card.is-status .character-chat-card-row,.character-chat-card.is-scene .character-chat-card-row{grid-template-columns:subgrid;grid-column:1/-1}
/* 아래쪽 기본 규칙(.character-chat-scene-facts{display:grid})보다 세게 — 묶음 상자는 사라지고 줄들이 카드 격자에 바로 놓인다. */
.character-chat-card.is-scene .character-chat-scene-facts,.character-chat-card.is-scene .character-chat-scene-actor{display:contents}
.character-chat-card.is-scene .character-chat-scene-actor>strong{grid-column:1/-1}
}
.character-chat-card-row>span,.character-chat-card-row>dd{margin:0;min-width:0;color:color-mix(in srgb,var(--cc-fg) 88%,transparent);overflow-wrap:anywhere}
.character-chat-card-empty{margin:0;padding:3px 0;color:var(--cc-muted,var(--text-dim))}
/* 메시지 줄의 카드 묶음(상태창·현재 장면) — 넓은 화면의 3단 틀에선 HUD 가 대신 보이고 이 묶음은 숨는다(siteSplitFrame.ts). */
.character-chat-scene-cards{margin-top:10px;display:grid;gap:10px}
/* 캐릭터 카드 본문 — 왼쪽 사진(3:4, 높이 200px 고정) | 오른쪽 한 줄 소개·설명(7줄까지)·태그. 카드가 세로로 더 길어지지 않게 사진 높이와 설명 줄 수를 못 박았다(2026-09-05 건우님 "은주 부분이 너무 크다, 세로 최소 크기를 정해 두자"). 사진이 여럿이면 ‹ › 와 n / m (모양은 characterChatDesign.ts 의 gallery-nav). */
.character-chat-profile{display:grid;grid-template-columns:150px minmax(0,1fr);gap:14px;align-items:start}
.character-chat-profile-media{position:relative;width:150px;height:200px;min-width:0;aspect-ratio:3/4;overflow:hidden;border-radius:8px;background:#111413}
.character-chat-profile-media>img,.character-chat-profile-media>video{width:100%;height:100%;display:block;object-fit:cover;object-position:center top;-webkit-user-drag:none;user-select:none}
.character-chat-profile-fallback{width:100%;height:100%;display:grid;place-items:center;color:var(--cc-muted,var(--text-dim));font-size:48px;font-weight:400}
.character-chat-profile-media.is-zoomable>img,.character-chat-profile-media.is-zoomable>video,.character-chat-media.is-zoomable{cursor:zoom-in}
/* 이미지 크게 보기(CharacterChatLightbox) — 카드 사진·스토리 표지 클릭. 뒤는 어둡게, 아무 데나 누르거나 Esc 로 닫힘, 여럿이면 ‹ ›(카드의 gallery-nav 그대로)·방향키. */
.character-chat-lightbox{position:fixed;inset:0;z-index:300;display:grid;place-items:center;background:color-mix(in srgb,#000 82%,transparent);cursor:zoom-out}
.character-chat-lightbox>img,.character-chat-lightbox>video{max-width:min(96vw,1400px);max-height:94vh;border-radius:10px;box-shadow:0 30px 80px #000a;cursor:default;-webkit-user-drag:none;user-select:none}
.character-chat-lightbox .character-chat-gallery-nav{opacity:.85}.character-chat-lightbox .character-chat-gallery-count{right:auto;left:14px}
.character-chat-lightbox-close{position:fixed;top:14px;right:14px;width:40px;height:40px;padding:0;display:grid;place-items:center;border:1px solid color-mix(in srgb,#fff 25%,transparent);border-radius:50%;background:color-mix(in srgb,#000 55%,transparent);color:#fff;cursor:pointer}.character-chat-lightbox-close:hover{border-color:var(--cc-accent,var(--amber))}.character-chat-lightbox-close svg{width:18px;height:18px}
.character-chat-profile-copy{min-width:0;padding-top:2px}
.character-chat-profile-line{margin:0;color:var(--cc-fg);font-size:inherit;line-height:1.5}
.character-chat-profile-summary{margin:8px 0 0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:7;overflow:hidden;color:color-mix(in srgb,var(--cc-fg) 78%,transparent);white-space:pre-line;overflow-wrap:anywhere}
.character-chat-profile-tags{margin-top:10px;display:flex;flex-wrap:wrap;gap:6px}.character-chat-profile-tags>span{padding:1px 8px;border-radius:999px;background:color-mix(in srgb,var(--cc-fg) 7%,transparent);color:var(--cc-muted,var(--text-dim))}
/* 상태 값 — 「현재/최대」 모양은 막대, 그 외는 span 그대로(값 모양이 표시를 정한다).
   막대는 줄 높이(1.5em)만큼 두껍고 숫자가 한가운데(2026-09-05 건우님 "바 세로를 더 크게 해서 중간에 89/100 — 공간 활용"). 숫자 뒤엔 바탕색 번짐으로 채움 위에서도 읽힌다. */
.character-chat-status-bar{position:relative;display:block;height:1.5em;border-radius:999px;overflow:hidden;background:color-mix(in srgb,var(--cc-fg) 12%,transparent)}.character-chat-status-bar>i{position:absolute;inset:0;display:block}.character-chat-status-bar>i>i{display:block;height:100%;background:var(--cc-accent,var(--accent));transition:width .25s ease}.character-chat-status-bar>small{position:absolute;inset:0;display:grid;place-items:center;color:var(--cc-fg);font-size:inherit;font-variant-numeric:tabular-nums;white-space:nowrap;text-shadow:0 0 3px var(--cc-bg)}
/* 상태창 묶음 제목(「나」「은주」「세계」…) — 현재 장면 카드의 인물 이름 줄과 같은 모양. 첫 묶음은 위 여백을 덜 둔다. */
.character-chat-card-group{grid-column:1/-1;margin:0;padding:9px 0 3px;color:var(--cc-accent,var(--accent))}.character-chat-card-group:first-child{padding-top:3px}
/* 현재 장면 본문 — 장면 공통 줄(dl) 아래 인물별 묶음(article). 상자 없이 한 목록으로 — 이름 한 줄(강조색) 아래 항목 줄이 장면 공통 줄과 같은 들여쓰기(2026-09-05 건우님 "다 같은 장면인데 왜 다시 박스 안에 있냐"). */
.character-chat-scene-facts{margin:0;display:grid}
.character-chat-scene-actor{margin:0;padding:0}.character-chat-scene-actor>strong{display:block;padding:9px 0 3px;color:var(--cc-accent,var(--accent));font-weight:400}
/* 카드가 좁아지면 모양을 바꾼다(카드 폭 기준, 컨테이너 이름 hud-card — 2026-09-05 건우님 "어느 정도 줄어들면 이렇게 변화되게").
   캐릭터 카드 340px 아래: 사진 위(150px), 글 아래. 현재 장면 360px 아래: 라벨 위 · 값 아래(2열일 때와 같은 모양, 그건 siteSplitFrame.ts 의 hud-pair 규칙). */
@container hud-card (max-width:340px){.character-chat-profile{grid-template-columns:1fr;gap:10px}.character-chat-profile-media{width:150px}}
@container hud-card (max-width:360px){.character-chat-card.is-scene>.character-chat-card-body{grid-template-columns:1fr}.character-chat-card.is-scene .character-chat-card-row{grid-template-columns:1fr;row-gap:1px;padding:5px 0}}

/* 입력창 칸 — 폭 규칙은 위 글 칸(.shared-character-chat-column)과 한 벌이라야 장면 그림과 좌우가 맞는다.
   다만 글 칸은 스크롤바 자리(양쪽 --cc-scrollbar)를 뺀 안쪽에 놓이므로 여기서도 그만큼 좁혀 준다 — 안 그러면 그림이 입력창보다 양쪽 7px 씩 짧다. */
.shared-character-chat-foot{position:relative;flex:0 0 auto;width:calc(100% - var(--cc-scrollbar,0px) * 2);max-width:var(--ed-width,760px);margin:0 auto;padding:6px var(--ed-pad,20px) 7px}
/* 「맨 아래로」 — 답을 읽으려고 위로 올려 두면 입력창 위에 뜬다. 누르면 바닥에 다시 붙는다(2026-09-08). */
.shared-character-chat-tobottom{position:absolute;left:50%;top:-30px;z-index:3;width:30px;height:30px;padding:0;display:grid;place-items:center;transform:translateX(-50%);border:1px solid color-mix(in srgb,var(--cc-fg) 15%,transparent);border-radius:50%;background:var(--cc-bg,var(--bg));color:var(--cc-fg,var(--text));box-shadow:0 4px 14px color-mix(in srgb,#000 24%,transparent);cursor:pointer}
.shared-character-chat-tobottom:hover{background:color-mix(in srgb,var(--cc-fg) 8%,var(--cc-bg))}
.shared-character-chat-tobottom:focus-visible{outline:2px solid var(--cc-accent,var(--accent));outline-offset:2px}
.shared-character-chat-tobottom svg{width:15px;height:15px}
.shared-character-chat-composer{position:relative;min-height:84px;display:flex;flex-direction:column;border:1px solid color-mix(in srgb,var(--cc-fg) 17%,transparent);border-radius:13px;background:color-mix(in srgb,var(--cc-fg) 5%,var(--cc-bg));box-shadow:0 5px 18px color-mix(in srgb,#000 7%,transparent)}
.shared-character-chat-composer:focus-within{border-color:var(--cc-accent,var(--accent))}
.shared-character-chat-composer.is-gated{min-height:84px}
/* 입력창에 붙인 그림(Ctrl+V, 설계 채팅) — 보내기 전 미리보기 칩과 사용자 말풍선 안의 그림. */
.shared-character-chat-attachments{display:flex;flex-wrap:wrap;gap:8px;padding:10px 12px 0}
.shared-character-chat-attachment{position:relative;width:72px;height:72px;overflow:hidden;border:1px solid color-mix(in srgb,var(--cc-fg) 16%,transparent);border-radius:9px;background:color-mix(in srgb,var(--cc-fg) 6%,var(--cc-bg))}
.shared-character-chat-attachment img{display:block;width:100%;height:100%;object-fit:cover}
.shared-character-chat-attachment button{position:absolute;top:3px;right:3px;width:20px;height:20px;padding:0;border:0;border-radius:50%;background:#000a;color:#fff;font:inherit;font-size:13px;line-height:20px;cursor:pointer}
.shared-character-chat-user-images{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.shared-character-chat-user-images img{display:block;max-width:220px;max-height:220px;border-radius:9px}
.shared-character-chat-gate{min-height:82px;padding:13px 14px;display:flex;align-items:center;justify-content:space-between;gap:14px}.shared-character-chat-gate-copy{min-width:0;display:grid;gap:3px}.shared-character-chat-gate-copy strong{color:var(--cc-fg);font-size:var(--font-size-label)}.shared-character-chat-gate-copy span{color:color-mix(in srgb,var(--cc-fg) 62%,transparent);font-size:var(--font-size-label);line-height:1.45}.shared-character-chat-login{min-height:40px;flex:0 0 auto;padding:0 15px;display:inline-flex;align-items:center;justify-content:center;border:1px solid color-mix(in srgb,var(--cc-accent,var(--accent)) 72%,var(--cc-line));border-radius:8px;background:var(--cc-accent,var(--accent));color:var(--accent-contrast,#211505);font-size:var(--font-size-label);font-weight:800;text-decoration:none;white-space:nowrap}.shared-character-chat-login:hover{filter:brightness(1.08)}.shared-character-chat-login:focus-visible{outline:2px solid var(--cc-accent,var(--accent));outline-offset:3px}
.shared-character-chat-composer textarea{width:100%;min-height:50px;max-height:50vh;padding:10px 12px 2px;resize:none;overflow-y:auto;border:0;outline:0;background:transparent;color:var(--cc-fg);font:inherit;font-size:var(--font-size-body);line-height:1.5}.shared-character-chat-composer textarea::placeholder{color:color-mix(in srgb,var(--cc-fg) 56%,transparent)}
.shared-character-chat-composer-bar{min-width:0;display:flex;align-items:center;gap:5px;padding:3px 7px 7px 8px}.shared-character-chat-model{min-width:0;max-width:200px;display:flex;align-items:center}.shared-character-chat-model>*{min-width:0}
.shared-character-chat-model .ai-model-now{color:color-mix(in srgb,var(--cc-fg) 76%,transparent);font-size:var(--font-size-label);font-weight:650}.shared-character-chat-model .ai-model-now:hover,.shared-character-chat-model .ai-model-now.active{background:color-mix(in srgb,var(--cc-fg) 9%,transparent);color:var(--cc-fg)}
.shared-character-chat-model select{max-width:190px;height:32px;padding:0 4px;border:0;border-radius:6px;outline:0;background:transparent;color:color-mix(in srgb,var(--cc-fg) 76%,transparent);font-size:var(--font-size-label);font-weight:700;cursor:pointer}
.shared-character-chat-model select:hover,.shared-character-chat-model select:focus{background:color-mix(in srgb,var(--cc-fg) 9%,transparent);color:var(--cc-fg)}
/* 펼친 목록은 브라우저가 그린다 — 상자 배경이 투명이면 목록을 흰 바탕에 채팅 글자색으로 그려 어두운 테마에서 안 보인다. 항목 색을 채팅 바탕·글자색으로 못 박는다. */
.shared-character-chat-model select option{background:var(--cc-bg);color:var(--cc-fg)}
.shared-character-chat-token{min-width:0;overflow:hidden;color:color-mix(in srgb,var(--cc-fg) 58%,transparent);font-size:var(--font-size-label);text-overflow:ellipsis;white-space:nowrap}
.shared-character-chat-suggestion{position:relative;flex:0 0 auto}.shared-character-chat-suggestion-button{width:29px;height:29px;padding:0;display:grid;place-items:center;border:0;border-radius:50%;background:color-mix(in srgb,var(--cc-fg) 7%,transparent);color:color-mix(in srgb,var(--cc-fg) 70%,transparent);cursor:pointer}.shared-character-chat-suggestion-button:hover,.shared-character-chat-suggestion-button.is-open{background:color-mix(in srgb,var(--cc-accent) 15%,transparent);color:var(--cc-accent)}.shared-character-chat-suggestion-button:disabled{opacity:.45;cursor:wait}.shared-character-chat-suggestion-button svg{width:15px;height:15px}.shared-character-chat-suggestion-pop{position:absolute;z-index:30;right:0;bottom:38px;width:230px;padding:14px;display:grid;gap:7px;border:1px solid var(--cc-line,var(--border));border-radius:11px;background:var(--cc-bg,var(--bg-elev));color:var(--cc-fg,var(--text));box-shadow:0 15px 38px #0005}.shared-character-chat-suggestion-pop strong{font-size:var(--font-size-label)}.shared-character-chat-suggestion-pop span,.shared-character-chat-suggestion-pop small{color:var(--cc-muted,var(--text-dim));font-size:var(--font-size-label);line-height:1.45}.shared-character-chat-suggestion-pop small{color:var(--cc-accent);font-weight:750}.shared-character-chat-suggestion-pop>button{height:39px;margin-top:3px;border:0;border-radius:8px;background:var(--cc-accent,var(--accent));color:var(--accent-contrast,#211505);font:inherit;font-size:var(--font-size-label);font-weight:800;cursor:pointer}.shared-character-chat-suggestion-pop>button:disabled{opacity:.55;cursor:wait}
.shared-character-chat-send{width:27px;height:27px;flex:0 0 27px;padding:0;display:grid;place-items:center;border:0;border-radius:50%;background:var(--cc-accent,var(--accent));color:var(--accent-contrast,#211505);cursor:pointer}.shared-character-chat-send svg{width:14px;height:14px}.shared-character-chat-send:hover{filter:brightness(1.08)}.shared-character-chat-send:disabled{background:transparent;color:color-mix(in srgb,var(--cc-fg) 48%,transparent);cursor:default;filter:none}
.shared-character-chat-grip{position:absolute;z-index:2;top:-4px;right:10px;width:38px;height:9px;border-radius:5px;background:var(--cc-accent,var(--accent));cursor:ns-resize}
.shared-character-chat-status{min-height:18px;margin:3px 0 0;color:var(--cc-muted,var(--text-dim));font-size:var(--font-size-label);text-align:center}.shared-character-chat-status.is-error{color:#bd3f3f}
/* 상태 줄 + 오른쪽 끝 아이콘(플레이 화면의 전체화면) — 머리줄이 없는 화면에서 보통 때도 전체화면 때도 남는 유일한 줄이라 여기서 켜고 끈다(2026-09-05 건우님). 글은 아이콘 옆에 오른쪽 정렬. */
.shared-character-chat-foot-bar{min-height:26px;margin-top:3px;display:flex;align-items:center;justify-content:flex-end;gap:6px}
.shared-character-chat-foot-bar .shared-character-chat-status{min-width:0;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right}
.shared-character-chat-foot-button{width:26px;height:26px;flex:0 0 26px;padding:0;display:grid;place-items:center;border:0;border-radius:6px;background:transparent;color:var(--cc-muted,var(--text-dim));cursor:pointer}
.shared-character-chat-foot-button:hover{background:color-mix(in srgb,var(--cc-fg) 7%,transparent);color:var(--cc-fg,var(--text))}
.shared-character-chat-foot-button.is-on{color:var(--cc-accent,var(--accent))}
.shared-character-chat-foot-button svg{width:15px;height:15px}
.shared-character-chat-toolbar .character-chat-appearance-button{width:27px;height:26px;padding:0;display:grid;place-items:center;border:0;border-radius:6px;background:transparent;color:var(--cc-muted,var(--soft));cursor:pointer}
.shared-character-chat-toolbar .character-chat-appearance-button:hover{background:color-mix(in srgb,var(--cc-fg,var(--text)) 7%,transparent);color:var(--cc-fg,var(--text))}.shared-character-chat-toolbar .character-chat-appearance-button.on{color:var(--cc-accent,var(--amber))}.shared-character-chat-toolbar .character-chat-appearance-button svg{width:15px;height:15px}
.shared-character-chat-toolbar .character-chat-memory-button{height:32px;padding:0 7px;display:inline-flex;align-items:center;gap:5px;border:0;border-radius:6px;background:transparent;color:var(--cc-muted,var(--soft));font-size:var(--font-size-label);font-weight:700;cursor:pointer}.shared-character-chat-toolbar .character-chat-memory-button:hover,.shared-character-chat-toolbar .character-chat-memory-button[aria-expanded="true"]{background:color-mix(in srgb,var(--cc-fg,var(--text)) 7%,transparent);color:var(--cc-fg,var(--text))}.shared-character-chat-toolbar .character-chat-memory-button.is-active{color:var(--cc-accent,var(--amber))}.shared-character-chat-toolbar .character-chat-memory-button svg{width:14px;height:14px}
.character-chat-memory-pop{position:fixed;z-index:210;width:390px;max-width:calc(100vw - 16px);padding:0;border:1px solid var(--border,var(--line,#cecac1));border-radius:12px;overflow:hidden;background:var(--bg-elev,var(--panel,#f7f6f2));color:var(--text,#25221e);box-shadow:0 18px 46px color-mix(in srgb,#000 32%,transparent);font-family:var(--ui-font,'Pretendard Variable','Malgun Gothic',sans-serif)}
.character-chat-memory-pop>header{height:48px;padding:0 12px 0 16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border,var(--line));background:transparent;cursor:move;user-select:none}.character-chat-memory-pop>header>span{display:flex;align-items:center;gap:8px}.character-chat-memory-pop>header svg{width:16px;height:16px}.character-chat-memory-pop>header strong{font-size:var(--font-size-label,15px)}.character-chat-memory-close{width:32px;height:32px;padding:0;display:grid;place-items:center;border:0;border-radius:7px;background:transparent;color:var(--text-dim,var(--muted));cursor:pointer}.character-chat-memory-close:hover{background:var(--bg,var(--panel2));color:var(--text)}
.character-chat-memory-intro{padding:14px 16px 7px;display:flex;align-items:center;justify-content:space-between}.character-chat-memory-intro>span{font-size:var(--font-size-label,15px);font-weight:750}.character-chat-memory-toggle{min-width:70px;height:36px;padding:0 10px;border:1px solid var(--border,var(--line));border-radius:999px;background:var(--bg,var(--panel2));color:var(--text-dim,var(--muted));font-size:var(--font-size-label,15px);font-weight:700;cursor:pointer}.character-chat-memory-toggle.is-on{border-color:color-mix(in srgb,var(--accent,var(--amber)) 55%,var(--border,var(--line)));background:color-mix(in srgb,var(--accent,var(--amber)) 13%,var(--bg,var(--panel2)));color:var(--accent,var(--amber))}
.character-chat-memory-help{margin:0;padding:0 16px 12px;color:var(--text-dim,var(--muted));font-size:var(--font-size-label,15px);line-height:1.55}.character-chat-memory-pop>label{display:block;padding:0 16px 7px;font-size:var(--font-size-label,15px);font-weight:700}.character-chat-memory-pop>textarea{display:block;width:calc(100% - 32px);height:230px;margin:0 16px;padding:11px 12px;resize:vertical;border:1px solid var(--border,var(--line));border-radius:8px;outline:0;background:var(--bg,var(--panel2));color:var(--text);font:inherit;font-size:var(--font-size-label,15px);line-height:1.65}.character-chat-memory-pop>textarea:focus{border-color:var(--accent,var(--amber))}.character-chat-memory-pop>textarea::placeholder{color:var(--text-dim,var(--muted))}
.character-chat-memory-error{margin:7px 16px 0;color:#bd3f3f;font-size:var(--font-size-label,15px);line-height:1.45}.character-chat-memory-pop>footer{min-height:56px;padding:8px 16px 12px;display:flex;align-items:center;justify-content:space-between;gap:10px}.character-chat-memory-pop>footer>span{min-width:0;color:var(--text-dim,var(--muted));font-size:var(--font-size-label,15px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.character-chat-memory-pop>footer>div{flex:0 0 auto;display:flex;gap:6px}.character-chat-memory-pop>footer button{height:36px;padding:0 10px;border:1px solid var(--border,var(--line));border-radius:7px;background:transparent;color:var(--text-dim,var(--muted));font-size:var(--font-size-label,15px);cursor:pointer}.character-chat-memory-pop>footer button:hover{border-color:#bd3f3f;color:#bd3f3f}.character-chat-memory-pop>footer button.is-refresh{border-color:color-mix(in srgb,var(--accent,var(--amber)) 45%,var(--border,var(--line)));color:var(--accent,var(--amber))}.character-chat-memory-pop>footer button.is-refresh:hover{background:color-mix(in srgb,var(--accent,var(--amber)) 10%,transparent);border-color:var(--accent,var(--amber));color:var(--accent,var(--amber))}.character-chat-memory-pop>footer button:disabled{opacity:.4;cursor:default}
.character-chat-appearance-settings.viewer-box{position:fixed;z-index:200;width:340px;max-width:calc(100vw - 16px);max-height:calc(100vh - 24px);overflow-y:auto;padding:4px 18px 14px;border:1px solid var(--border,var(--line,#cecac1));border-radius:12px;background:var(--bg-elev,var(--panel,#f7f6f2));color:var(--text,#25221e);box-shadow:0 18px 46px color-mix(in srgb,#000 32%,transparent)}
.character-chat-appearance-settings .viewer-head{position:relative;height:48px;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-label,15px);font-weight:700;cursor:move;user-select:none}.character-chat-appearance-settings .viewer-close{position:absolute;right:-10px;top:50%;width:36px;height:36px;padding:0;display:grid;place-items:center;transform:translateY(-50%);border:0;border-radius:8px;background:transparent;color:var(--text-dim,var(--muted));cursor:pointer}.character-chat-appearance-settings .viewer-close:hover{background:var(--bg,var(--panel2));color:var(--text)}.character-chat-appearance-settings .viewer-close svg{width:16px;height:16px}
.character-chat-appearance-settings .viewer-doc-scope{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;padding:9px 11px;border:1px solid var(--border,var(--line));border-radius:8px;background:var(--bg,var(--panel2))}.character-chat-appearance-settings .viewer-doc-scope b{flex:none;color:var(--accent,var(--amber));font-size:var(--font-size-label,15px)}.character-chat-appearance-settings .viewer-doc-scope span{color:var(--text-dim,var(--muted));font-size:var(--font-size-label,15px);text-align:right}
.character-chat-appearance-settings .viewer-row{display:flex;align-items:center;gap:10px;padding:11px 0;border-top:1px solid var(--border,var(--line))}.character-chat-appearance-settings .viewer-label{flex:0 0 70px;color:var(--text);font-size:var(--font-size-label,15px)}.character-chat-appearance-settings .palette-font{flex:1;min-width:0;height:36px;padding:0 8px;border:1px solid var(--border,var(--line));border-radius:6px;background:var(--bg,var(--panel2));color:var(--text);font-size:var(--font-size-label,15px)}
.character-chat-appearance-settings .stepper{flex:1;display:flex;gap:8px}.character-chat-appearance-settings .stepper button{width:44px;height:36px;flex:0 0 44px;padding:0;display:grid;place-items:center;border:1px solid var(--border,var(--line));border-radius:8px;background:transparent;color:var(--text);cursor:pointer}.character-chat-appearance-settings .stepper button:hover{border-color:var(--accent,var(--amber));background:var(--bg,var(--panel2));color:var(--accent,var(--amber))}.character-chat-appearance-settings .stepper button svg{width:15px;height:15px}.character-chat-appearance-settings .stepper-val{height:36px;flex:1;display:grid;place-items:center;border-radius:6px;background:var(--bg,var(--panel2));font-size:var(--font-size-label,15px)}
.character-chat-appearance-settings .color-chip{width:36px;height:36px;flex:0 0 36px;padding:0;border:1px solid var(--border,var(--line));border-radius:6px;background:transparent;cursor:pointer}.character-chat-appearance-settings .hex-input{height:36px;min-width:0;flex:1;padding:0 10px;border:1px solid var(--border,var(--line));border-radius:6px;background:var(--bg,var(--panel2));color:var(--text);font-size:var(--font-size-label,15px)}.character-chat-appearance-settings .viewer-themes{flex:1;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.character-chat-appearance-settings .theme-chip{height:36px;border:1px solid var(--border,var(--line));border-radius:6px;font-size:var(--font-size-label,15px);cursor:pointer}.character-chat-appearance-settings .theme-chip.sel{outline:2px solid var(--accent,var(--amber));outline-offset:1px}
.character-chat-appearance-settings .palette-reset{width:100%;margin-top:12px;padding:7px;border:0;border-radius:6px;background:var(--bg,var(--panel2));color:var(--text-dim,var(--muted));font-size:var(--font-size-label,15px);cursor:pointer}.character-chat-appearance-settings .palette-reset:hover{background:color-mix(in srgb,var(--accent,var(--amber)) 14%,var(--bg,var(--panel2)));color:var(--text)}.character-chat-appearance-settings .palette-reset:disabled{opacity:.45;cursor:default}
@media(max-width:700px){.shared-character-chat-column,.shared-character-chat-foot{padding-left:14px;padding-right:14px}.shared-character-chat-message.is-assistant{width:100%}.shared-character-chat-message.is-user{max-width:90%}.shared-character-chat-toolbar .character-chat-memory-button span{display:none}.shared-character-chat-toolbar .character-chat-memory-button{width:27px;padding:0;justify-content:center}.shared-character-chat-gate{align-items:stretch;flex-direction:column;gap:10px}.shared-character-chat-login{width:100%}.character-chat-memory-pop>textarea{height:190px}}
@container character-chat (max-width:360px){.shared-character-chat-column,.shared-character-chat-foot{padding-left:8px;padding-right:8px}.shared-character-chat-message.is-assistant{width:100%}.shared-character-chat-message.is-user{max-width:94%}.character-chat-card-head{padding:0 8px}.character-chat-card-body{padding:0 8px 8px}.character-chat-card-row,.character-chat-card.is-status>.character-chat-card-body,.character-chat-card.is-scene>.character-chat-card-body{grid-template-columns:1fr;gap:1px}.character-chat-profile{grid-template-columns:1fr}}

/* ── 도구 목록(공개 페이지 오른쪽 「대화 설정」 칸) — 기억·화면 단추가 한 줄씩 세로로(2026-09-05). */
.shared-character-chat-tools{display:flex;flex-direction:column;align-items:stretch;gap:2px;padding:2px 0}
.shared-character-chat-tools .character-chat-memory-button{width:100%;height:46px;padding:0 12px;display:inline-flex;align-items:center;gap:10px;border:0;border-radius:8px;background:transparent;color:var(--cc-fg,var(--text));font-size:var(--font-size-label);font-weight:700;cursor:pointer}
.shared-character-chat-tools .character-chat-memory-button:hover{background:color-mix(in srgb,var(--cc-fg) 7%,transparent)}
.shared-character-chat-tools .character-chat-memory-button.on{border-color:var(--cc-accent,var(--accent));color:var(--cc-accent,var(--accent))}
.shared-character-chat-tools .character-chat-memory-button svg{width:15px;height:15px}
.shared-character-chat-tools .character-chat-appearance-button{width:100%;height:46px;padding:0 12px;display:inline-flex;align-items:center;gap:10px;border:0;border-radius:8px;background:transparent;color:var(--cc-fg,var(--text));font-size:var(--font-size-label);font-weight:700;cursor:pointer}
.shared-character-chat-tools .character-chat-appearance-button:hover{background:color-mix(in srgb,var(--cc-fg) 7%,transparent)}
.shared-character-chat-tools .character-chat-appearance-button.on{border-color:var(--cc-accent,var(--accent));color:var(--cc-accent,var(--accent))}
.shared-character-chat-tools .character-chat-appearance-button svg{width:15px;height:15px}
.shared-character-chat-tools .theme-toggle{width:100%;height:46px;padding:0 12px;display:inline-flex;align-items:center;gap:10px;border-radius:8px;color:var(--cc-fg,var(--text))}
.shared-character-chat-tools .theme-toggle:hover{background:color-mix(in srgb,var(--cc-fg) 7%,transparent)}
/* 오른쪽 칸의 단추 줄(새 대화·수정하기) — 메모리·화면 설정 단추와 같은 46px 줄. */
.shared-character-chat-tool{width:100%;height:46px;padding:0 12px;display:inline-flex;align-items:center;gap:10px;border:0;border-radius:8px;background:transparent;color:var(--cc-fg,var(--text));font-size:var(--font-size-label);font-weight:700;text-decoration:none;cursor:pointer}
.shared-character-chat-tool:hover{background:color-mix(in srgb,var(--cc-fg) 7%,transparent)}
.shared-character-chat-tool:disabled{opacity:.4;cursor:default}
.shared-character-chat-tool svg{width:15px;height:15px}
/* 오른쪽 칸의 대화 목록 — 머리줄(개수)과 줄들은 옛 머리줄 팝업(.shared-character-chat-history-*)과 같은 부품. */
.shared-character-chat-sessions{margin-top:8px}