.rvwc {
  position: fixed;
  left: 24px;
  right: auto;
  bottom: 22px;
  z-index: 99999;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif;
  transition: transform 1.8s ease-in-out;
  will-change: transform;
}
.rvwc.rvwc-right { right: 24px; left: auto; }
.rvwc.rvwc-left { left: 24px; right: auto; }
.rvwc.rvwc-docked { transform: translate3d(0,0,0) !important; }

.rvwc-sparkles {
  position: absolute;
  left: -18px;
  bottom: 2px;
  width: 165px;
  height: 135px;
  pointer-events: none;
  overflow: visible;
  z-index: 0;
}
.rvwc-cat, .rvwc-panel { position: relative; z-index: 2; }
.rvwc-sparkles span {
  position: absolute;
  display: block;
  color: #fff8d5;
  text-shadow: 0 0 6px rgba(255,255,255,.9), 0 0 14px rgba(255,219,114,.85), 0 0 24px rgba(255,211,92,.45);
  filter: drop-shadow(0 0 4px rgba(255,218,110,.65));
  opacity: .88;
  transform-origin: center;
  animation: rvwc-twinkle 2.8s ease-in-out infinite;
}
.rvwc-sparkles span:nth-child(1) { left: 10px; bottom: 22px; font-size: 16px; animation-delay: .1s; }
.rvwc-sparkles span:nth-child(2) { left: 20px; bottom: 82px; font-size: 12px; animation-delay: .8s; }
.rvwc-sparkles span:nth-child(3) { left: 58px; bottom: 104px; font-size: 18px; animation-delay: 1.2s; }
.rvwc-sparkles span:nth-child(4) { left: 102px; bottom: 96px; font-size: 14px; animation-delay: .35s; }
.rvwc-sparkles span:nth-child(5) { left: 122px; bottom: 54px; font-size: 12px; animation-delay: 1.6s; }
.rvwc-sparkles span:nth-child(6) { left: 138px; bottom: 18px; font-size: 18px; animation-delay: 2s; }
.rvwc-sparkles span:nth-child(7) { left: 78px; bottom: 10px; font-size: 13px; animation-delay: .55s; }
.rvwc-sparkles span:nth-child(8) { left: 46px; bottom: 52px; font-size: 11px; animation-delay: 1.95s; }
.rvwc.rvwc-walking .rvwc-sparkles span {
  animation-duration: 1.8s;
  opacity: 1;
}
.rvwc.rvwc-talking .rvwc-sparkles span {
  animation-duration: 2.2s;
}
@keyframes rvwc-twinkle {
  0%, 100% { opacity: .35; transform: translate3d(0,0,0) scale(.75) rotate(0deg); }
  25% { opacity: .95; transform: translate3d(2px,-3px,0) scale(1.06) rotate(10deg); }
  50% { opacity: .65; transform: translate3d(-2px,-8px,0) scale(.88) rotate(-8deg); }
  75% { opacity: 1; transform: translate3d(1px,-4px,0) scale(1.18) rotate(14deg); }
}

