.vg-section{background:radial-gradient(ellipse at 20% 50%,#60399015,transparent 55%),#100d19;border-block:1px solid #b08cdd15}.vg-section .vts-section-heading{margin-bottom:30px}.vg-tour{border:1px solid #b28ddd38;background:#171221;border-radius:19px;overflow:hidden;scroll-margin-top:115px}.vg-topline{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:16px 26px;border-bottom:1px solid #b28ddd1c;background:#100d1855}.vg-topline>span:first-child{display:flex;align-items:center;gap:11px;font-size:11px;color:#d6baf1}.vg-topline>span:first-child>i{color:#c59aec;font-size:12px}.vg-topline>span:last-child{font-size:9px;color:#9981b2}.vg-tabs{display:none;grid-template-columns:repeat(5,1fr);gap:7px;padding:19px 25px 0}.vg-ready .vg-tabs{display:grid}.vg-tabs button{display:flex;align-items:center;justify-content:center;gap:12px;border:1px solid #a582c627;background:#100c170d;min-height:48px;padding:10px 13px;border-radius:8px;color:#aa91be;font-size:12px}.vg-tabs button>span{font-size:9px;color:#9073aa}.vg-tabs button[aria-selected=true]{border-color:#bc8be775;background:#9460ca24;color:#ecd5ff}.vg-tabs button[aria-selected=true]>span{color:#d7b2ff}.vg-panel{display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;gap:45px;padding:38px 55px 37px;min-width:0}.vg-panel+.vg-panel{border-top:1px solid #b395d32c}.vg-ready .vg-panel{border-top:0}.vg-visual{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0;position:relative;padding:5px 0;background:radial-gradient(ellipse at 50% 45%,#7e4cab22,transparent 65%)}.vg-device{width:230px;max-width:100%;border:5px solid #3c2b4b;border-radius:30px;box-shadow:0 24px 50px #05030860;background:#0e0a12;overflow:hidden}.vg-device a{display:block;position:relative}.vg-device img{display:block;width:100%;height:475px;object-fit:contain;background:#0c0a10}.vg-device a>.vg-zoom{position:absolute;bottom:12px;right:12px;display:flex;align-items:center;gap:7px;background:#1a1029ef;border:1px solid #b78bda77;color:#efd9ff;font-size:9px;padding:8px 10px;border-radius:6px}.vg-visual figcaption{font-size:9px;line-height:1.7;color:#a389b8;margin-top:17px;text-align:center}.vg-copy{min-width:0}.vg-role{display:flex;align-items:center;gap:9px;color:#cfa9f3;font-size:11px;margin-bottom:22px}.vg-role>span{margin-left:auto;color:#866b9a;font-size:9px;letter-spacing:.1em}.vg-role>i{font-size:11px}.vg-copy h3{font-size:clamp(26px,2.6vw,35px);line-height:1.23;max-width:460px;margin:0 0 20px;scroll-margin-top:125px}.vg-copy>p{font-size:14px;line-height:1.9;max-width:495px;color:#bba8cb}.vg-insight{padding:22px 25px;margin-top:26px;border:1px solid #b593d426;border-radius:10px;background:#986bcc08}.vg-insight>span{font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:#ab88c6}.vg-insight h4{font-size:17px;font-weight:500;margin:12px 0;line-height:1.4;color:#e2c8f5}.vg-insight p{font-size:12px;line-height:1.85;color:#a890bb}.vg-copy .vg-note{font-size:10px;line-height:1.8;color:#8f789f;margin-top:18px;max-width:480px}.vg-navigation{display:none;align-items:center;justify-content:space-between;gap:20px;padding:20px 30px;border-top:1px solid #b995d52a;background:#100d1750}.vg-ready .vg-navigation{display:flex}.vg-navigation>button{display:flex;align-items:center;gap:12px;border:1px solid #b88cdc3d;color:#d7b7f2;background:#271733;min-height:44px;font-size:11px;padding:11px 17px;border-radius:7px}.vg-navigation>button:last-child{background:#7838b9;color:#fff;border-color:#bf99df4a}.vg-navigation>button:disabled{opacity:.3;cursor:default}.vg-navigation>span{font-size:10px;color:#a087b1}.vg-states{display:none;gap:7px;flex-wrap:wrap;margin:19px 0 10px}.vg-ready .vg-states{display:flex}.vg-states button{border:1px solid #b08ad543;border-radius:6px;padding:10px;font-size:10px;color:#bba0cf;background:#0d09152b;min-height:44px}.vg-states button[aria-pressed=true]{background:#a070d026;border-color:#bc8be98a;color:#e7cafe}.vg-copy .vg-state-feedback{font-size:11px;line-height:1.8;color:#c3a8d6;min-height:59px}.vg-closing{display:flex;align-items:center;gap:30px;margin-top:30px;padding:26px 0 0}.vg-closing>div{margin-right:auto;max-width:530px}.vg-closing h3{font-size:20px;margin-bottom:10px}.vg-closing p{font-size:12px;line-height:1.85}.vg-closing .vts-button{font-size:12px;white-space:nowrap}.vg-closing .vts-text-link{font-size:11px;white-space:nowrap}.vg-ready .vg-panel:not([hidden]) .vg-visual,.vg-ready .vg-panel:not([hidden]) .vg-copy{animation:vg-enter .35s ease-out both}.vg-ready .vg-panel:not([hidden]) .vg-copy{animation-delay:.045s}
@keyframes vg-enter{from{opacity:.4;transform:translateY(7px)}to{opacity:1;transform:none}}
@media(max-width:1050px){.vg-panel{gap:32px;padding:32px}.vg-copy>p{font-size:13px}.vg-insight{padding:18px}.vg-closing{flex-wrap:wrap;gap:20px}.vg-closing>div{flex:1 1 100%;max-width:none}.vg-device{width:205px}.vg-device img{height:433px}}
@media(max-width:700px){.vg-section{padding:65px 0}.vg-topline{padding:14px 16px;align-items:start;gap:15px}.vg-topline>span:first-child{font-size:10px;white-space:nowrap}.vg-topline>span:last-child{font-size:8px;max-width:130px;line-height:1.6;text-align:right}.vg-tabs{padding:14px 13px 3px;gap:6px;display:none;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#745487 transparent;grid-template-columns:repeat(5,minmax(104px,1fr))}.vg-tabs button{font-size:10px;padding:9px;gap:8px;min-height:44px}.vg-tabs button>span{font-size:8px}.vg-panel{grid-template-columns:1fr;gap:25px;padding:25px 21px}.vg-copy{grid-row:1}.vg-copy h3{font-size:27px;margin-bottom:14px}.vg-role{margin-bottom:15px;font-size:10px}.vg-copy>p{font-size:12px;line-height:1.85}.vg-insight{margin-top:19px;padding:15px 17px}.vg-insight h4{font-size:15px;margin:9px 0}.vg-insight p{font-size:11px}.vg-insight>span{font-size:8px}.vg-copy .vg-note{font-size:9px;margin-top:13px}.vg-device{width:192px;border-width:4px;border-radius:25px}.vg-device img{height:410px}.vg-visual figcaption{font-size:8px;margin-top:12px}.vg-navigation{padding:17px 15px;gap:10px;flex-wrap:wrap}.vg-navigation>span{font-size:9px}.vg-navigation>button{font-size:10px;padding:10px;gap:8px}.vg-navigation>button:last-child{margin-left:auto}.vg-closing{padding-top:14px;gap:20px}.vg-closing h3{font-size:20px}.vg-closing p{font-size:12px}.vg-tour{border-radius:13px}.vg-states{gap:6px}.vg-states button{font-size:9px;padding:9px}.vg-copy .vg-state-feedback{font-size:10px;min-height:0}}
@media(max-width:390px){.vg-navigation>span{order:-1;flex-basis:100%;text-align:center}.vg-navigation>button{flex:1;justify-content:center}.vg-panel{padding:22px 17px}}
@media(prefers-reduced-motion:reduce){.vg-ready .vg-panel .vg-copy,.vg-ready .vg-panel .vg-visual{animation:none!important}}
/* On phones, show the real screen before the deeper implementation notes. */
@media(max-width:700px){
 .vg-panel{display:flex;flex-direction:column;align-items:stretch;gap:0}
 .vg-copy{display:contents}.vg-copy .vg-role{order:0}.vg-copy h3{order:1}
 .vg-copy>p:not(.vg-note):not(.vg-state-feedback){order:2;margin-bottom:19px}
 .vg-states{order:3;margin-top:0}.vg-copy .vg-state-feedback{order:4;margin:0 0 19px}
 .vg-visual{order:5;margin:3px 0 7px}.vg-insight{order:6}.vg-copy .vg-note{order:7}
}