/* 261011 — 게시물 챗봇 "키쿰이" (blog.css 다크 테마 변수 재사용)
   주의: 버블의 펄스 애니메이션은 keyframe to를 transform:none으로 마감
   (animation-fill-mode: forwards + transform 잔존 금지 — containing block 생성 방지).
   패널은 버블의 형제 요소로 배치 (transform 애니메이션 요소의 fixed 자손 금지). */

.kikum-bubble{
  position:fixed;right:24px;bottom:24px;z-index:110;
  width:56px;height:56px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--accent);border:none;cursor:pointer;
  box-shadow:0 4px 20px rgba(212,255,58,.28), 0 1px 4px rgba(0,0,0,.4);
  animation:kikum-pulse 2.6s ease-in-out infinite;
  transition:box-shadow .2s;
}
.kikum-bubble:hover{box-shadow:0 6px 26px rgba(212,255,58,.45), 0 2px 6px rgba(0,0,0,.5)}
.kikum-bubble:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
@keyframes kikum-pulse{
  0%{transform:none}
  50%{transform:scale(1.05)}
  100%{transform:none}
}
.kikum-eye{animation:kikum-blink 4s ease-in-out infinite}
@keyframes kikum-blink{
  0%,92%,100%{opacity:1}
  95%{opacity:.15}
}

.kikum-panel{
  position:fixed;right:24px;bottom:96px;z-index:120;
  width:360px;max-width:calc(100vw - 32px);
  height:min(72vh,680px);   /* 261011 수직 확대 (기존: 콘텐츠 기준 ~460px) */
  display:flex;flex-direction:column;
  background:var(--bg-2);border:1px solid var(--line-2);border-radius:14px;
  box-shadow:0 12px 48px rgba(0,0,0,.55);
  opacity:0;visibility:hidden;transform:translateY(12px);
  transition:opacity .22s ease,transform .22s ease,visibility .22s;
}
.kikum-panel.open{opacity:1;visibility:visible;transform:none}

