:root{
  --guri-green:#16a34a;
  --shadow:0 10px 30px rgba(0,0,0,.18);
}

/* 起動ボタン（右下ランチャー） */
.guri-chat-launcher{
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:2147483647;
  width:64px;
  height:64px;
  border-radius:50%;
  border:none;
  cursor:pointer;
  background:var(--guri-green)
    url('https://storage.googleapis.com/studio-design-asset-files/projects/4yqBrlBbqj/s-1024x1024_v-fs_webp_ce0e667c-6e4c-4535-816b-7eb36863c558.png')
    center/100% no-repeat;
  box-shadow:var(--shadow);
  transition:transform .18s, box-shadow .18s;
}
.guri-chat-launcher:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 40px rgba(0,0,0,.24);
}

/* チャット全体パネル */
.guri-chat{
  position:fixed;
  right:20px;
  bottom:96px;
  z-index:2147483647;
  width:360px;
  max-width:92vw;
  background:#fff;
  border-radius:24px;
  overflow:hidden;
  box-shadow:var(--shadow);
  display:none;
  flex-direction:column;
  border:1px solid #e6e9ee;
  font-family:"BIZ UDPゴシック", system-ui, -apple-system, sans-serif;
}

/* ヘッダー */
.guri-header{
  background:var(--guri-green);
  color:#fff;
  padding:18px 18px 16px;
  display:flex;
  align-items:center;
  gap:10px;
  position:relative;
}
.guri-avatar{
  width:46px;
  height:46px;
  border-radius:50%;
  background:#fff;
  overflow:hidden;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
}
.guri-avatar img{
  width:50px;
  height:50px;
  object-fit:contain;
}
.guri-title{
  font-weight:800;
  line-height:1.4;
  font-size:15.5px;
  color:#fff;
}
.guri-sub{
  font-size:12.5px;
  line-height:1.6;
  opacity:.95;
  color:#fff;
}

.guri-close{
  position:absolute;
  right:12px;
  top:10px;
  width:28px;
  height:28px;
  border-radius:50%;
  border:none;
  background:#fff;
  color:#111;
  font-size:18px;
  font-weight:700;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 1px 3px rgba(0,0,0,.15);
}
.guri-close:hover{
  background:#f1f5f9;
}

/* 本文（メッセージエリア） */
.guri-body{
  background:#f9fafb;
  padding:14px 12px;
  height:420px;
  overflow:auto;
}
.msg{
  display:flex;
  gap:10px;
  margin:8px 0;
}
.msg.agent{
  align-items:flex-start;
}
.msg.agent .avatar-col{
  width:56px;
  flex:0 0 56px;
  display:flex;
  justify-content:center;
}
.msg.agent .avatar-col img{
  width:56px;
  height:56px;
  border-radius:50%;
  object-fit:contain;
  background:#fff;
  border:1px solid #e2e8f0;
  box-shadow:0 2px 6px rgba(22,163,74,.12);
}
/* 「ボタンだけ」の行はアイコンを透明スペーサーに */
.msg.agent.noicon .avatar-col{
  visibility:hidden;
}

@media (max-width:768px){
  .msg.agent .avatar-col{
    width:48px;
    flex-basis:48px;
  }
  .msg.agent .avatar-col img{
    width:48px;
    height:48px;
  }
}

.agent .bubble{
  background:#eef7f1;
  border:1px solid #d9f1e1;
  color:#0b3b1e;
  border-radius:18px 18px 18px 8px;
  padding:12px 14px;
  max-width:78%;
  font-size:13px;
}
.user .bubble{
  background:#e8f3ff;
  border:1px solid #d5eaff;
  color:#0b2447;
  border-radius:18px 18px 8px 18px;
  padding:12px 14px;
  font-size:13px;
  margin-left:auto;
}
.msg.agent::before{
  content:none!important;
}

