/* 吹き出し ジェネレーター（2026-11-07）。プレビューの吹き出しそのものの見た目は js が #bb_css に書く */
.m-bubble .seg { align-self: flex-start; margin-bottom: 10px; }
.m-bb-colors { display: flex; flex-direction: column; gap: 14px; }
.m-bb-c { display: flex; align-items: center; gap: 14px; }
.m-bb-c[hidden] { display: none; }
.m-bb-cl { flex: none; width: 3em; font-size: 13px; color: var(--sub); letter-spacing: .06em; }
.m-bb-c .m-color { flex: 1; min-width: 0; }
.m-bubble .rng[hidden] { display: none; }
.m-bb-text { width: 100%; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; outline: 0; background: transparent; color: var(--ink);
  padding: 4px 0 8px; font: inherit; font-size: 18px; letter-spacing: .04em; }
.m-bb-text:hover { border-bottom-color: var(--sub); }
.m-bb-text:focus { border-bottom: 1.5px solid var(--ink); padding-bottom: 7.5px; }
.m-bb-stage { max-width: 280px; padding: 40px; text-align: left; line-height: 1.7; font-size: 16px; overflow-wrap: anywhere; }
#bb_box { transition: none; }
@media (max-width: 767px) {
  .m-bb-stage { padding: 28px; font-size: 15px; }
  .m-bb-text { font-size: 16px; }
}
