/* MG PRO V2.6 how-to: standalone, RTL, mobile-first; all illustrations original CSS/SVG */
.howto-page{background:radial-gradient(ellipse at 88% 6%,rgba(143,49,230,.28),transparent 32%),radial-gradient(ellipse at 8% 40%,rgba(125,40,210,.19),transparent 34%),linear-gradient(150deg,#100421,#21093e 46%,#12051e)}
.howto-page .hi-icon{width:23px;height:23px;display:inline-block;flex:none;vertical-align:middle}
.ht-nav{display:flex;gap:26px;align-items:center;font-size:14px;font-weight:750}
.ht-nav a{padding:10px 2px;color:#ccb9eb;transition:color .2s}
.ht-nav a:hover,.ht-nav a[aria-current=page]{color:#fff}
.ht-nav a[aria-current=page]{border-bottom:2px solid #cd61fc}
.ht-top-cta{font-size:14px;padding:10px 22px}
.ht-hero{display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:38px;min-height:510px;padding:60px 12px 44px;isolation:isolate}
.ht-eyebrow,.ht-section-kicker{display:inline-flex;align-items:center;gap:9px;color:#e7b5ff;font-weight:850;font-size:12px;letter-spacing:.7px}
.ht-dot{width:9px;height:9px;border-radius:50%;background:#d868fc;box-shadow:0 0 0 6px #bc40ec25,0 0 22px #de82ff;animation:ht-pulse 2.5s ease-in-out infinite}
.ht-hero h1{font-size:clamp(36px,5.5vw,69px);letter-spacing:-1px;margin:17px 0 11px;line-height:1.3}
.ht-hero h1 span{background:linear-gradient(130deg,#fff6ff,#e19bff,#a968ff);background-clip:text;-webkit-background-clip:text;color:transparent;text-shadow:0 14px 35px rgba(183,69,247,.32)}
.ht-hero-content>p{font-size:18px;color:#d1c2e7;max-width:610px;line-height:1.95}
.ht-hero-actions,.ht-highlights{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.ht-hero-actions{margin:26px 0 22px}
.ht-hero-actions .btn .hi-icon{width:19px;height:19px}
.ht-highlights{gap:11px}
.ht-highlights span{border:1px solid #b186dd68;background:#47216c79;padding:7px 12px;border-radius:999px;display:inline-flex;align-items:center;gap:6px;font-size:13px;color:#efe4ff}
.ht-highlights .hi-icon{width:17px;height:17px;color:#f1adff}
.ht-art{min-height:440px;display:grid;place-items:center;position:relative;perspective:980px}
.ht-art:before{content:"";position:absolute;width:290px;height:290px;background:#ad3bfd59;filter:blur(80px);border-radius:50%;z-index:-1}
.ht-phone{width:220px;height:401px;border:9px solid #3e185e;outline:2px solid #aa66f9;border-radius:42px;background:#0b0515;box-shadow:24px 22px 45px #04020b9c,-9px -7px 55px #a943f659, inset 3px 0 12px #ad5ed3aa;position:relative;transform:rotateY(-14deg) rotateZ(5deg);animation:ht-phone-float 5s ease-in-out infinite;overflow:hidden}
.ht-phone-camera{position:absolute;top:8px;left:50%;transform:translateX(-50%);width:72px;height:17px;border-radius:50px;background:#090414;z-index:4}
.ht-phone-screen{position:absolute;inset:0;border-radius:29px;background:radial-gradient(circle at 68% 19%,#df85ff77,transparent 36%),linear-gradient(155deg,#64119e,#310c73 55%,#110c2b);overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:33px}
.ht-phone-screen:before,.ht-phone-screen:after{content:"";position:absolute;inset:-50px;transform:rotate(-25deg);background:repeating-linear-gradient(90deg,transparent 0 34px,#dd80fa19 34px 35px,transparent 35px 69px);animation:ht-lines 9s linear infinite;pointer-events:none}
.ht-phone-screen:after{transform:rotate(40deg);opacity:.6;animation-duration:16s}
.ht-screen-symbol{width:105px;height:105px;border:1px solid #f1c2ff99;border-radius:35px;display:grid;place-items:center;background:linear-gradient(140deg,#d28bfb9c,#6127b6bb);box-shadow:0 0 42px #e0a5fd77,inset 0 5px 8px #f3d6ff8c;transform:rotate(-8deg)}
.ht-screen-symbol .hi-icon{width:65px;height:65px;filter:drop-shadow(2px 4px 3px #26073e)}
.ht-phone-screen>span{font-size:23px;font-weight:950;letter-spacing:1.5px;text-shadow:0 1px 19px #f0a8ff}
.ht-screen-bar{width:125px;height:5px;background:#e7befc40;border-radius:20px;overflow:hidden}
.ht-screen-bar i{display:block;background:#e69eff;width:67%;height:100%;border-radius:20px;animation:ht-bar 4s ease-in-out infinite}
.ht-float{position:absolute;width:86px;height:86px;border-radius:29px;display:grid;place-items:center;background:linear-gradient(140deg,#e5b9ff,#a44afc 40%,#5118ad);box-shadow:inset 0 4px 11px #fae2ffab,0 13px 35px #4f0c8bbd;border:1px solid #f5d5ff;z-index:2;animation:ht-small-float 3.7s ease-in-out infinite}
.ht-float .hi-icon{width:45px;height:45px;color:white;stroke-width:2.7;filter:drop-shadow(1px 3px 2px #3f0c7a)}
.ht-float-upload{top:55px;right:18px;transform:rotate(16deg)}
.ht-float-check{bottom:60px;left:18px;background:linear-gradient(125deg,#aafee9,#45ceba 50%,#195e83);animation-delay:-1.3s}
.ht-orbit{position:absolute;border:1px solid #b859f352;border-radius:50%;width:330px;height:330px;transform:rotateX(68deg) rotate(-32deg);box-shadow:0 0 26px #c867ed36}
.ht-orbit-one{animation:ht-ring 8s linear infinite}
.ht-orbit-two{width:385px;height:385px;animation:ht-ring 13s linear infinite reverse;border-color:#d6abff33}
.ht-guide-section{padding:25px 0 55px;scroll-margin-top:95px}
.ht-section-heading{text-align:center;margin:0 auto 24px;max-width:750px}
.ht-section-heading h2{font-size:clamp(26px,3.3vw,41px);line-height:1.35;margin:8px 0}
.ht-section-heading p{font-size:15px;color:#c6b5df;margin:0}
.ht-device-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;max-width:850px;margin:30px auto 17px}
.ht-tab{color:#e1c8f5;border:1px solid #9255c786;border-radius:19px;background:linear-gradient(155deg,#59209171,#230b448c);padding:19px 12px;display:flex;align-items:center;justify-content:center;gap:10px;font-size:15px;font-weight:800;min-height:72px;transition:transform .25s,background .2s,box-shadow .2s;cursor:pointer}
.ht-tab .hi-icon{width:29px;height:29px;color:#d1a8ff}
.ht-tab:hover{transform:translateY(-4px)}
.ht-tab[aria-selected=true]{background:linear-gradient(130deg,#8132c8,#5f23bb);box-shadow:0 7px 30px #992bf47a;border:1px solid #e4a4ff;color:white}
.ht-tab[aria-selected=true] .hi-icon{color:white;filter:drop-shadow(0 0 8px #ffddff)}
.ht-guide-box{max-width:970px;margin:auto;border-radius:28px;padding:28px 30px 26px}
.ht-panel[hidden]{display:none!important}
.ht-panel-title{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;padding-bottom:16px;border-bottom:1px solid #ad80df46}
.ht-panel-title p{margin:0;font-size:13px;color:#c7b4dc}
.ht-panel-badge{display:inline-flex;gap:11px;align-items:center;font-weight:900;font-size:17px}
.ht-panel-badge .hi-icon{width:35px;height:35px;color:#e8a7fa}
.ht-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;list-style:none;margin:23px 0;padding:0}
.ht-step{position:relative;min-width:0;display:flex;gap:13px;align-items:flex-start;padding:18px;background:linear-gradient(145deg,#5e2a964a,#240d4499);border:1px solid #9c69d755;border-radius:19px;min-height:112px;transition:border-color .2s,transform .2s}
.ht-step:hover{transform:translateY(-3px);border-color:#ce89fdb0}
.ht-number{width:34px;height:34px;min-width:34px;border-radius:12px;background:linear-gradient(140deg,#d76dff,#7229d3);box-shadow:0 5px 17px #7719b779;display:grid;place-items:center;color:#fff;font-weight:900}
.ht-step h3{font-size:15px;margin:1px 0 4px;color:#fff}
.ht-step p{font-size:13px;line-height:1.85;margin:0;color:#cbbadd}
.ht-step-check{display:none;color:#bb80ef}
.ht-device-note{display:flex;gap:14px;align-items:flex-start;background:rgba(123,64,206,.16);border:1px solid #b47be45b;padding:14px 17px;border-radius:15px;color:#e2c9f5}
.ht-device-note .hi-icon{width:25px;height:25px;color:#d17aff}
.ht-device-note p{font-size:13px;line-height:1.8;margin:0}
.ht-guide-actions{display:flex;gap:13px;justify-content:center;align-items:center;flex-wrap:wrap;padding-top:24px}
.ht-guide-actions .hi-icon{width:19px;height:19px}
.ht-trust{padding:20px 0 70px}
.ht-trust-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ht-trust-card{border-radius:22px;padding:25px 23px;min-width:0}
.ht-trust-card>.hi-icon{width:42px;height:42px;color:#e0a9ff;filter:drop-shadow(0 0 15px #9d4be3)}
.ht-trust-card h3{margin:15px 0 8px;font-size:17px}
.ht-trust-card p{color:#c8b8de;font-size:13px;line-height:1.9;margin:0}
.ht-faq{padding:0 0 66px;max-width:950px}
.ht-faq-list{display:grid;gap:10px}
.ht-faq details{border-radius:16px;padding:16px 20px}
.ht-faq summary{cursor:pointer;font-weight:850;padding-inline-start:18px}
.ht-faq details[open]{border-color:#b57bed98}
.ht-faq details p{margin:12px 0 3px;color:#cfbce8;font-size:14px;line-height:1.85}
.ht-final{padding:30px 35px;margin-bottom:80px;border-radius:25px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.ht-final h2{font-size:27px;margin:6px 0}
.ht-final p{color:#c6b2da;margin:0;font-size:14px}
.ht-final .hi-icon{width:19px;height:19px}
.ht-footer{border-top:1px solid #ad80df3c;color:#ad9abb;font-size:12px;padding:19px 0;background:#10041bc7}
.ht-footer .wrap{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}
.ht-footer a:hover{color:white}
@keyframes ht-pulse{50%{box-shadow:0 0 0 9px #bc40ec10,0 0 25px #f4aaff}}
@keyframes ht-phone-float{0%,100%{transform:translateY(0) rotateY(-14deg) rotateZ(5deg)}50%{transform:translateY(-13px) rotateY(-6deg) rotateZ(2deg)}}
@keyframes ht-small-float{0%,100%{translate:0 0;rotate:-5deg}50%{translate:0 -13px;rotate:6deg}}
@keyframes ht-ring{0%{rotate:0deg}100%{rotate:360deg}}
@keyframes ht-lines{0%{translate:0 0}100%{translate:75px 0}}
@keyframes ht-bar{0%,100%{width:35%}50%{width:85%}}
@media(max-width:1050px){.ht-nav{gap:15px}.ht-hero{grid-template-columns:1fr .7fr}.ht-art{transform:scale(.88)}}
@media(max-width:760px){.howto-page .topbar .nav-wrap{gap:10px;flex-wrap:wrap;justify-content:space-between;padding:11px 0}.ht-nav{order:3;flex:1 1 100%;justify-content:center;gap:20px;font-size:12px}.ht-top-cta{padding:9px 17px;font-size:12px}.ht-hero{grid-template-columns:1fr;gap:10px;text-align:center;padding:40px 0 20px}.ht-hero-content>p{margin-inline:auto;font-size:15px}.ht-hero-actions,.ht-highlights{justify-content:center}.ht-art{min-height:360px;transform:scale(.79);margin:-15px auto -24px}.ht-steps{grid-template-columns:1fr}.ht-panel-title{justify-content:center;text-align:center}.ht-guide-box{padding:22px 17px}.ht-trust-grid{grid-template-columns:1fr}.ht-final{flex-direction:column;text-align:center;padding:25px 19px}.ht-footer .wrap{justify-content:center;text-align:center}.ht-device-tabs{gap:7px}.ht-tab{padding:12px 5px;min-height:83px;flex-direction:column;gap:4px;font-size:12px}.ht-tab .hi-icon{width:27px;height:27px}.ht-section-heading{padding:0 10px}}
@media(max-width:430px){.ht-hero h1{font-size:34px}.ht-nav{gap:13px}.howto-page .brand{font-size:24px}.ht-hero-actions .btn{width:100%;max-width:340px}.ht-hero-actions{max-width:360px;margin-inline:auto;margin-bottom:20px}.ht-guide-actions .btn{width:100%}.ht-float{width:77px;height:77px}.ht-phone{margin-inline:auto}.ht-steps .ht-step{padding:15px}.ht-steps .ht-number{width:30px;height:30px;min-width:30px}.ht-trust{padding-bottom:50px}}
@media(prefers-reduced-motion:reduce){.howto-page *, .howto-page *::before, .howto-page *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}