/* 入力中アニメ（…） */
.typing{
  display:flex;
  gap:4px;
  align-items:center;
  padding:8px 12px;
}
.dot{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#a3b6c9;
  opacity:.5;
  animation:blink 1s infinite;
}
.dot:nth-child(2){ animation-delay:.15s; }
.dot:nth-child(3){ animation-delay:.3s; }
@keyframes blink{
  0%,80%,100%{ opacity:.3; }
  40%{ opacity:1; }
}

/* フッター（クイックボタン＋入力欄） */
.guri-footer{
  border-top:1px solid #e6e9ee;
  background:#fff;
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:10px 12px 12px;
}
.quick{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:8px;
}
.chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:44px;
  padding:10px 12px;
  background:#f1f5f9;
  border:1px solid #e2e8f0;
  border-radius:999px;
  font-size:13px;
  line-height:1.35;
  cursor:pointer;
  width:100%;
  text-decoration:none;
  text-align:center;
  color:inherit;
  transition:background-color .15s ease, border-color .15s ease, color .15s ease;
  box-sizing:border-box;
  white-space:normal;
}
.chip:hover{
  background:#dcfce7;
  border-color:#16a34a;
  color:#065f46;
}

.guri-input{
  display:flex;
  gap:8px;
}
.guri-input input{
  flex:1;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid #dadfea;
  font-size:14px;
}
.guri-input input:focus{
  border-color:#16a34a;
  outline:none;
}
.guri-input button{
  padding:10px 14px;
  border-radius:12px;
  background:#16a34a;
  color:#fff;
  font-weight:700;
  border:none;
  cursor:pointer;
  white-space:nowrap;
}
.guri-input button:hover{
  filter:brightness(1.05);
}

@media (max-width:768px){
  .guri-chat{
    max-height:92vh;
    right:12px;
    left:12px;
    bottom:12px;
  }
}

.guri-disclaimer{
font-size:10px;
color:#6b7280; /* gray-500 */
text-align:center;
line-height:1.4;
padding:2px 4px 0;
margin-top:-2px;
user-select:none;
}

.guri-chat-launcher.is-open{
  background:#f9fafb;
  background-image:none;
  color:#111827;
  font-size:28px;
  font-weight:700;
  display:flex;
  align-items:center;
  justify-content:center;
}

/* YES / NO ボタンのスマホ最適化 */
.yn-buttons {
  display: flex;
  flex-direction: column;   /* 縦並び */
  gap: 8px;
  width: 100%;
}

.yn-buttons .chip {
  width: 100%;              /* 横幅100% */
  padding: 12px 16px;
  font-size: 16px;
  border-radius: 8px;
  text-align: center;
  cursor: pointer;
  border: none;
}

/* YES：緑 */
.yn-buttons .chip[data-yn="yes"] {
  background-color: #3ccf63;      /* 明るい緑 */
  color: #fff;
  font-weight: 600;
}

/* NO：グレー */
.yn-buttons .chip[data-yn="no"] {
  background-color: #dcdcdc;
  color: #333;
  font-weight: 500;
}

/* ホバー（PC用） */
.yn-buttons .chip[data-yn="yes"]:hover {
  background-color: #34b858;
}

.yn-buttons .chip[data-yn="no"]:hover {
  background-color: #c4c4c4;
}

/* ===== チャット起動ヒント（吹き出し） ===== */
.guri-chat-hint{
  position: fixed;
  right: 96px;
  bottom: 32px;
  background: #ffffff;
  color: #111;
  font-size: 13px;
  line-height: 1.4;
  padding: 10px 12px;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.15);
  z-index:2147483646; /* ランチャーより1下げる */
  max-width: 180px;
  display: none;
}

/* 三角 */
.guri-chat-hint::after{
  content:'';
  position:absolute;
  right:-6px;
  bottom:14px;
  border-width:6px;
  border-style:solid;
  border-color:transparent transparent transparent #fff;
}
