.telegram-visual { display: grid; justify-items: center; gap: 4px; margin: 0; }
.tg-switch-stage { position: relative; width: 244px; max-width: 100%; height: 212px; overflow: hidden; perspective: 650px; }
.tg-switch-phone, .tg-switch-qr { position: absolute; transition: transform .6s cubic-bezier(.22,.75,.23,1), opacity .4s ease; will-change: transform, opacity; }
.tg-switch-phone { width: 244px; height: 206px; top: 0; left: calc(50% - 122px); object-fit: contain; opacity: 1; transform: translateX(0) rotateY(0); }
.tg-switch-qr { box-sizing: border-box; width: 188px; height: 188px; left: calc(50% - 94px); top: 12px; padding: 12px; border-radius: 8px; background: #fff; opacity: 0; transform: translateX(220px) rotateY(-65deg) scale(.85); }
.tg-show-qr .tg-switch-phone { opacity: 0; transform: translateX(-220px) rotateY(65deg) scale(.85); }
.tg-show-qr .tg-switch-qr { opacity: 1; transform: translateX(0) rotateY(0) scale(1); }
.telegram-visual .tg-qr-toggle { width: auto; min-height: 32px; padding: 4px 10px; margin: 0; font-size: 13px; font-weight: 500; color: #83caff; background: transparent; border: 0; cursor: pointer; }
.telegram-visual .tg-qr-toggle:disabled { opacity: .45; cursor: default; }
.telegram-visual .tg-qr-toggle:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; border-radius: 4px; }
.theme-plata .telegram-visual .tg-qr-toggle { color: #c4a684; }
.theme-white .telegram-visual .tg-qr-toggle, .theme-glass .telegram-visual .tg-qr-toggle { color: #1766a5; }
@media (max-width: 600px) { .tg-switch-stage { height: 188px; } .tg-switch-phone { height: 184px; } .tg-switch-qr { width: 164px; height: 164px; left: calc(50% - 82px); } }
@media (prefers-reduced-motion: reduce) { .tg-switch-phone, .tg-switch-qr { transition: none; } }