.sg-support { position: fixed; right: max(16px, env(safe-area-inset-right)); bottom: calc(var(--sg-support-bottom, 16px) + env(safe-area-inset-bottom)); z-index: 1010; margin: 0; color: #26332b; font-size: 14px; }
.sg-support-toggle { display: flex; align-items: center; justify-content: center; gap: 8px; width: 116px; min-height: 52px; padding: 12px 16px; border-radius: 28px; background: #16783c; color: #fff; box-shadow: 0 4px 16px #163e2a33; list-style: none; font-weight: 700; cursor: pointer; animation: sg-support-intro 1.6s ease-out 2; }
.sg-support-toggle::-webkit-details-marker { display: none; }
.sg-support-toggle > .fa { font-size: 23px; }
.sg-support.is-interacted .sg-support-toggle { animation: none; }
.sg-support-panel { position: absolute; right: 0; bottom: 66px; width: 324px; max-width: calc(100vw - 32px); max-height: max(100px, calc(100dvh - var(--sg-support-bottom, 16px) - 96px)); overflow: auto; border: 1px solid #dce6df; border-radius: 12px; background: #fff; box-shadow: 0 12px 40px #183d2933; }
.sg-support:not([open]) .sg-support-panel { display: none; }
.sg-support-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 18px; background: #f3f8f4; border-bottom: 1px solid #e4ece6; }
.sg-support-heading strong { display: block; font-size: 16px; }
.sg-support-heading p { margin: 5px 0 0; font-size: 12px; color: #627167; }
.sg-support .sg-support-close { display: flex; flex: 0 0 32px; justify-content: center; align-items: center; width: 32px; height: 32px; margin: -4px -6px 0 0; padding: 0; border: 0; border-radius: 6px; background: transparent; color: #425b4b; font: inherit; font-size: 26px; cursor: pointer; }
.sg-support-close:hover { background: #e2ede5; }
.sg-support:not(.is-enhanced) .sg-support-close { display: none; }
.sg-support-channels { padding: 12px; }
.sg-support a.sg-support-channel { display: flex; align-items: center; gap: 12px; padding: 12px 10px; border: 1px solid #e4ece6; border-radius: 8px; margin-bottom: 9px; color: #26332b; text-decoration: none; }
.sg-support a.sg-support-channel:hover { background: #f6faf7; border-color: #b7d2c0; }
.sg-support-channel > .fa { display: flex; justify-content: center; align-items: center; width: 34px; height: 34px; border-radius: 50%; background: #e6f5eb; color: #178345; font-size: 23px; }
.sg-support-channel > span:nth-child(2) { flex: 1; }
.sg-support-channel strong { display: block; font-size: 14px; }
.sg-support-channel small { display: block; font-size: 11px; color: #68796d; margin-top: 3px; }
.sg-support a.sg-support-viber > .fa { background: #f0ebfa; color: #7360b5; }
.sg-support-phone { margin: 0 4px 12px; font-size: 11px; color: #68796d; }
.sg-support-phone span { user-select: all; }
.sg-support a.sg-support-contact { display: flex; justify-content: space-between; align-items: center; padding: 10px 4px 4px; color: #166d38; font-size: 12px; }
.sg-support :focus-visible { outline: 3px solid #16783c; outline-offset: 3px; }
.sg-support-toggle:focus-visible { outline-color: #9ad9b1; }
body.sg-support-ready { padding-bottom: 84px; }
body:has(#sg-support) { padding-bottom: 84px; }
body.sg-support-ready #scroll-up { right: 22px; bottom: calc(var(--sg-support-bottom, 16px) + 68px); }
@keyframes sg-support-intro { 0%, 100% { box-shadow: 0 4px 16px #163e2a33; } 50% { box-shadow: 0 4px 16px #163e2a33, 0 0 0 7px #16783c1f; } }
@media (max-width: 575px) { .sg-support-toggle { width: 52px; padding: 10px; } .sg-support-toggle-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); } }
@media (prefers-reduced-motion: reduce) { .sg-support-toggle { animation: none; } }