/* The floating LINE button on Melatiku's landing page, the same placement and
   behaviour as Sakuraku's WhatsApp one (.wa-fab* in base.css): a 52px button
   16px from the right and 20px from the bottom on a phone; 56px, 24px from the
   edges and with a label beside it from 768px up. The face is LINE's official
   icon, used as it is. .ln-fab-clear is a strip in the footer's green after
   the footer, so the button never sits over the last footer line. */
.ln-fab-wrap { position: fixed; right: 16px; bottom: 20px; z-index: 60; display: flex; align-items: center; gap: 12px; text-decoration: none; }
.ln-fab { width: 52px; height: 52px; display: block; filter: drop-shadow(0 8px 14px rgba(0, 0, 0, 0.18)); transition: transform 0.15s; }
.ln-fab img { width: 100%; height: 100%; display: block; }
.ln-fab-wrap:hover .ln-fab { transform: scale(1.06); }
.ln-fab-label { display: none; }
.ln-fab-clear { height: 88px; background: #0A2C21; }
@media (min-width: 768px) {
  .ln-fab-wrap { right: 24px; bottom: 24px; }
  .ln-fab { width: 56px; height: 56px; }
  .ln-fab-label { display: flex; flex-direction: column; gap: 2px; text-align: left; background: #FFFFFF; border: 1px solid #E6E1D3; border-radius: 6px; padding: 10px 14px; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.10); font-family: 'Zen Kaku Gothic New', 'Hiragino Sans', 'Yu Gothic', sans-serif; }
  .ln-fab-label b { font-size: 14px; color: #0F3D2E; }
  .ln-fab-label span { font-size: 12px; color: #55615A; }
  .ln-fab-clear { height: 104px; }
}