@media (min-width: 768px){
  .uc-support-fab{
    display:none !important;
  }
}

@media (max-width: 767px){
  .uc-support-fab{
    --uc-support-fab-bottom:calc(92px + env(safe-area-inset-bottom, 0px));
    --uc-support-ivory:rgba(255, 250, 242, .92);
    --uc-support-ivory-soft:rgba(249, 244, 236, .86);
    --uc-support-gold:rgba(211, 176, 112, .48);
    --uc-support-ink:#5a4936;
    position:fixed;
    right:16px;
    bottom:var(--uc-support-fab-bottom);
    z-index:65;
    display:grid;
    justify-items:end;
    gap:11px;
    font-family:Inter, "Noto Sans TC", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    transition:bottom .22s ease, opacity .18s ease, transform .18s ease;
    pointer-events:none;
  }

  body.uc-support-sticky-active .uc-support-fab{
    --uc-support-fab-bottom:calc(150px + env(safe-area-inset-bottom, 0px));
  }

  body.uc-support-modal-active .uc-support-fab,
  body.uc-support-toast-active .uc-support-fab{
    opacity:0;
    transform:translateY(8px);
    pointer-events:none;
  }

  .uc-support-fab.is-open{
    z-index:66;
  }

  .uc-support-fab__bubble{
    position:absolute;
    right:2px;
    bottom:66px;
    width:min(188px, calc(100vw - 40px));
    padding:9px 14px 10px 15px;
    border:1px solid var(--uc-support-gold);
    border-radius:20px 20px 8px 20px;
    background:
      radial-gradient(circle at 17px 13px, rgba(255, 255, 255, .95) 0 2px, transparent 3px),
      linear-gradient(145deg, var(--uc-support-ivory), var(--uc-support-ivory-soft));
    color:var(--uc-support-ink);
    box-shadow:
      0 10px 28px rgba(78, 55, 27, .12),
      0 2px 8px rgba(211, 176, 112, .12),
      inset 0 1px 0 rgba(255, 255, 255, .92);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
    font-size:14px;
    font-weight:760;
    line-height:1.35;
    letter-spacing:0;
    text-align:left;
    white-space:normal;
    pointer-events:none;
    opacity:0;
    transform:translate3d(0, 8px, 0) scale(.965);
    transform-origin:right bottom;
  }

  .uc-support-fab__bubble::before{
    content:"";
    position:absolute;
    right:18px;
    bottom:-6px;
    width:12px;
    height:12px;
    border-right:1px solid var(--uc-support-gold);
    border-bottom:1px solid var(--uc-support-gold);
    border-radius:0 0 4px 0;
    background:linear-gradient(135deg, rgba(249, 244, 236, .88), rgba(255, 250, 242, .94));
    transform:rotate(45deg);
    box-shadow:3px 4px 10px rgba(78, 55, 27, .06);
  }

  .uc-support-fab__bubble::after{
    content:"";
    position:absolute;
    top:9px;
    right:12px;
    width:7px;
    height:7px;
    border-radius:999px;
    background:rgba(207, 164, 83, .72);
    box-shadow:
      -9px 7px 0 -3px rgba(207, 164, 83, .42),
      5px 13px 0 -4px rgba(207, 164, 83, .34);
    opacity:.74;
  }

  .uc-support-fab.is-bubble-on:not(.is-open) .uc-support-fab__bubble{
    opacity:1;
    transform:translate3d(0, 0, 0) scale(1);
    animation:ucSupportBubbleIn .48s cubic-bezier(.19, 1, .22, 1) both,
      ucSupportBubbleFloat 3.2s ease-in-out .5s infinite;
  }

  .uc-support-fab.is-open .uc-support-fab__bubble{
    display:none;
  }

  .uc-support-fab__menu{
    width:min(180px, calc(100vw - 32px));
    display:grid;
    gap:5px;
    padding:6px;
    border:1px solid rgba(210, 180, 140, .4);
    border-radius:20px;
    background:rgba(255, 248, 240, .9);
    box-shadow:0 8px 24px rgba(45, 31, 16, .08);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
    opacity:0;
    transform:translateY(6px) scale(.985);
    transform-origin:bottom right;
    pointer-events:none;
    transition:opacity .18s ease, transform .18s ease;
  }

  .uc-support-fab.is-open .uc-support-fab__menu{
    opacity:1;
    transform:none;
    pointer-events:auto;
  }

  .uc-support-fab__hint{
    display:none;
  }

  .uc-support-fab__link,
  .uc-support-fab__button{
    min-height:44px;
    border:0;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    text-decoration:none;
    font:inherit;
    cursor:pointer;
    -webkit-tap-highlight-color:transparent;
  }

  .uc-support-fab__link{
    width:100%;
    min-height:44px;
    padding:0 10px;
    background:rgba(255, 253, 248, .7);
    color:#5a4a3a;
    border:1px solid rgba(210, 180, 140, .24);
    box-shadow:none;
    font-size:14px;
    font-weight:760;
    justify-content:flex-start;
  }

  .uc-support-fab__link:hover,
  .uc-support-fab__link:focus-visible{
    background:rgba(249, 246, 241, .96);
    color:#3f3021;
    border-color:rgba(210, 180, 140, .45);
    outline:none;
    box-shadow:0 0 0 3px rgba(210, 180, 140, .16);
  }

  .uc-support-fab__button{
    width:54px;
    min-width:54px;
    height:54px;
    padding:0;
    color:#6f4c1d;
    background:transparent;
    border:0;
    box-shadow:none;
    font-size:0;
    font-weight:1000;
    letter-spacing:0;
    pointer-events:auto;
  }

  .uc-support-fab__button:focus-visible{
    outline:2px solid rgba(210, 180, 140, .45);
    outline-offset:3px;
  }

  .uc-support-fab__button:active{
    transform:translateY(1px);
  }

  .uc-support-fab__button-icon,
  .uc-support-fab__link-icon{
    display:grid;
    place-items:center;
    flex:0 0 auto;
  }

  .uc-support-fab__button-icon{
    width:54px;
    height:54px;
    color:#6f4c1d;
  }

  .uc-support-fab__mascot{
    width:100%;
    height:100%;
    display:block;
    object-fit:contain;
    object-position:center;
    transform-origin:center bottom;
  }

  .uc-support-fab.is-bubble-on:not(.is-open) .uc-support-fab__mascot{
    animation:ucSupportMascotBob 3s ease-in-out .42s infinite;
  }

  .uc-support-fab__button [data-uc-support-button]{
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0 0 0 0);
    white-space:nowrap;
  }

  .uc-support-fab__link-icon{
    width:18px;
    height:18px;
    border-radius:999px;
  }

  .uc-support-fab__link-icon--whatsapp{
    color:#14833b;
    background:rgba(22, 163, 74, .09);
  }

  .uc-support-fab__link-icon--messenger{
    color:#2563eb;
    background:rgba(37, 99, 235, .09);
  }

  .uc-support-fab__link-icon--line{
    background:rgba(6, 199, 85, .09);
  }

  .uc-support-fab svg{
    width:100%;
    height:100%;
    display:block;
  }

  .uc-support-fab__link-icon img{
    width:100%;
    height:100%;
    display:block;
    border-radius:999px;
  }

  @keyframes ucSupportBubbleIn{
    0%{
      opacity:0;
      transform:translate3d(0, 9px, 0) scale(.94);
      filter:blur(1px);
    }
    70%{
      opacity:1;
      transform:translate3d(0, -1px, 0) scale(1.01);
      filter:blur(0);
    }
    100%{
      opacity:1;
      transform:translate3d(0, 0, 0) scale(1);
      filter:blur(0);
    }
  }

  @keyframes ucSupportBubbleFloat{
    0%, 100%{
      transform:translate3d(0, 0, 0) scale(1);
    }
    50%{
      transform:translate3d(0, -2px, 0) scale(1);
    }
  }

  @keyframes ucSupportMascotBob{
    0%, 100%{
      transform:translate3d(0, 0, 0);
    }
    50%{
      transform:translate3d(0, -1.5px, 0);
    }
  }

  @media (prefers-reduced-motion: reduce){
    .uc-support-fab,
    .uc-support-fab__menu,
    .uc-support-fab__bubble,
    .uc-support-fab__mascot{
      animation:none !important;
      transition:none !important;
    }
  }
}