.rvwc-cat {
  position: relative;
  width: 112px;
  height: 112px;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.22));
  transition: transform .35s ease;
}
.rvwc-cat:hover { transform: translateY(-4px) scale(1.03); }
.rvwc-cat-img {
  width: 112px;
  height: 112px;
  object-fit: contain;
  display: block;
  pointer-events: none;
  transition: transform .5s ease;
}
.rvwc.rvwc-face-right .rvwc-cat-img { transform: scaleX(-1); }
.rvwc-bubble {
  position: absolute;
  left: 76px;
  bottom: 74px;
  white-space: nowrap;
  background: linear-gradient(135deg,#fffaf3,#ffffff);
  color: #33251c;
  border: 1px solid rgba(177,130,72,.28);
  border-radius: 999px;
  padding: 8px 12px;
  box-shadow: 0 10px 25px rgba(0,0,0,.12);
  font-size: 13px;
  line-height: 1.2;
  pointer-events: none;
}
.rvwc-bubble:after {
  content: "";
  position: absolute;
  left: -7px;
  bottom: 10px;
  border-right: 8px solid #fff;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
}
.rvwc.rvwc-right .rvwc-bubble { left: auto; right: 76px; }
.rvwc.rvwc-right .rvwc-bubble:after {
  left: auto;
  right: -7px;
  border-right: 0;
  border-left: 8px solid #fff;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
}
.rvwc-panel {
  position: absolute;
  left: 0;
  right: auto;
  bottom: 128px;
  width: min(360px, calc(100vw - 28px));
  max-height: min(560px, calc(100vh - 160px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 22px;
  background: rgba(255,255,255,.98);
  border: 1px solid rgba(177,130,72,.25);
  box-shadow: 0 18px 60px rgba(0,0,0,.22);
}
.rvwc.rvwc-right .rvwc-panel { right: 0; left: auto; }
.rvwc-panel[hidden] { display: none; }
.rvwc-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  background: linear-gradient(135deg,#241811,#5a3b22);
  color: #fff;
}
.rvwc-header strong { display: block; font-size: 15px; }
.rvwc-header span { display: block; font-size: 12px; opacity: .78; margin-top: 2px; }
.rvwc-close {
  width: 32px;
  height: 32px;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  color: #fff;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.rvwc-messages {
  padding: 16px;
  overflow-y: auto;
  min-height: 190px;
  max-height: 360px;
  background: linear-gradient(180deg,#fffaf3 0%, #fff 48%, #fff 100%);
}
.rvwc-msg {
  width: fit-content;
  max-width: 88%;
  padding: 10px 12px;
  border-radius: 16px;
  margin: 0 0 10px;
  font-size: 14px;
  line-height: 1.65;
  word-break: break-word;
}
.rvwc-msg-bot {
  background: #fff;
  color: #33251c;
  border: 1px solid rgba(177,130,72,.18);
  box-shadow: 0 6px 16px rgba(0,0,0,.06);
}
.rvwc-msg-user {
  margin-left: auto;
  background: #1f2937;
  color: #fff;
}
.rvwc-form {
  display: flex;
  gap: 8px;
  padding: 12px;
  border-top: 1px solid rgba(177,130,72,.18);
  background: #fff;
}
.rvwc-input {
  flex: 1;
  min-width: 0;
  border: 1px solid rgba(80,50,30,.22);
  border-radius: 999px;
  padding: 10px 13px;
  font-size: 14px;
}
.rvwc-send {
  border: 0;
  border-radius: 999px;
  padding: 10px 16px;
  background: #b8863b;
  color: #fff;
  font-weight: 700;
  cursor: pointer;
}
.rvwc-send:disabled { opacity: .55; cursor: wait; }
.rvwc.rvwc-walking .rvwc-cat { animation: rvwc-cat-bob .9s ease-in-out infinite; }
.rvwc.rvwc-talking .rvwc-cat { animation: rvwc-talk .9s ease-in-out infinite; }
@keyframes rvwc-cat-bob {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}
@keyframes rvwc-talk {
  0%, 100% { transform: translateY(0) rotate(0); }
  50% { transform: translateY(-3px) rotate(-1deg); }
}
@media (prefers-reduced-motion: reduce) {
  .rvwc { transition: none; }
  .rvwc.rvwc-walking .rvwc-cat,
  .rvwc.rvwc-talking .rvwc-cat { animation: none; }
}
@media (max-width: 640px) {
  .rvwc.rvwc-left { left: 12px; bottom: 12px; }
  .rvwc-sparkles { left: -10px; bottom: 0; width: 128px; height: 110px; }
  .rvwc-sparkles span:nth-child(1) { left: 8px; bottom: 16px; }
  .rvwc-sparkles span:nth-child(2) { left: 14px; bottom: 66px; }
  .rvwc-sparkles span:nth-child(3) { left: 42px; bottom: 84px; }
  .rvwc-sparkles span:nth-child(4) { left: 78px; bottom: 74px; }
  .rvwc-sparkles span:nth-child(5) { left: 94px; bottom: 40px; }
  .rvwc-sparkles span:nth-child(6) { left: 106px; bottom: 14px; }
  .rvwc-sparkles span:nth-child(7) { left: 58px; bottom: 6px; }
  .rvwc-sparkles span:nth-child(8) { left: 30px; bottom: 38px; }
  .rvwc.rvwc-right { right: 12px; bottom: 12px; }
  .rvwc-cat, .rvwc-cat-img { width: 86px; height: 86px; }
  .rvwc-bubble { left: 58px; bottom: 58px; font-size: 12px; padding: 7px 10px; }
  .rvwc.rvwc-right .rvwc-bubble { right: 58px; }
  .rvwc-panel { bottom: 104px; width: calc(100vw - 24px); max-height: calc(100vh - 124px); }
}

.rvwc-msg-sleeping {
  background: linear-gradient(135deg,#fffaf3 0%,#ffffff 100%);
  border: 1px solid rgba(184,134,59,.28);
  box-shadow: 0 8px 22px rgba(80,50,30,.08);
}
.rvwc-sleeping-title {
  font-weight: 700;
  color: #4a321d;
  margin-bottom: 4px;
}
.rvwc-sleeping-text {
  color: #6b4a2f;
  font-size: 13px;
  line-height: 1.65;
}


/* v0.3.4: protect chat input from theme/button CSS conflicts */
.rvwc,
.rvwc * {
  box-sizing: border-box;
}
.rvwc .rvwc-form {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 12px !important;
}
.rvwc .rvwc-form .rvwc-input,
.rvwc .rvwc-form input.rvwc-input[type="text"] {
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  display: block !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  border: 1px solid rgba(80,50,30,.22) !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: #33251c !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  box-shadow: none !important;
  outline: none;
}
.rvwc .rvwc-form .rvwc-input:focus,
.rvwc .rvwc-form input.rvwc-input[type="text"]:focus {
  border-color: rgba(184,134,59,.65) !important;
  box-shadow: 0 0 0 3px rgba(184,134,59,.12) !important;
}
.rvwc .rvwc-form .rvwc-send,
.rvwc .rvwc-form button.rvwc-send[type="submit"] {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 86px !important;
  max-width: none !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #b8863b !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-decoration: none !important;
  letter-spacing: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}
.rvwc .rvwc-form .rvwc-send:hover,
.rvwc .rvwc-form button.rvwc-send[type="submit"]:hover {
  background: #a87935 !important;
  color: #fff !important;
}
.rvwc .rvwc-form .rvwc-send:disabled,
.rvwc .rvwc-form button.rvwc-send[type="submit"]:disabled {
  opacity: .55 !important;
  cursor: wait !important;
}
@media (max-width: 420px) {
  .rvwc .rvwc-form { gap: 8px !important; }
  .rvwc .rvwc-form .rvwc-send,
  .rvwc .rvwc-form button.rvwc-send[type="submit"] {
    min-width: 74px !important;
    padding: 0 14px !important;
  }
}

/* v0.3.5: mobile chat panel width adjustment
   PC display remains unchanged. On smartphones, only the chat panel becomes narrower. */
@media (max-width: 640px) {
  #rayverse-wing-cat.rvwc .rvwc-panel {
    width: min(300px, calc(100vw - 56px)) !important;
    max-width: min(300px, calc(100vw - 56px)) !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  #rayverse-wing-cat.rvwc.rvwc-left .rvwc-panel {
    left: 0 !important;
    right: auto !important;
  }

  #rayverse-wing-cat.rvwc.rvwc-right .rvwc-panel {
    right: 0 !important;
    left: auto !important;
  }
}