.kikum-head{
  display:flex;align-items:center;gap:12px;
  padding:14px 16px;border-bottom:1px solid var(--line);
}
.kikum-head-text{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.kikum-head-text strong{font-family:'Archivo',sans-serif;font-size:16px;letter-spacing:-0.01em}
.kikum-head-text span{font-size:11.5px;color:var(--ink-mute);line-height:1.4}
.kikum-close{
  width:28px;height:28px;border-radius:8px;flex-shrink:0;
  background:transparent;border:1px solid var(--line-2);color:var(--ink-mute);
  font-size:12px;cursor:pointer;transition:all .15s;
}
.kikum-close:hover{border-color:var(--accent);color:var(--accent)}

.kikum-msgs{
  flex:1;min-height:0;overflow-y:auto;padding:16px;   /* 261011 — 고정 340px → flex 확장(헤더·입력행 고정) */
  display:flex;flex-direction:column;gap:12px;
}
.kikum-msg{max-width:86%;padding:10px 13px;border-radius:12px;font-size:13.5px;line-height:1.6}
.kikum-msg.user{
  align-self:flex-end;background:var(--accent);color:#000;
  border-bottom-right-radius:4px;white-space:pre-wrap;word-break:break-word;
}
.kikum-msg.bot{
  align-self:flex-start;background:var(--bg);border:1px solid var(--line);
  border-bottom-left-radius:4px;
}
.kikum-msg.bot :first-child{margin-top:0}
.kikum-msg.bot :last-child{margin-bottom:0}
.kikum-msg.bot p{margin:0 0 8px}
.kikum-msg.bot ul,.kikum-msg.bot ol{margin:0 0 8px;padding-left:18px}
.kikum-msg.bot code{font-family:'JetBrains Mono',monospace;font-size:.85em;background:#1a1a1a;border:1px solid var(--line);padding:1px 5px;border-radius:4px}
.kikum-msg.bot pre{background:#0D0D0D;border:1px solid var(--line);padding:10px;border-radius:6px;overflow-x:auto;font-size:12px}
.kikum-msg.bot a{color:var(--accent)}
.kikum-msg.err{align-self:stretch;text-align:center;background:transparent;border:1px dashed var(--warn);color:var(--warn);font-size:12.5px}
.kikum-loading{
  align-self:flex-start;display:flex;align-items:center;gap:8px;
  font-size:12.5px;color:var(--ink-mute);padding:4px 2px;
}
.kikum-loading .kikum-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);animation:kikum-bounce 1s ease-in-out infinite}
.kikum-loading .kikum-dot:nth-child(2){animation-delay:.15s}
.kikum-loading .kikum-dot:nth-child(3){animation-delay:.3s}
@keyframes kikum-bounce{
  0%,100%{transform:none;opacity:.4}
  50%{transform:translateY(-4px);opacity:1}
}

.kikum-form{display:flex;gap:8px;padding:12px;border-top:1px solid var(--line)}

/* 261011 — 게시물별 추천 질문 칩 (입력창 위 수직 슬라이드 리스트)
   가로 스크롤 행 → 세로 스택 + 세로 전용 스크롤 (agent_chat.html qq-chips 패턴 준수)
   애니메이션 미사용 — forwards+transform 규칙 회피 */
.kikum-sugs{display:none;flex-direction:column;gap:6px;padding:8px 12px 6px;border-top:1px solid var(--line)}
.kikum-sugs.on{display:flex}
.kikum-sugs-toggle{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  width:100%;padding:0;background:transparent;border:none;cursor:pointer;
  font-family:inherit;text-align:left;
}
.kikum-sugs-label{font-size:11px;color:var(--ink-mute);letter-spacing:.01em}
.kikum-sugs-arrow{font-size:9px;color:var(--ink-mute);transition:transform .15s}
.kikum-sugs-toggle:hover .kikum-sugs-label,
.kikum-sugs-toggle:hover .kikum-sugs-arrow{color:var(--accent)}
.kikum-sugs-toggle:focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-radius:4px}
/* 접힘 — 라벨만 남아 패널 공간 확보 */
.kikum-sugs.collapsed .kikum-sug-row{display:none}
.kikum-sug-row{
  display:flex;flex-direction:column;gap:8px;
  max-height:min(34vh,230px);overflow-y:auto;padding-bottom:2px;
  scrollbar-width:thin;
}
.kikum-sug-row::-webkit-scrollbar{width:5px}
.kikum-sug-row::-webkit-scrollbar-track{background:transparent}
.kikum-sug-row::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:3px}
.kikum-sug-row::-webkit-scrollbar-thumb:hover{background:var(--ink-mute)}
.kikum-sug{
  width:100%;text-align:left;
  white-space:normal;overflow-wrap:anywhere;line-height:1.45;
  background:var(--bg);border:1px solid var(--line-2);color:var(--ink);
  font-family:inherit;font-size:12.5px;padding:6px 12px;border-radius:999px;cursor:pointer;
  transition:border-color .15s,color .15s;
}
.kikum-sug:hover{border-color:var(--accent);color:var(--accent)}
.kikum-sug:active{background:rgba(212,255,58,.12)}
.kikum-sug[disabled]{opacity:.45;cursor:default;pointer-events:none}
/* 대화 빈 초기 상태 — 메시지 영역 세로 리스트 (칩 스타일은 베이스 .kikum-sug와 통일) */
.kikum-sug-block{
  display:flex;flex-direction:column;gap:8px;align-self:stretch;
  padding:12px;border:1px dashed var(--line-2);border-radius:12px;
}
.kikum-sug-block-head{font-size:11.5px;color:var(--ink-mute)}

.kikum-form textarea{
  flex:1;resize:none;max-height:110px;min-height:40px;
  background:var(--bg);border:1px solid var(--line-2);border-radius:10px;
  color:var(--ink);font-family:inherit;font-size:13.5px;line-height:1.5;padding:10px 12px;
}
.kikum-form textarea::placeholder{color:var(--ink-mute)}
.kikum-form textarea:focus{outline:none;border-color:var(--accent)}
.kikum-send{
  width:40px;height:40px;flex-shrink:0;border-radius:10px;border:none;cursor:pointer;
  background:var(--accent);color:#000;font-size:16px;font-weight:700;
  transition:background .15s;
}
.kikum-send:hover{background:#fff}
.kikum-send[disabled]{opacity:.5;cursor:default}

.kikum-toast{
  position:fixed;left:50%;bottom:96px;z-index:130;
  transform:translateX(-50%) translateY(8px);opacity:0;pointer-events:none;
  background:#1A1A1A;color:var(--ink);border:1px solid var(--warn);
  padding:10px 18px;border-radius:10px;font-size:13px;
  transition:opacity .25s,transform .25s;max-width:calc(100vw - 48px);
}
.kikum-toast.on{opacity:1;transform:translateX(-50%) translateY(0)}

@media (max-width:480px){
  .kikum-bubble{right:16px;bottom:16px}
  /* 261011 — 바텀시트 85dvh (100vh 주소창 문제 회피), safe-area 입력행 패딩 */
  .kikum-panel{
    left:0;right:0;bottom:0;width:auto;max-width:none;
    height:85vh;height:85dvh;border-radius:14px 14px 0 0;
  }
  .kikum-form{padding-bottom:calc(12px + env(safe-area-inset-bottom))}
  .kikum-sug{max-width:100%}
}