/* MANODATA / SNAP 01. Timed gesture, restrained contextual response. */
.md-motion { width:110px; height:120px; display:inline-block; color:#d47758; overflow:visible; vertical-align:middle; flex-shrink:0; }
.md-motion .snap-wrist { transform-origin:625px 1030px; animation:md-wrist 2.8s cubic-bezier(.2,.7,.2,1) infinite; }
.md-motion .snap-finger { transform-origin:790px 475px; animation:md-finger 2.8s cubic-bezier(.2,.7,.2,1) infinite; }
.md-motion .snap-sparks { transform-origin:600px 365px; animation:md-spark 2.8s ease-out infinite; }
.md-motif { stroke-width:13; opacity:.38; }
.md-response { animation:md-response 2.8s ease-out infinite; transform-origin:600px 600px; }
.md-motion[data-motion="identity"] .md-scan { animation:md-scan 2.8s ease-in-out infinite; }
.md-motion[data-motion="documents"] .md-sheet { stroke-dasharray:2200; animation:md-sheet 2.8s ease-out infinite; }
.md-motion[data-motion="credits"] .md-coin { animation:md-coin 2.8s cubic-bezier(.2,.7,.2,1) infinite; }
.md-motion[data-motion="security"] .md-shield { stroke-dasharray:1800; animation:md-shield 2.8s ease-out infinite; }
.md-motion[data-motion="empty"] * { animation-iteration-count:1; }
@keyframes md-wrist { 0%,18%,100%{transform:rotate(0)} 31%{transform:rotate(-7deg) translateY(7px)} 38%{transform:rotate(4deg) translateY(-12px)} 48%,85%{transform:rotate(0)} }
@keyframes md-finger { 0%,18%,100%{transform:rotate(0)} 31%{transform:rotate(-12deg) translate(-8px,-16px)} 37%{transform:rotate(10deg) translate(6px,12px)} 46%,85%{transform:rotate(0)} }
@keyframes md-spark { 0%,32%{opacity:0;transform:scale(.65)} 38%{opacity:1;transform:scale(1.15)} 49%{opacity:1;transform:scale(1)} 63%,100%{opacity:0;transform:scale(1.1)} }
@keyframes md-response { 0%,33%{opacity:.12;transform:translateY(20px)} 48%,72%{opacity:1;transform:translateY(0)} 100%{opacity:.12;transform:translateY(20px)} }
@keyframes md-scan { 0%,34%{opacity:0;transform:translateY(-240px)} 40%{opacity:1} 70%{opacity:1;transform:translateY(240px)} 82%,100%{opacity:0;transform:translateY(240px)} }
@keyframes md-sheet { 0%,33%{stroke-dashoffset:2200;opacity:.2} 68%,84%{stroke-dashoffset:0;opacity:1} 100%{stroke-dashoffset:0;opacity:0} }
@keyframes md-coin { 0%,33%{opacity:0;transform:translate(-90px,170px) scale(.7)} 50%{opacity:1;transform:translate(0,-20px) scale(1)} 62%,82%{opacity:1;transform:translate(0,0) scale(1)} 100%{opacity:0;transform:translate(0,0) scale(1)} }
@keyframes md-shield { 0%,33%{stroke-dashoffset:1800;opacity:.1} 65%,85%{stroke-dashoffset:0;opacity:1} 100%{stroke-dashoffset:0;opacity:.1} }
.md-motion.md-offscreen *, .md-motion-paused .md-motion *, .md-tab-hidden .md-motion * { animation-play-state:paused!important; }
.md-motion-paused .snap-sparks { opacity:1; }
.md-section-seal { float:right;margin:0 0 12px 16px; }
.md-section-seal .md-motion { width:60px;height:65px; }
.logo-mark, .dash-logo .logo-mark { object-fit:contain; }
.md-snap-once .logo-mark { animation:md-logo-greeting .7s ease-out; transform-origin:50% 85%; }
@keyframes md-logo-greeting { 0%,100%{transform:rotate(0)} 35%{transform:rotate(-12deg)} 50%{transform:rotate(7deg)} 70%{transform:rotate(-2deg)} }
.hand-loader-svg.md-motion { width:112px;height:124px;filter:none; }
.dash-guide-loader-hand.md-motion { width:48px!important;height:54px!important;filter:none; }
.geo-status-hand.md-motion { width:38px;height:44px; }
.mano-loader-overlay { position:fixed;inset:0;z-index:99999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;background:var(--bg,#fff);color:var(--ink,#17191d);font-weight:700; }
.mano-loader-overlay[hidden] { display:none!important; }
.mano-loader-overlay .md-motion { width:140px;height:158px; }
.dash-no-results-hand { mask-image:none!important;-webkit-mask-image:none!important;background:none!important;filter:none!important;display:grid;place-items:center; }
.dash-no-results-hand .md-motion { width:124px;height:136px; }
.coin3d { animation:none!important; }
/* Plan artwork is static, including hover and keyboard focus. */
.plan-art { position:relative; }
.plan-art img { object-fit:contain;transition:none;animation:none; }
.plan-card:hover .plan-art img,.plan-card:focus-within .plan-art img { transform:none; }
.carousel-slide:not(.is-front) .md-motion * { animation-play-state:paused; }
.md-cover { position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:8% 8% 7%;color:#f8f5f1;background:#18191d;box-sizing:border-box; }
.carousel-slide.md-cover { position:absolute;inset:0; }
.md-cover-art { position:absolute;inset:16% 0 4%;width:100%;height:80%;object-fit:cover;z-index:-2; }
.md-cover:after { content:'';position:absolute;inset:0;background:linear-gradient(180deg,#18191d 0%,rgba(24,25,29,.88) 22%,transparent 46%,transparent 69%,#18191d 96%);z-index:-1; }
.md-cover-kicker { font-size:clamp(9px,1vw,12px);font-weight:800;letter-spacing:.15em;color:#d9957a;text-transform:uppercase; }
.md-cover h2 { margin:14px 0 0;font-size:clamp(24px,3.2vw,46px);font-weight:900;line-height:1.06;letter-spacing:-.045em;max-width:95%;color:#fff; }
.md-cover h2 em { color:#d47758;font-style:normal; }
.md-cover-footer { display:flex;gap:12px;align-items:center;font-size:clamp(10px,1.1vw,14px);line-height:1.45;color:#cccbd0; }
.md-cover-footer .md-motion { width:36px;height:42px; }
.md-cover-footer strong { color:#fff;display:block; }
.md-cover-footer { padding-right:66px; }
.md-carousel-controls { position:absolute;right:24px;bottom:28px;z-index:8;display:flex;gap:6px; }
.md-carousel-controls button { width:30px;height:30px;display:grid;place-items:center;border:1px solid #ffffff30;border-radius:50%;background:#25262c;color:white;cursor:pointer; }
.md-carousel-controls button:hover,.md-carousel-controls button:focus-visible { border-color:#d47758;outline:2px solid #d47758;outline-offset:2px; }
.login-infographics .hero-carousel { aspect-ratio:1122 / 1402!important;margin-bottom:42px; }
.md-infographic .slide-media { object-fit:contain; }
.login-infographics .md-carousel-controls { bottom:-38px;right:0; }
.login-infographics .md-carousel-controls button { background:var(--bg);color:var(--ink);border-color:var(--line); }
.login-infographics .md-carousel-controls .md-cover-enlarge { width:auto;padding:0 12px;border-radius:18px;font-family:inherit;font-size:11px;font-weight:700;line-height:1; }
.login-infographics .ad-left-img-wrap img { object-fit:contain; }
.md-cover-dialog { padding:0;border:1px solid var(--line);border-radius:14px;width:min(92vw,1000px);max-height:92dvh;overflow:auto;background:var(--bg);color:var(--ink); }
.md-cover-dialog::backdrop { background:#000b; }
.md-cover-dialog>img { display:block;width:100%;height:auto; }
.md-cover-close { position:sticky;top:10px;float:right;margin:10px 10px -48px 0;z-index:2;border:1px solid #fff7;background:#17191de8;color:white;border-radius:50%;width:38px;height:38px;cursor:pointer;font:26px/1 sans-serif; }
.md-cover-close:focus-visible { outline:3px solid #d47758;outline-offset:2px; }
@media(max-width:767px) { .login-infographics .hero-carousel { width:min(90vw,460px)!important;max-width:100%!important; } }
.md-welcome-hand { display:inline-block;vertical-align:middle; }
.md-welcome-hand .md-motion { width:38px;height:43px; }
.md-motion-paused .carousel-slide { transition:none!important; }
@media(prefers-reduced-motion:reduce) { .carousel-slide { transition:none!important; } }
.md-ad { height:100%;display:flex;flex-direction:column;justify-content:space-between;padding:22px 14px;background:#191b20;color:#fff;text-align:left;overflow:hidden; }
.md-ad .md-motion { width:100%;height:auto;max-height:220px;margin:auto; }
.md-ad strong { display:block;font-size:25px;line-height:1.08;letter-spacing:-.04em; }
.md-ad em { color:#d47758;font-style:normal; }
.md-ad small { display:block;font-size:11px;line-height:1.6;color:#c8cbd1; }
.md-ad-rule { width:32px;height:2px;background:#d47758;margin:16px 0; }
.tut-hero-visual.md-help-art { display:grid;place-items:center;min-height:330px;background:#191b20;border-radius:24px;position:relative;overflow:hidden; }
.md-help-art .md-motion { width:220px;height:250px;position:relative;z-index:1; }
.md-help-art:before,.md-help-art:after { content:'';position:absolute;width:60%;height:60%;border:1px solid #d4775822;border-radius:24px;transform:rotate(-12deg); }
.md-help-art:after { transform:rotate(9deg) translate(18px,8px); }
.tut-thumb [data-hand-motion] { position:absolute;inset:0;display:grid;place-items:center;background:#1b1e24; }
.tut-thumb .md-motion { width:104px;height:116px; }
.tut-thumb-play { left:auto!important;top:auto!important;right:14px!important;bottom:14px!important;transform:none!important;width:34px!important;height:34px!important; }
.md-lesson { width:100%;min-height:410px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:36px;background:#191b20;color:#fff;box-sizing:border-box; }
.md-lesson .md-motion { width:155px;height:180px;margin:18px 0; }
.md-lesson-count { color:#d9957a;font-size:12px;font-weight:800;letter-spacing:.15em; }
.md-lesson p { max-width:410px;font-size:21px;line-height:1.4;font-weight:700; }
.md-lesson-progress { width:170px;display:flex;gap:7px;margin-top:25px; }
.md-lesson-progress i { height:3px;flex:1;background:#ffffff25;border-radius:4px; }
.md-lesson-progress i.is-done { background:#d47758; }
.md-lesson-step { animation:md-lesson-in .4s cubic-bezier(.2,.7,.2,1); }
.md-lesson-visual { width:100%;display:flex;align-items:center;justify-content:center;gap:24px;margin:20px 0; }
.md-lesson-visual .md-motion { width:116px;height:135px; }
.md-lesson-demo { flex:1;max-width:280px;display:grid;gap:8px;padding:16px;border:1px solid #41434b;border-radius:14px;background:#20232a;text-align:left; }
.md-demo-row { display:flex;align-items:center;gap:10px;font-size:12px;padding:12px 9px;border:1px solid transparent;border-radius:7px;color:#b5b8c0; }
.md-demo-row i { font-style:normal;font-size:10px;color:#767c87; }
.md-demo-row.is-current { border-color:#ff7945;background:#d4775817;color:#fff;animation:md-demo-focus .6s ease-out; }
.md-demo-row.is-current i,.md-demo-row.is-complete i { color:#ff8856; }
@keyframes md-demo-focus { from{transform:translateX(8px);opacity:.35}to{transform:translateX(0);opacity:1} }
@media(max-width:600px) { .md-lesson-visual{gap:10px} .md-lesson-visual .md-motion{width:65px;height:80px} .md-lesson-demo{padding:9px} .md-demo-row{font-size:11px;padding:8px 5px} }
@media(prefers-reduced-motion:reduce) { .md-demo-row.is-current{animation:none} }
@keyframes md-lesson-in { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:translateY(0)} }
@media(prefers-reduced-motion:reduce) { .md-motion *, .md-snap-once .logo-mark, .md-lesson-step { animation:none!important;transform:none!important; } .md-motion .snap-sparks { opacity:1; } .md-response { stroke-dashoffset:0!important;opacity:.5; } .plan-art img { transition:none;transform:none!important; } }
@media(max-width:600px) { .md-cover h2{font-size:32px} .md-cover-footer{font-size:12px} .md-cover-kicker{font-size:10px} .md-section-seal{margin-left:8px} .md-section-seal .md-motion{width:45px;height:50px} .md-lesson{min-height:300px;padding:24px} .md-lesson p{font-size:18px} }
