/* v55: native UI for the approved three-step onboarding design. */
#get-started.dpo-onboarding{--ou:var(--dp-desktop-unit,1px);--dpo-gap:calc(76 * var(--ou));position:relative;isolation:isolate;padding:calc(66 * var(--ou)) 0 calc(84 * var(--ou));background:#07101e;color:#edf3ff;scroll-margin-top:calc(96 * var(--ou))}
.dpo-onboarding .dpo-wrap{width:calc(100% - 80 * var(--ou));max-width:calc(1240 * var(--ou));margin-inline:auto}
.dpo-onboarding .dpo-heading{text-align:center;margin:0 0 calc(44 * var(--ou))}
.dpo-onboarding .dpo-eyebrow{font-size:calc(10 * var(--ou));line-height:1.5;font-weight:650;letter-spacing:.32em;text-transform:uppercase;color:#b1c1f2;margin:0 0 calc(22 * var(--ou))}
.dpo-onboarding h2{font-size:calc(60 * var(--ou));line-height:1.08;letter-spacing:-.05em;font-weight:650;color:#f3f6ff;margin:0}
.dpo-onboarding h2 span{color:#a4b5ff;background:linear-gradient(110deg,#d6dfff,#999af9);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.dpo-onboarding .dpo-intro{color:#a5b9df;font-size:calc(17 * var(--ou));line-height:1.65;margin:calc(19 * var(--ou)) auto 0;max-width:55em}
.dpo-onboarding .dpo-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--dpo-gap);margin:0;padding:0;list-style:none}
.dpo-onboarding .dpo-step{position:relative;min-width:0;text-align:center}
.dpo-onboarding .dpo-number{position:relative;z-index:2;display:grid;place-items:center;width:calc(46 * var(--ou));height:calc(46 * var(--ou));margin:0 auto calc(28 * var(--ou));border:calc(1.5 * var(--ou)) solid #7aa9ff;border-radius:50%;background:radial-gradient(circle at 35% 15%,#182d4e,#0a162b 80%);color:#f4f7ff;font-size:calc(15 * var(--ou));font-weight:600;box-shadow:0 0 calc(16 * var(--ou)) #3783ff35,inset 0 0 calc(8 * var(--ou)) #6699ff13}
.dpo-onboarding .dpo-connector{position:absolute;z-index:0;left:50%;top:calc(23 * var(--ou));width:calc(100% + var(--dpo-gap));height:1px;background:linear-gradient(90deg,#7ba9f788,#4392ffe0,#7ba9f788);overflow:visible;pointer-events:none}
.dpo-onboarding .dpo-connector i{position:absolute;top:-1px;left:0;width:calc(42 * var(--ou));height:calc(2 * var(--ou));border-radius:50%;background:linear-gradient(90deg,transparent,#5d9dff,#eef8ff,#5d9dff,transparent);box-shadow:0 0 calc(7 * var(--ou)) #4d9cffb3;opacity:0}
.dpo-onboarding .dpo-visual{position:relative;z-index:1;height:calc(210 * var(--ou));width:100%;border:1px solid #86b3e5;border-radius:calc(12 * var(--ou));background:radial-gradient(ellipse at 30% 0%,#19345077,transparent 65%),linear-gradient(135deg,#0d1d32,#091426 55%,#112740);box-shadow:inset 0 1px 0 #e3f0ff24,inset 0 0 calc(21 * var(--ou)) #426db51a;text-align:left}
.dpo-onboarding .dpo-visual::after{content:"";position:absolute;z-index:-1;pointer-events:none;left:-5%;right:-5%;height:calc(18 * var(--ou));bottom:calc(-19 * var(--ou));background:radial-gradient(ellipse at 50% 0%,#7eafff80,#347fe838 28%,transparent 72%);filter:blur(calc(3 * var(--ou)))}
.dpo-onboarding .dpo-step-copy{margin-top:calc(35 * var(--ou))}
.dpo-onboarding h3{font-size:calc(25 * var(--ou));font-weight:600;letter-spacing:-.035em;line-height:1.2;color:#f4f6ff;margin:0 0 calc(11 * var(--ou))}
.dpo-onboarding .dpo-step-copy p{font-size:calc(15 * var(--ou));line-height:1.65;color:#a9bde4;margin:0}
.dpo-onboarding svg{display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.dpo-onboarding .dpo-browserbar{height:calc(35 * var(--ou));padding:0 calc(15 * var(--ou));display:flex;align-items:center;gap:calc(15 * var(--ou));border-bottom:1px solid #7196cd33;background:linear-gradient(180deg,#223c6080,#152a4344);border-radius:calc(12 * var(--ou)) calc(12 * var(--ou)) 0 0}
.dpo-onboarding .dpo-browserbar>span{display:flex;gap:calc(5 * var(--ou))}
.dpo-onboarding .dpo-browserbar i{width:calc(7 * var(--ou));height:calc(7 * var(--ou));border:1px solid #799dda66;border-radius:50%;background:#355583}
.dpo-onboarding .dpo-browserbar b{height:calc(9 * var(--ou));flex:1;border-radius:calc(5 * var(--ou));background:linear-gradient(90deg,#294266,#385481);border:1px solid #7294c633}
.dpo-onboarding .dpo-store-body{display:grid;grid-template-columns:calc(65 * var(--ou)) minmax(0,1fr);height:calc(100% - 35 * var(--ou))}
.dpo-onboarding .dpo-sidebar{border-right:1px solid #7196cd2b;padding:calc(18 * var(--ou)) calc(14 * var(--ou));display:flex;flex-direction:column;gap:calc(14 * var(--ou))}
.dpo-onboarding .dpo-sidebar i{height:calc(6 * var(--ou));width:100%;border-radius:calc(4 * var(--ou));background:linear-gradient(90deg,#466896,#233c63);box-shadow:inset 0 1px 0 #b3d3ff0d}
.dpo-onboarding .dpo-store-content{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:calc(7 * var(--ou));padding:calc(10 * var(--ou))}
.dpo-onboarding img.dpo-bag{display:block;height:calc(61 * var(--ou));width:calc(54 * var(--ou));object-fit:contain}
.dpo-onboarding .dpo-store-label{font-size:calc(15 * var(--ou));color:#edf2ff;line-height:1.4}
.dpo-onboarding .dpo-connected{display:flex;align-items:center;gap:calc(9 * var(--ou));font-size:calc(11 * var(--ou));line-height:1.2;color:#eef5ff;padding:calc(5 * var(--ou)) calc(12 * var(--ou)) calc(5 * var(--ou)) calc(6 * var(--ou));border:1px solid #5d98f6;border-radius:calc(24 * var(--ou));background:linear-gradient(110deg,#1a4378,#112341);box-shadow:inset 0 0 calc(8 * var(--ou)) #59a8ff22}
.dpo-onboarding .dpo-connected i{display:grid;place-items:center;width:calc(22 * var(--ou));height:calc(22 * var(--ou));border-radius:50%;background:linear-gradient(135deg,#92d0ff,#2d84ed);box-shadow:0 0 calc(8 * var(--ou)) #519dff55}
.dpo-onboarding .dpo-connected svg{width:70%;height:70%;stroke-width:2.4}
.dpo-onboarding .dpo-rules{padding:calc(23 * var(--ou)) calc(16 * var(--ou)) calc(17 * var(--ou))}
.dpo-onboarding .dpo-rules-inner{height:100%;padding:calc(10 * var(--ou));border:1px solid #6c94ca40;border-radius:calc(9 * var(--ou));background:linear-gradient(145deg,#14243b,#0c182b);display:flex;flex-direction:column;gap:calc(7 * var(--ou))}
.dpo-onboarding .dpo-rules-title{display:flex;align-items:center;gap:calc(15 * var(--ou));font-size:calc(14 * var(--ou));color:#e7f0ff;margin:0 calc(4 * var(--ou)) calc(2 * var(--ou));min-height:calc(26 * var(--ou))}
.dpo-onboarding .dpo-rules-title svg{width:calc(24 * var(--ou));height:calc(24 * var(--ou));flex:none}
.dpo-onboarding .dpo-setting{display:flex;align-items:center;justify-content:space-between;gap:calc(8 * var(--ou));min-height:calc(44 * var(--ou));flex:1;padding:calc(9 * var(--ou)) calc(14 * var(--ou));border:1px solid #6587b52d;border-radius:calc(8 * var(--ou));background:linear-gradient(115deg,#192e4c,#15253d);color:#f0f5ff;font-size:calc(13 * var(--ou))}
.dpo-onboarding .dpo-toggle{position:relative;display:block;flex:none;width:calc(40 * var(--ou));height:calc(22 * var(--ou));border-radius:calc(22 * var(--ou));background:linear-gradient(100deg,#3372ff,#3ba4ff);box-shadow:0 0 calc(12 * var(--ou)) #3487ff33}
.dpo-onboarding .dpo-toggle::after{content:"";position:absolute;right:calc(2 * var(--ou));top:calc(2 * var(--ou));width:calc(18 * var(--ou));height:calc(18 * var(--ou));border-radius:50%;background:#f2f7ff;box-shadow:0 1px 3px #00296799}
.dpo-onboarding .dpo-launch{display:flex;flex-direction:column;align-items:center;padding:calc(24 * var(--ou)) calc(18 * var(--ou)) calc(14 * var(--ou))}
.dpo-onboarding .dpo-success{display:grid;place-items:center;flex:none;width:calc(62 * var(--ou));height:calc(62 * var(--ou));border:calc(3 * var(--ou)) solid #4e9aff;border-radius:50%;background:#0d1c33;box-shadow:0 0 calc(19 * var(--ou)) #3274cb25,inset 0 0 calc(8 * var(--ou)) #5e9de41a;color:#f0f5ff}
.dpo-onboarding .dpo-success svg{width:70%;height:70%;stroke-width:3.6}
.dpo-onboarding .dpo-success path{stroke-dasharray:1;stroke-dashoffset:0}
.dpo-onboarding .dpo-launch>strong{font-size:calc(16 * var(--ou));font-weight:600;line-height:1.3;color:#f5f7ff;margin:calc(9 * var(--ou)) 0 calc(14 * var(--ou));letter-spacing:-.025em}
.dpo-onboarding .dpo-receipt{width:100%;padding:calc(7 * var(--ou)) calc(13 * var(--ou));background:linear-gradient(135deg,#132740,#101d31);border:1px solid #668fc138;border-radius:calc(8 * var(--ou));font-size:calc(10.5 * var(--ou));line-height:1.4;color:#a7c0e9}
.dpo-onboarding .dpo-receipt>div{display:flex;align-items:center;justify-content:space-between;gap:calc(8 * var(--ou));padding:calc(3 * var(--ou)) 0}
.dpo-onboarding .dpo-receipt>div+div{border-top:1px solid #7a9dcb30;margin-top:calc(3 * var(--ou));padding-top:calc(6 * var(--ou))}
.dpo-onboarding .dpo-receipt b{font-weight:400;color:#c4d7ff}
.dpo-onboarding .dpo-action{text-align:center;margin-top:calc(49 * var(--ou))}
.dpo-onboarding .dpo-cta{display:inline-flex;align-items:center;justify-content:center;gap:calc(20 * var(--ou));min-height:calc(55 * var(--ou));padding:calc(9 * var(--ou)) calc(17 * var(--ou)) calc(9 * var(--ou)) calc(29 * var(--ou));border-radius:calc(11 * var(--ou));border:1px solid #e6edff;background:#f7f9ff;color:#0a1323;text-decoration:none;font-size:calc(16 * var(--ou));font-weight:650;box-shadow:0 calc(6 * var(--ou)) calc(28 * var(--ou)) #5a8dff18;transition:transform .2s ease,box-shadow .2s ease}
.dpo-onboarding .dpo-cta b{display:grid;place-items:center;width:calc(35 * var(--ou));height:calc(35 * var(--ou));border-radius:calc(8 * var(--ou));background:linear-gradient(135deg,#7274ff,#3b53f2);box-shadow:inset 0 1px 3px #ccd5ff55;color:white}
.dpo-onboarding .dpo-cta svg{width:65%;height:65%;stroke-width:2.2}
.dpo-onboarding .dpo-cta:hover{transform:translateY(-2px);box-shadow:0 calc(8 * var(--ou)) calc(32 * var(--ou)) #5a8dff2b}
.dpo-onboarding .dpo-cta:focus-visible{outline:3px solid #9ebcff;outline-offset:5px}
/* Progressive enhancement: content is fully visible without JavaScript. */
.dpo-onboarding.dpo-motion .dpo-step{--step-delay:calc(var(--step-order) * 180ms)}
.dpo-onboarding.dpo-motion .dpo-number,.dpo-onboarding.dpo-motion .dpo-visual,.dpo-onboarding.dpo-motion .dpo-step-copy{opacity:.18;transform:translateY(calc(14 * var(--ou)));transition:opacity .55s ease,transform .65s cubic-bezier(.2,.7,.3,1);transition-delay:var(--step-delay)}
.dpo-onboarding.dpo-motion .dpo-step.dpo-entered .dpo-number,.dpo-onboarding.dpo-motion .dpo-step.dpo-entered .dpo-visual,.dpo-onboarding.dpo-motion .dpo-step.dpo-entered .dpo-step-copy{opacity:1;transform:none}
.dpo-onboarding.dpo-motion .dpo-connector{opacity:.15;transition:opacity .65s ease;transition-delay:var(--step-delay)}
.dpo-onboarding.dpo-motion .dpo-step.dpo-entered .dpo-connector{opacity:1}
.dpo-onboarding.dpo-motion .dpo-toggle::after{transform:translateX(calc(-18 * var(--ou)));transition:transform .4s cubic-bezier(.2,.7,.3,1);transition-delay:calc(var(--step-delay) + 160ms)}
.dpo-onboarding.dpo-motion .dpo-entered .dpo-toggle::after{transform:none}
.dpo-onboarding.dpo-motion .dpo-success path{stroke-dashoffset:1;transition:stroke-dashoffset .55s ease;transition-delay:calc(var(--step-delay) + 160ms)}
.dpo-onboarding.dpo-motion .dpo-entered .dpo-success path{stroke-dashoffset:0}
.dpo-onboarding.dpo-motion .dpo-step.dpo-entered .dpo-connector i{animation:dpo-signal 2.7s ease-in-out infinite;animation-delay:calc(var(--step-delay) + .4s);animation-play-state:paused}
.dpo-onboarding.dpo-motion.dpo-visible .dpo-step.dpo-entered .dpo-connector i{animation-play-state:running}
@keyframes dpo-signal{0%{left:8%;opacity:0;transform:scaleX(.6)}18%{opacity:.85}72%{opacity:.85}88%,100%{left:82%;opacity:0;transform:scaleX(1)}}
@media(max-width:1100px){#get-started.dpo-onboarding{--dpo-gap:32px}.dpo-onboarding .dpo-wrap{width:calc(100% - 48px)}.dpo-onboarding h2{font-size:52px}.dpo-onboarding h3{font-size:22px}.dpo-onboarding .dpo-step-copy p{font-size:14px}.dpo-onboarding .dpo-store-body{grid-template-columns:48px minmax(0,1fr)}.dpo-onboarding .dpo-sidebar{padding-inline:10px}.dpo-onboarding .dpo-rules{padding-inline:12px}.dpo-onboarding .dpo-setting{padding-inline:10px}.dpo-onboarding .dpo-rules-title{gap:10px}.dpo-onboarding .dpo-launch{padding-inline:12px}.dpo-onboarding .dpo-receipt{padding-inline:9px;font-size:10px}}
@media(max-width:800px){#get-started.dpo-onboarding{padding:58px 0 68px;--dpo-gap:0px}.dpo-onboarding .dpo-wrap{width:calc(100% - 40px);max-width:540px}.dpo-onboarding .dpo-heading{margin-bottom:36px}.dpo-onboarding .dpo-eyebrow{font-size:9px;letter-spacing:.23em;margin-bottom:17px}.dpo-onboarding h2{font-size:clamp(31px,6.6vw,48px)}.dpo-onboarding .dpo-intro{font-size:14px;max-width:350px;margin-top:17px}.dpo-onboarding .dpo-steps{grid-template-columns:1fr;gap:46px}.dpo-onboarding .dpo-step{max-width:390px;width:100%;margin-inline:auto}.dpo-onboarding .dpo-connector{display:none}.dpo-onboarding .dpo-number{width:42px;height:42px;font-size:14px;margin-bottom:23px}.dpo-onboarding .dpo-visual{height:220px}.dpo-onboarding .dpo-step-copy{margin-top:28px}.dpo-onboarding h3{font-size:24px;margin-bottom:8px}.dpo-onboarding .dpo-step-copy p{font-size:14px}.dpo-onboarding .dpo-store-body{grid-template-columns:65px minmax(0,1fr)}.dpo-onboarding .dpo-rules{padding:24px 20px 18px}.dpo-onboarding .dpo-setting{padding-inline:15px}.dpo-onboarding .dpo-launch{padding:26px 20px 15px}.dpo-onboarding .dpo-receipt{font-size:11px}.dpo-onboarding .dpo-action{margin-top:40px}.dpo-onboarding .dpo-cta{min-height:54px;font-size:16px}.dpo-onboarding.dpo-motion .dpo-step{--step-delay:0ms}}
@media(max-width:380px){.dpo-onboarding .dpo-wrap{width:calc(100% - 32px)}.dpo-onboarding h2{font-size:30px}.dpo-onboarding .dpo-rules{padding-inline:14px}.dpo-onboarding .dpo-launch{padding-inline:14px}}
@media(prefers-reduced-motion:reduce){.dpo-onboarding *,.dpo-onboarding *::before,.dpo-onboarding *::after{animation:none!important;transition:none!important}.dpo-onboarding .dpo-step .dpo-number,.dpo-onboarding .dpo-step .dpo-visual,.dpo-onboarding .dpo-step .dpo-step-copy,.dpo-onboarding .dpo-connector{opacity:1!important;transform:none!important}.dpo-onboarding .dpo-toggle::after{transform:none!important}.dpo-onboarding .dpo-success path{stroke-dashoffset:0!important}.dpo-onboarding .dpo-connector i{display:none}.dpo-onboarding .dpo-cta:hover{transform:none}}