.telegram-float { position: fixed; right: max(24px, env(safe-area-inset-right)); bottom: max(24px, env(safe-area-inset-bottom)); z-index: 90; font-family: Inter, sans-serif; }
.telegram-float-toggle { display: grid; place-items: center; width: 60px; height: 60px; padding: 0; border: 1px solid #ffffff40; border-radius: 50%; background: #229ed9; color: #fff; cursor: pointer; box-shadow: 0 8px 28px #0088cc40, 0 2px 6px #0005; transition: background .18s, transform .18s; }
.telegram-float-toggle:hover { background: #168ac2; transform: translateY(-2px); }
.telegram-float-toggle > svg { grid-area: 1 / 1; }
.telegram-float-toggle > svg:first-child { width: 29px; height: 29px; margin-right: 3px; }
.telegram-float-toggle .telegram-float-close { display: none; }
.telegram-float-toggle[aria-expanded="true"] > svg:first-child { display: none; }
.telegram-float-toggle[aria-expanded="true"] .telegram-float-close { display: block; }
.telegram-float-options { position: absolute; bottom: calc(100% + 14px); right: 0; display: grid; gap: 9px; width: max-content; max-width: calc(100vw - 40px); transform-origin: bottom right; animation: telegram-reveal .18s ease-out; }
.telegram-float-options[hidden] { display: none; }
.telegram-float-options a { display: flex; align-items: center; gap: 12px; min-height: 54px; padding: 14px 16px; border: 1px solid #d9ecf6; border-radius: 14px; background: #fff; color: #123448; box-shadow: 0 6px 24px #0003; text-decoration: none; font-size: 13px; font-weight: 600; line-height: 1.45; transition: background .18s, border-color .18s; }
.telegram-float-options a:hover { background: #edf8ff; border-color: #229ed9; }
.telegram-float-options a > svg { flex-shrink: 0; color: #087cad; }
.telegram-float-options .telegram-float-arrow { margin-left: auto; }
.telegram-float :is(button,a):focus-visible { outline: 3px solid #fff; outline-offset: 4px; box-shadow: 0 0 0 6px #087cad; }
@keyframes telegram-reveal { from { opacity: 0; transform: translateY(7px) scale(.97); } to { opacity: 1; transform: none; } }
@media (max-width: 640px) {
 .telegram-float { right: max(16px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom)); }
 .telegram-float-toggle { width: 54px; height: 54px; }
 .telegram-float-options { max-width: calc(100vw - 32px); }
}
@media (prefers-reduced-motion: reduce) {
 .telegram-float-options { animation: none; }
 .telegram-float-toggle, .telegram-float-options a { transition: none; }
}
