/* Compact edge rail. Each messenger expands independently toward the page. */
.wsf-contact { --wsf-rail-size: 56px; position: fixed; top: 50%; right: env(safe-area-inset-right, 0px); transform: translateY(-50%); z-index: 40; width: var(--wsf-rail-size); color: #fff; font: 15px/1.4 "Manrope", system-ui, sans-serif; }
.wsf-contact__toggle { display: grid; place-items: center; width: 100%; height: 38px; padding: 0; border: 0; border-radius: 12px 0 0; background: #101210; color: #fff; cursor: pointer; }
.wsf-contact__toggle[hidden], .wsf-contact__links[hidden] { display: none !important; }
.wsf-contact__toggle svg { width: 21px; height: 21px; transition: transform .2s ease; }
.wsf-contact__toggle[aria-expanded="false"] { border-radius: 12px 0 0 12px; }
.wsf-contact__toggle[aria-expanded="false"] svg { transform: rotate(180deg); }
.wsf-contact__links { display: flex; flex-direction: column; align-items: flex-end; width: 100%; }
.wsf-contact__link { position: relative; display: block; flex-shrink: 0; width: var(--wsf-rail-size); height: var(--wsf-rail-size); overflow: hidden; background: var(--wsf-messenger-color); color: #fff; text-decoration: none; border-radius: 0; transition: width .24s ease, border-radius .24s ease; }
.wsf-contact__link--whatsapp { --wsf-messenger-color: #098449; }
.wsf-contact__link--viber { --wsf-messenger-color: #64258a; }
.wsf-contact__link--telegram { --wsf-messenger-color: #087fae; }
.wsf-contact__link:last-child { border-bottom-left-radius: 12px; }
.wsf-contact__icon { position: absolute; top: 0; right: 0; display: grid; place-items: center; width: var(--wsf-rail-size); height: 100%; }
.wsf-contact__icon svg { width: 24px; height: 24px; }
.wsf-contact__label { position: absolute; top: 50%; left: 22px; right: var(--wsf-rail-size); opacity: 0; transform: translate(16px, -50%); transition: opacity .16s ease, transform .24s ease; white-space: nowrap; font-weight: 600; pointer-events: none; }
.wsf-contact__link:focus-visible, .wsf-contact__link.is-revealed { width: min(220px, calc(100vw - 16px)); border-radius: 12px 0 0 12px; color: #fff; }
.wsf-contact__link:focus-visible .wsf-contact__label, .wsf-contact__link.is-revealed .wsf-contact__label { opacity: 1; transform: translate(0, -50%); }
.wsf-contact__toggle:focus-visible, .wsf-contact__link:focus-visible { outline: 2px solid white; outline-offset: -5px; }
@media (hover: hover) and (pointer: fine) {
 .wsf-contact__link:hover { width: min(220px, calc(100vw - 16px)); border-radius: 12px 0 0 12px; color: #fff; }
 .wsf-contact__link:hover .wsf-contact__label { opacity: 1; transform: translate(0, -50%); }
 .wsf-contact__toggle:hover { background: #262b26; }
}
@media (max-width: 700px) { .wsf-contact { --wsf-rail-size: 48px; } .wsf-contact__icon svg { width: 22px; height: 22px; } }
@media (prefers-reduced-motion: reduce) { .wsf-contact__link, .wsf-contact__label, .wsf-contact__toggle svg { transition: none; } }

/* Keep mobile fixed controls in the visible viewport when offscreen tooltips overflow. */
@media (max-width: 700px) { html, body { overflow-x: clip; } }