/* ==========================================================================
   やねまるチャット（ボタン選択式・シナリオ型） v1
   - LLM不使用。知識ベース(data/chat-kb.md)由来の定型文のみを表示する
   - z-index: FAB=75(fixbar70の上・同意バナー9999の下) / パネル=9991
   - 表情画像: img/mascot/*.svg（切り替えはJSがsrc差し替え）
   ========================================================================== */

/* ---- 起動ボタン（FAB） ---- */
.ym-fab{
  position:fixed;right:14px;bottom:20px;z-index:75;
  width:60px;height:60px;border-radius:50%;
  background:#fff;border:2px solid var(--key,#1E6FA8);
  box-shadow:0 6px 20px rgba(11,29,44,.25);
  cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;
  transition:transform .2s;
}
.ym-fab:hover{transform:scale(1.06)}
.ym-fab:focus-visible{outline:3px solid var(--key,#1E6FA8);outline-offset:3px}
.ym-fab img{width:44px;height:44px;display:block}
.ym-fab .ym-fab-label{
  position:absolute;top:-8px;left:-6px;background:var(--key,#1E6FA8);color:#fff;
  font-size:10px;font-weight:800;letter-spacing:.06em;padding:3px 8px;border-radius:999px;
  box-shadow:0 2px 6px rgba(11,29,44,.25);pointer-events:none;
}
/* fixbar(モバイル固定CTA)が見えている時はその上に退避 */
.ym-fab.ym-above-fixbar{bottom:76px}

/* ---- パネル ---- */
.ym-panel{
  position:fixed;right:8px;bottom:8px;z-index:9991;
  width:min(392px,calc(100vw - 16px));
  max-height:min(560px,calc(100dvh - 24px));
  display:flex;flex-direction:column;
  background:var(--paper,#fff);border:1px solid var(--line,#DFE9F0);border-radius:16px;
  box-shadow:0 12px 40px rgba(11,29,44,.3);
  overflow:hidden;
}
.ym-panel[hidden]{display:none}

/* ヘッダー */
.ym-head{
  display:flex;align-items:center;gap:10px;padding:10px 12px;
  background:var(--key,#1E6FA8);color:#fff;flex:none;
}
.ym-head img{width:36px;height:36px;background:#fff;border-radius:50%;padding:2px;flex:none}
.ym-head .ym-title{min-width:0;line-height:1.3}
.ym-head .ym-title b{display:block;font-size:14px;letter-spacing:.02em}
.ym-head .ym-title small{display:block;font-size:10px;opacity:.85}
.ym-close{
  margin-left:auto;flex:none;width:36px;height:36px;border:0;border-radius:50%;
  background:rgba(255,255,255,.15);color:#fff;font-size:18px;line-height:1;cursor:pointer;
}
.ym-close:hover{background:rgba(255,255,255,.28)}
.ym-close:focus-visible{outline:2px solid #fff;outline-offset:2px}

/* 会話ログ */
.ym-log{
  flex:1;overflow-y:auto;padding:14px 12px;display:flex;flex-direction:column;gap:10px;
  background:var(--base,#F7F9FB);overscroll-behavior:contain;
}
.ym-row{display:flex;gap:8px;align-items:flex-end}
.ym-row.ym-user{justify-content:flex-end}
.ym-row .ym-ava{width:30px;height:30px;flex:none}
.ym-bubble{
  max-width:82%;padding:10px 13px;border-radius:14px;font-size:13.5px;line-height:1.8;
  white-space:pre-line;word-break:break-word;
}
.ym-row.ym-bot .ym-bubble{background:#fff;border:1px solid var(--line,#DFE9F0);border-bottom-left-radius:4px;color:var(--ink,#16303F)}
.ym-row.ym-user .ym-bubble{background:var(--key,#1E6FA8);color:#fff;border-bottom-right-radius:4px;font-weight:700;font-size:13px}
.ym-bubble .ym-note{display:block;margin-top:6px;font-size:11.5px;color:var(--muted,#5A6E7A)}
.ym-bubble a.ym-link{
  display:inline-block;margin:8px 6px 0 0;padding:7px 12px;border:1px solid var(--key,#1E6FA8);
  border-radius:999px;color:var(--key-d,#175A88);font-size:12px;font-weight:800;text-decoration:none;
}
.ym-bubble a.ym-link:hover{background:var(--key-t,#E1EEF7)}

/* 選択肢チップ */
.ym-choices{
  flex:none;display:flex;flex-wrap:wrap;gap:8px;padding:10px 12px;
  border-top:1px solid var(--line,#DFE9F0);background:var(--paper,#fff);
  max-height:180px;overflow-y:auto;
}
.ym-chip{
  border:1px solid var(--key,#1E6FA8);background:#fff;color:var(--key-d,#175A88);
  border-radius:999px;padding:9px 13px;font-size:12.5px;font-weight:800;cursor:pointer;
  min-height:38px;font-family:inherit;
}
.ym-chip:hover{background:var(--key-t,#E1EEF7)}
.ym-chip:focus-visible{outline:2px solid var(--key,#1E6FA8);outline-offset:2px}
.ym-chip.ym-chip-sub{border-color:var(--line-2,#D5DCDF);color:var(--muted,#5A6E7A);font-weight:700}

/* 常設フッター（電話・LINE・フォーム・最初へ） */
.ym-foot{
  flex:none;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line,#DFE9F0);
  background:var(--paper,#fff);
}
.ym-foot a,.ym-foot button{
  display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 2px 9px;
  font-size:10px;font-weight:800;color:var(--key-d,#175A88);text-decoration:none;
  background:none;border:0;cursor:pointer;font-family:inherit;min-height:44px;
}
.ym-foot a:hover,.ym-foot button:hover{background:var(--key-t,#E1EEF7)}
.ym-foot .ym-ic{font-size:16px;line-height:1}

/* モバイル微調整 */
@media(max-width:480px){
  .ym-panel{right:6px;left:6px;width:auto;bottom:6px;max-height:min(600px,calc(100dvh - 12px))}
}

@media(prefers-reduced-motion:reduce){
  .ym-fab{transition:none}
}
