/* 右下角 AI 对话窗口（两种主题通用，颜色取自主题变量） */
.kc {
  --kc-pink: var(--accent, #f3a5c4);
  --kc-lav: var(--accent-2, #c3a6ee);
  position: fixed; right: 22px; bottom: calc(22px + env(safe-area-inset-bottom, 0px)); z-index: 90;
  font-family: 'Noto Sans SC', system-ui, sans-serif;
}
.kc [hidden] { display: none !important; }

.kc-launcher {
  position: relative; display: block; width: 68px; height: 68px; padding: 0; border: 0; border-radius: 50%;
  background: #f7f1f4; cursor: pointer; box-shadow: 0 10px 30px -8px rgba(0, 0, 0, .6), 0 0 0 3px rgba(13, 10, 28, .9);
  transition: transform .25s;
}
.kc-launcher:hover { transform: translateY(-3px); }
.kc-launcher:focus-visible { outline: 2px solid var(--kc-pink); outline-offset: 4px; }
.kc-launcher img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; object-position: center 30%; }
.kc-launcher-ring {
  position: absolute; inset: -6px; border-radius: 50%; pointer-events: none;
  background: conic-gradient(from 0deg, var(--kc-pink), transparent 35%, var(--kc-lav) 60%, transparent 85%, var(--kc-pink));
  -webkit-mask: radial-gradient(circle, transparent 36px, #000 37px);
  mask: radial-gradient(circle, transparent 36px, #000 37px);
  animation: kc-spin 6s linear infinite;
}
.kc-launcher-dot { position: absolute; right: 2px; bottom: 4px; width: 14px; height: 14px; border-radius: 50%; background: #5be3a6; border: 3px solid #0d0a1c; }
.kc.is-open .kc-launcher-ring { animation-duration: 2s; }
@keyframes kc-spin { to { transform: rotate(360deg); } }

.kc-hint {
  position: absolute; right: 4px; bottom: 84px; display: flex; align-items: center; gap: 10px; white-space: nowrap;
  padding: 10px 12px 10px 16px; font-size: 13px; color: #f6f0f8; cursor: pointer;
  background: rgba(20, 15, 40, .95); border: 1px solid rgba(243, 165, 196, .4);
  box-shadow: 0 10px 30px -10px rgba(0, 0, 0, .6); animation: kc-pop .35s ease-out;
}
.kc-hint::after { content: ''; position: absolute; right: 26px; bottom: -6px; width: 10px; height: 10px; background: inherit; border-right: 1px solid rgba(243, 165, 196, .4); border-bottom: 1px solid rgba(243, 165, 196, .4); transform: rotate(45deg); }
.kc-hint-x { border: 0; background: none; color: #a99fc0; font-size: 16px; line-height: 1; cursor: pointer; padding: 0 2px; }
@keyframes kc-pop { from { opacity: 0; transform: translateY(8px); } }

.kc-panel {
  position: absolute; right: 0; bottom: 86px; width: 370px; height: min(560px, calc(100vh - 140px));
  display: flex; flex-direction: column; overflow: hidden;
  background: rgba(16, 12, 34, .95); border: 1px solid rgba(243, 165, 196, .3);
  box-shadow: 0 30px 80px -20px rgba(0, 0, 0, .8);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  animation: kc-pop .3s ease-out; color: #f6f0f8;
}
.kc-panel::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: var(--kc-art) no-repeat right -70px top 30px / 80% auto;
  opacity: .14;
  mask-image: linear-gradient(to bottom, transparent 4%, #000 30%, #000 70%, transparent 96%);
  -webkit-mask-image: linear-gradient(to bottom, transparent 4%, #000 30%, #000 70%, transparent 96%);
}
.kc-head, .kc-log, .kc-suggest, .kc-form { position: relative; z-index: 1; }
.kc-head {
  display: flex; align-items: center; gap: 12px; padding: 14px 16px;
  background: linear-gradient(100deg, rgba(243, 165, 196, .16), rgba(195, 166, 238, .06));
  border-bottom: 1px solid rgba(243, 165, 196, .2);
}
.kc-avatar { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; background: #f7f1f4; border: 2px solid rgba(255, 255, 255, .8); }
.kc-who { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.kc-who strong { font-family: 'Shippori Mincho B1', 'Noto Serif SC', serif; font-size: 17px; letter-spacing: .1em; }
.kc-status { display: flex; align-items: center; gap: 6px; font-family: 'Montserrat', sans-serif; font-size: 10px; letter-spacing: .25em; color: #a99fc0; }
.kc-status i { width: 6px; height: 6px; border-radius: 50%; background: #5be3a6; box-shadow: 0 0 6px #5be3a6; }
.kc-close { border: 0; background: none; color: #a99fc0; font-size: 22px; line-height: 1; cursor: pointer; padding: 4px 6px; }
.kc-close:hover { color: #fff; }

.kc-log { flex: 1; overflow-y: auto; padding: 18px 16px; display: flex; flex-direction: column; gap: 12px; overscroll-behavior: contain; }
.kc-msg { display: flex; max-width: 85%; }
.kc-msg p { margin: 0; padding: 10px 14px; font-size: 14px; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; }
.kc-assistant { align-self: flex-start; }
.kc-assistant p { background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .08); border-radius: 2px 14px 14px 14px; }
.kc-user { align-self: flex-end; }
.kc-user p { color: #1a1030; background: linear-gradient(110deg, var(--kc-pink), var(--kc-lav)); border-radius: 14px 2px 14px 14px; }
.kc-error p { border-color: rgba(255, 110, 140, .5); color: #ffd0dc; }
.kc-typing p { display: flex; gap: 5px; padding: 14px 16px; }
.kc-typing i { width: 6px; height: 6px; border-radius: 50%; background: #c9bde0; animation: kc-dot 1s ease-in-out infinite; }
.kc-typing i:nth-child(2) { animation-delay: .15s; }
.kc-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes kc-dot { 50% { transform: translateY(-4px); opacity: .4; } }

.kc-suggest { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 16px 12px; }
.kc-suggest button {
  padding: 6px 12px; font: inherit; font-size: 12px; color: #f6f0f8; cursor: pointer;
  background: transparent; border: 1px solid rgba(243, 165, 196, .4); border-radius: 999px; transition: background .2s;
}
.kc-suggest button:hover { background: rgba(243, 165, 196, .15); }

.kc-form { display: flex; gap: 8px; padding: 12px; border-top: 1px solid rgba(255, 255, 255, .08); }
.kc-form input { flex: 1; min-width: 0; padding: 10px 14px; font: inherit; font-size: 14px; color: #f6f0f8; background: rgba(0, 0, 0, .35); border: 1px solid rgba(255, 255, 255, .12); border-radius: 999px; outline: none; }
.kc-form input:focus { border-color: var(--kc-pink); }
.kc-form button { flex: none; width: 42px; height: 42px; display: grid; place-items: center; border: 0; border-radius: 50%; cursor: pointer; background: linear-gradient(120deg, var(--kc-pink), var(--kc-lav)); }
.kc-form button svg { width: 18px; height: 18px; fill: #1a1030; }

@media (max-width: 640px) {
  .kc { right: 14px; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); }
  .kc-launcher { width: 58px; height: 58px; }
  .kc-launcher-ring { -webkit-mask: radial-gradient(circle, transparent 31px, #000 32px); mask: radial-gradient(circle, transparent 31px, #000 32px); }
  .kc-panel { position: fixed; left: 10px; right: 10px; bottom: calc(84px + env(safe-area-inset-bottom, 0px)); width: auto; height: min(70vh, 560px); }
  .kc-hint { bottom: 72px; }
}
@media (prefers-reduced-motion: reduce) {
  .kc *, .kc *::before, .kc *::after { animation: none !important; }
}