/* 50-option technical motif gallery. Loaded after the original gallery CSS. */
.dual-icon-gallery{width:min(1320px,calc(100% - 3rem))}.dual-icon-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.dual-icon-card{min-height:310px}.dual-icon-stage.motif{height:178px;color:var(--dual-accent);position:relative;display:grid;place-items:center;overflow:hidden}.motif svg{width:125px;height:125px;fill:none;stroke:currentColor;stroke-width:1.2;overflow:visible}.motif i,.motif b,.motif span{box-sizing:border-box}.ellipse,.ring,.sphere,.globe,.dotted-ring,.radar-ring,.target-ring,.contour,.torus,.mobius,.dial,.gauge{position:absolute;border:1px solid currentColor;border-radius:50%}
/* 01 Orbit */.motif-1 .ellipse{width:94px;height:48px;animation:m-spin 8s linear infinite}.motif-1 .e2{transform:rotate(60deg);animation-duration:11s}.motif-1 .e3{transform:rotate(-55deg);animation-duration:13s;animation-direction:reverse}
/* 02 Rings */.motif-2 .ring{width:105px;height:105px}.motif-2 .r2{width:74px;height:74px;border-style:dashed;animation:m-spin 9s linear infinite}.motif-2 .r3{width:35px;height:35px;animation:m-pulse 2.4s ease-in-out infinite}
/* 03 Network */.motif-3 .net-line{position:absolute;width:108px;border-top:1px solid currentColor}.motif-3 .nl1{transform:rotate(28deg)}.motif-3 .nl2{transform:rotate(-35deg)}.motif-3 .node{position:absolute;width:8px;height:8px;border:1px solid currentColor;border-radius:50%;background:var(--dual-bg-elev);animation:m-pulse 2.2s infinite}.motif-3 .n1{left:26%;top:48%}.motif-3 .n2{right:24%;top:28%;animation-delay:-.4s}.motif-3 .n3{right:27%;bottom:25%;animation-delay:-.8s}.motif-3 .n4{left:48%;top:24%;animation-delay:-1.2s}.motif-3 .n5{left:49%;bottom:18%;animation-delay:-1.6s}
/* 04 Polygon */.motif-4 svg{animation:m-spin 17s linear infinite}.motif-4 circle{fill:var(--dual-bg-elev)}
/* 05 Cloud */.motif-5 .particle,.motif-16 .flow-particle,.motif-18 .diff-dot,.motif-37 .swarm{position:absolute;width:6px;height:6px;border-radius:50%;background:currentColor}.motif-5 .particle{animation:m-cloud 4s ease-in-out infinite alternate}.motif-5 .p1,.motif-16 .fp1,.motif-18 .dd1,.motif-37 .s1{left:28%;top:32%}.motif-5 .p2,.motif-16 .fp2,.motif-18 .dd2,.motif-37 .s2{left:36%;top:25%}.motif-5 .p3,.motif-16 .fp3,.motif-18 .dd3,.motif-37 .s3{left:46%;top:34%}.motif-5 .p4,.motif-16 .fp4,.motif-18 .dd4,.motif-37 .s4{left:58%;top:26%}.motif-5 .p5,.motif-16 .fp5,.motif-18 .dd5,.motif-37 .s5{left:67%;top:39%}.motif-5 .p6,.motif-16 .fp6,.motif-18 .dd6,.motif-37 .s6{left:30%;top:51%}.motif-5 .p7,.motif-16 .fp7,.motif-18 .dd7,.motif-37 .s7{left:40%;top:56%}.motif-5 .p8,.motif-16 .fp8,.motif-18 .dd8,.motif-37 .s8{left:53%;top:49%}.motif-5 .p9,.motif-16 .fp9,.motif-18 .dd9,.motif-37 .s9{left:64%;top:58%}.motif-5 .p10,.motif-16 .fp10,.motif-18 .dd10,.motif-37 .s10{left:37%;top:67%}.motif-5 .p11,.motif-16 .fp11,.motif-18 .dd11,.motif-37 .s11{left:49%;top:70%}.motif-5 .p12,.motif-16 .fp12,.motif-18 .dd12,.motif-37 .s12{left:61%;top:72%}.motif-5 .p13,.motif-16 .fp13,.motif-18 .dd13{left:42%;top:42%}.motif-5 .p14,.motif-16 .fp14,.motif-18 .dd14{left:56%;top:61%}.motif-5 .p15,.motif-16 .fp15,.motif-18 .dd15{left:32%;top:41%}.motif-5 .p16,.motif-16 .fp16,.motif-18 .dd16{left:69%;top:31%}.motif-5 .p17,.motif-16 .fp17,.motif-18 .dd17{left:25%;top:63%}.motif-5 .p18,.motif-16 .fp18,.motif-18 .dd18{left:70%;top:67%}
/* 06 Particle sphere */.motif-6 .sphere{width:94px;height:94px;animation:m-spin 12s linear infinite}.motif-6 .s2{height:42px}.motif-6 .s3{width:42px;transform:rotate(90deg)}.motif-6 .sphere-dot{position:absolute;width:5px;height:5px;border-radius:50%;background:currentColor}.motif-6 .sd1{transform:translate(-42px,-8px)}.motif-6 .sd2{transform:translate(38px,13px)}.motif-6 .sd3{transform:translate(-19px,-39px)}.motif-6 .sd4{transform:translate(17px,41px)}.motif-6 .sd5{transform:translate(5px,-21px)}.motif-6 .sd6{transform:translate(-6px,23px)}.motif-6 .sd7{transform:translate(31px,-27px)}.motif-6 .sd8{transform:translate(-30px,29px)}
/* 07 Wireframe sphere */.motif-7 .globe{width:98px;height:98px}.motif-7 .g2{width:48px}.motif-7 .g3{height:46px}.motif-7 .globe-axis{position:absolute;width:112px;border-top:1px solid currentColor;transform:rotate(25deg);animation:m-spin 12s linear infinite}
/* 08 Dotted ring */.motif-8 .dotted-ring{width:102px;height:102px;border-style:dashed;animation:m-spin 8s linear infinite}.motif-8 .dr2{width:62px;height:62px;animation-direction:reverse;animation-duration:5s}.motif-8 .core-dot{width:9px;height:9px;border-radius:50%;background:currentColor}
/* 09 Radar */.motif-9 .radar-ring{width:100px;height:100px}.motif-9 .rr2{width:58px;height:58px;opacity:.65}.motif-9 .sweep{position:absolute;width:50px;border-top:1px solid currentColor;transform-origin:left;animation:m-spin 3.2s linear infinite}.motif-9 .blip{position:absolute;width:6px;height:6px;border-radius:50%;background:currentColor;animation:m-pulse 1.6s infinite}.motif-9 .b1{left:41%;top:34%}.motif-9 .b2{right:31%;bottom:31%;animation-delay:-.7s}
/* 10 Target */.motif-10 .target-ring{width:100px;height:100px}.motif-10 .tr2{width:58px;height:58px;border-style:dashed}.motif-10 .cross{position:absolute;background:currentColor}.motif-10 .cx{width:112px;height:1px}.motif-10 .cy{height:112px;width:1px}.motif-10 .target-dot{position:absolute;width:8px;height:8px;border-radius:50%;background:currentColor;animation:m-target 4s ease-in-out infinite}
/* 11/12 Waves */.motif-11 .wave,.motif-12 .wave{fill:none;stroke:currentColor;stroke-width:2;stroke-dasharray:7 5;animation:m-dash 2.5s linear infinite}.motif-12 .w2{animation-direction:reverse;opacity:.65}
/* 13/14 Spiral */.motif-13 .spiral,.motif-14 .spiral{position:absolute;width:100px;height:100px;border:1px solid currentColor;border-radius:50%;clip-path:polygon(50% 0,100% 0,100% 100%,0 100%,0 50%);animation:m-spin 7s linear infinite}.motif-13 .spiral:before,.motif-13 .spiral:after,.motif-14 .spiral:before,.motif-14 .spiral:after{content:"";position:absolute;border:1px solid currentColor;border-radius:50%}.motif-13 .spiral:before,.motif-14 .spiral:before{inset:14px}.motif-13 .spiral:after,.motif-14 .spiral:after{inset:28px}.motif-13 .runner{position:absolute;width:7px;height:7px;border-radius:50%;background:currentColor;animation:m-target 3s ease-in-out infinite}.motif-14 .sp2{transform:rotate(180deg);animation-direction:reverse;animation-duration:10s}
/* 15 Helix */.motif-15 .helix{position:relative;width:115px;height:105px}.motif-15 .helix i,.motif-15 .helix b{position:absolute;width:8px;height:8px;border-radius:50%;background:currentColor;animation:m-helix 3s ease-in-out infinite}.motif-15 .helix b{opacity:.4}.motif-15 .h1,.motif-15 .hb1{top:5%}.motif-15 .h2,.motif-15 .hb2{top:16%}.motif-15 .h3,.motif-15 .hb3{top:27%}.motif-15 .h4,.motif-15 .hb4{top:38%}.motif-15 .h5,.motif-15 .hb5{top:49%}.motif-15 .h6,.motif-15 .hb6{top:60%}.motif-15 .h7,.motif-15 .hb7{top:71%}.motif-15 .h8,.motif-15 .hb8{top:82%}.motif-15 .h9,.motif-15 .hb9{top:93%}.motif-15 .helix b{animation-direction:reverse}
/* 16 Flow field */.motif-16 .flow-particle{animation:m-flow 4s linear infinite}.motif-16 .fp2,.motif-16 .fp7,.motif-16 .fp12{animation-delay:-1s}.motif-16 .fp4,.motif-16 .fp9,.motif-16 .fp14{animation-delay:-2s}
/* 17 Vectors */.motif-17{grid-template-columns:repeat(3,27px);grid-auto-rows:27px;gap:10px;align-content:center;justify-content:center}.motif-17 .vec{font-style:normal;animation:m-vector 2.8s ease-in-out infinite}.motif-17 .v2,.motif-17 .v5,.motif-17 .v8{animation-delay:-.7s}.motif-17 .v3,.motif-17 .v6,.motif-17 .v9{animation-delay:-1.4s}
/* 18 Diffusion */.motif-18 .diff-dot{animation:m-diffuse 3.4s ease-in-out infinite}.motif-18 .diff-core{width:14px;height:14px;border:1px solid currentColor;border-radius:50%}
/* 19 Gradient descent */.motif-19 .descent{stroke:currentColor;stroke-width:1.5;stroke-dasharray:4 4}.motif-19 .descent-dot{fill:currentColor;stroke:none;animation:m-descent 3.8s ease-in-out infinite}
/* 20 Contours */.motif-20 .contour{width:112px;height:72px}.motif-20 .c2{width:78px;height:48px}.motif-20 .c3{width:42px;height:25px}.motif-20 .minimum{width:7px;height:7px;background:currentColor;border-radius:50%;animation:m-pulse 2s infinite}
/* 21 Landscape */.motif-21 .landscape{width:120px;height:90px;position:relative;transform:skewX(-12deg)}.motif-21 .ridge{position:absolute;left:0;width:100%;height:18px;border-top:1px solid currentColor;border-radius:50%;animation:m-landscape 3s ease-in-out infinite}.motif-21 .r1{top:8px}.motif-21 .r2{top:20px}.motif-21 .r3{top:32px}.motif-21 .r4{top:44px}.motif-21 .r5{top:56px}.motif-21 .r6{top:68px}.motif-21 .r7{top:80px}.motif-21 .loss-dot{position:absolute;width:7px;height:7px;border-radius:50%;background:currentColor;left:62%;top:42%;animation:m-pulse 1.8s infinite}
/* 22/23 Matrix */.motif-22,.motif-23{grid-template-columns:repeat(5,18px);grid-auto-rows:18px;gap:5px;align-content:center;justify-content:center}.motif-22 .cell,.motif-23 .attn-cell{width:18px;height:18px;border:1px solid color-mix(in srgb,var(--dual-accent) 45%,transparent);animation:m-cell 2.6s ease-in-out infinite}.motif-23 .c3,.motif-23 .c8,.motif-23 .c13,.motif-23 .c17,.motif-23 .c22{background:color-mix(in srgb,var(--dual-accent) 38%,transparent);animation-delay:-1s}
/* 24 Token */.motif-24 .tokens{display:flex;gap:8px}.motif-24 .tokens i,.motif-25 .draft-line i,.motif-25 .verify-line i{width:12px;height:12px;border:1px solid currentColor;border-radius:3px;animation:m-token 2.6s linear infinite}.motif-24 .tokens i:nth-child(2){animation-delay:-.4s}.motif-24 .tokens i:nth-child(3){animation-delay:-.8s}.motif-24 .tokens i:nth-child(4){animation-delay:-1.2s}.motif-24 .tokens i:nth-child(5){animation-delay:-1.6s}.motif-24 .tokens i:nth-child(6){animation-delay:-2s}.motif-24 .token-gate{position:absolute;right:29%;height:72px;border-left:1px solid currentColor}
/* 25 Draft verify */.motif-25 .draft-line,.motif-25 .verify-line{position:absolute;display:flex;gap:7px}.motif-25 .draft-line{left:17%}.motif-25 .verify-line{right:17%}.motif-25 .verify-core{width:36px;height:36px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;background:var(--dual-bg-elev);z-index:2}
/* 26 Tree */.motif-26 .tree{position:absolute;background:currentColor;transform-origin:left}.motif-26 .trunk{width:60px;height:1px;transform:rotate(0deg)}.motif-26 .branch{width:48px;height:1px;left:51%}.motif-26 .b1{transform:rotate(-35deg)}.motif-26 .b2{transform:rotate(35deg)}.motif-26 .b3{transform:rotate(0deg)}.motif-26 .leaf{position:absolute;width:8px;height:8px;border:1px solid currentColor;border-radius:50%;animation:m-pulse 2.3s infinite}.motif-26 .l1{right:24%;top:27%}.motif-26 .l2{right:17%;top:50%}.motif-26 .l3{right:24%;bottom:27%}.motif-26 .l4{left:31%;top:48%}
/* 27 Beams */.motif-27 .beam{position:absolute;left:18%;width:100px;border-top:1px solid currentColor;transform-origin:left}.motif-27 .bm1{transform:rotate(-25deg)}.motif-27 .bm2{transform:rotate(-8deg)}.motif-27 .bm3{transform:rotate(9deg)}.motif-27 .bm4{transform:rotate(26deg)}.motif-27 .bm2{border-top-width:2px}.motif-27 .beam-choice{position:absolute;right:20%;width:9px;height:9px;border-radius:50%;background:currentColor;animation:m-pulse 1.8s infinite}
/* 28 Queue */.motif-28 .queue{display:flex;gap:8px;transform:translateX(-18px)}.motif-28 .queue i{font-style:normal;width:24px;height:24px;border:1px solid currentColor;display:grid;place-items:center;animation:m-queue 3s linear infinite}.motif-28 .scheduler{position:absolute;right:16%;width:38px;height:38px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center}
/* 29 Distributed ring */.motif-29 .hub,.motif-30 .hub{position:absolute;width:22px;height:22px;border:1px solid currentColor;border-radius:50%}.motif-29 .node-orbit{position:absolute;width:115px;height:115px;border:1px dashed currentColor;border-radius:50%;animation:m-spin 14s linear infinite}.motif-29 .ring-node{position:absolute;width:8px;height:8px;border:1px solid currentColor;border-radius:50%;background:var(--dual-bg-elev)}.motif-29 .rn1{transform:translate(0,-57px)}.motif-29 .rn2{transform:translate(40px,-40px)}.motif-29 .rn3{transform:translate(57px,0)}.motif-29 .rn4{transform:translate(40px,40px)}.motif-29 .rn5{transform:translate(0,57px)}.motif-29 .rn6{transform:translate(-40px,40px)}.motif-29 .rn7{transform:translate(-57px,0)}.motif-29 .rn8{transform:translate(-40px,-40px)}
/* 30 Federated star */.motif-30 .client{position:absolute;width:10px;height:10px;border:1px solid currentColor;border-radius:50%}.motif-30 .client1{transform:translate(0,-56px)}.motif-30 .client2{transform:translate(49px,-28px)}.motif-30 .client3{transform:translate(49px,28px)}.motif-30 .client4{transform:translate(0,56px)}.motif-30 .client5{transform:translate(-49px,28px)}.motif-30 .client6{transform:translate(-49px,-28px)}.motif-30 .packet{position:absolute;width:5px;height:5px;border-radius:50%;background:currentColor;animation:m-packet 2.6s ease-in-out infinite}.motif-30 .pk2{animation-delay:-.4s}.motif-30 .pk3{animation-delay:-.8s}.motif-30 .pk4{animation-delay:-1.2s}.motif-30 .pk5{animation-delay:-1.6s}.motif-30 .pk6{animation-delay:-2s}
/* 31 Mesh */.motif-31 .mesh-node{position:absolute;width:8px;height:8px;border:1px solid currentColor;border-radius:50%;background:var(--dual-bg-elev)}.motif-31 .m1{left:28%;top:30%}.motif-31 .m2{left:52%;top:22%}.motif-31 .m3{right:26%;top:38%}.motif-31 .m4{right:30%;bottom:26%}.motif-31 .m5{left:48%;bottom:20%}.motif-31 .m6{left:25%;bottom:34%}.motif-31 .m7{left:48%;top:48%;animation:m-pulse 2s infinite}.motif-31 .mesh-lines{position:absolute;width:105px;height:105px;border:1px dashed currentColor;clip-path:polygon(50% 0,90% 30%,75% 85%,20% 80%,5% 35%);animation:m-spin 18s linear infinite}
/* 32 Edge cloud */.motif-32 .layer{position:absolute;width:44px;height:44px;border:1px solid currentColor;display:grid;place-items:center}.motif-32 .l1{left:17%}.motif-32 .l2{left:42%}.motif-32 .l3{right:17%}.motif-32 .flow-dot{position:absolute;width:7px;height:7px;border-radius:50%;background:currentColor;animation:m-layer 3.1s linear infinite}
/* 33 Coverage */.motif-33 .tower{position:absolute;width:5px;height:20px;background:currentColor;bottom:38%}.motif-33 .tw1{left:27%}.motif-33 .tw2{left:49%}.motif-33 .tw3{right:27%}.motif-33 .coverage{position:absolute;width:48px;height:48px;border:1px solid currentColor;border-radius:50%;bottom:29%;animation:m-pulse 2.6s ease-in-out infinite}.motif-33 .cv1{left:18%}.motif-33 .cv2{left:40%;animation-delay:-.8s}.motif-33 .cv3{right:18%;animation-delay:-1.6s}
/* 34 Hex */.motif-34 .hex-grid{position:relative;width:120px;height:100px}.motif-34 .hex{position:absolute;width:38px;height:34px;border:1px solid currentColor;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);animation:m-cell 2.8s ease-in-out infinite}.motif-34 .hx1{left:41px;top:0}.motif-34 .hx2{left:20px;top:30px}.motif-34 .hx3{left:62px;top:30px}.motif-34 .hx4{left:0;top:60px}.motif-34 .hx5{left:41px;top:60px}.motif-34 .hx6{left:82px;top:60px}.motif-34 .hx7{left:41px;top:30px;background:color-mix(in srgb,var(--dual-accent) 16%,transparent)}
/* 35 Packet flow */.motif-35 .route{position:absolute;width:120px;border-top:1px solid currentColor}.motif-35 .router{position:absolute;width:15px;height:15px;border:1px solid currentColor;background:var(--dual-bg-elev)}.motif-35 .rt1{left:20%}.motif-35 .rt2{left:39%}.motif-35 .rt3{right:39%}.motif-35 .rt4{right:20%}.motif-35 .packet-flow{position:absolute;width:7px;height:7px;border-radius:50%;background:currentColor;animation:m-layer 2.5s linear infinite}
/* 36 Graph pulse */.motif-36 svg{animation:m-breathe 3s ease-in-out infinite}.motif-36 circle{fill:var(--dual-bg-elev)}.motif-36 .pulse-node{fill:currentColor;animation:m-pulse 1.8s infinite}
/* 37 Swarm */.motif-37 .swarm{animation:m-swarm 4s ease-in-out infinite alternate}.motif-37 .swarm-goal{width:20px;height:20px;border:1px solid currentColor;border-radius:50%}
/* 38 Consensus */.motif-38 .consensus{position:absolute;width:9px;height:9px;border:1px solid currentColor;border-radius:50%;animation:m-consensus 4s ease-in-out infinite}.motif-38 .q1{transform:translate(-52px,-35px)}.motif-38 .q2{transform:translate(52px,-35px)}.motif-38 .q3{transform:translate(-62px,20px)}.motif-38 .q4{transform:translate(62px,20px)}.motif-38 .q5{transform:translate(-30px,57px)}.motif-38 .q6{transform:translate(30px,57px)}.motif-38 .consensus-core{width:12px;height:12px;background:currentColor;border-radius:50%}
/* 39/40 geometry */.motif-39 .cells,.motif-40 .triangles{stroke:currentColor;stroke-width:1.2;fill:none;animation:m-breathe 4s ease-in-out infinite}.motif-40 .triangles{animation:m-spin 24s linear infinite}
/* 41/42 cubes */.motif-41 .cube,.motif-42 .cube{position:absolute;width:72px;height:72px;animation:m-cube 7s ease-in-out infinite}.motif-41 .front,.motif-41 .back,.motif-42 .front,.motif-42 .back{position:absolute;inset:10px;border:1px solid currentColor}.motif-41 .back,.motif-42 .back{transform:translate(13px,-13px)}.motif-41 .cube i{position:absolute;width:19px;border-top:1px solid currentColor;transform:rotate(-45deg)}.motif-41 .c1{left:6px;top:17px}.motif-41 .c2{right:6px;top:17px}.motif-41 .c3{left:6px;bottom:17px}.motif-41 .c4{right:6px;bottom:17px}.motif-42 .cube-a{transform:scale(1.1);animation:m-spin 12s linear infinite}.motif-42 .cube-b{transform:scale(.58);animation:m-spin 8s linear infinite reverse}
/* 43 Isometric */.motif-43 .iso{display:grid;grid-template-columns:repeat(3,30px);gap:7px;transform:rotate(30deg) skewY(-10deg)}.motif-43 .iso i{width:30px;height:30px;border:1px solid currentColor;animation:m-block 2.8s ease-in-out infinite}.motif-43 .ib2{animation-delay:-.5s}.motif-43 .ib3{animation-delay:-1s}.motif-43 .ib4{animation-delay:-1.5s}.motif-43 .ib5{animation-delay:-2s}
/* 44 Torus */.motif-44 .torus{width:108px;height:48px;animation:m-spin 8s linear infinite}.motif-44 .t2{transform:rotate(60deg);animation-duration:11s}.motif-44 .t3{transform:rotate(-60deg);animation-duration:13s;animation-direction:reverse}
/* 45 Mobius */.motif-45 .mobius{width:110px;height:50px;border-left-color:transparent;animation:m-spin 7s linear infinite}.motif-45 .m2{transform:rotate(90deg);animation-direction:reverse;opacity:.55}
/* 46 Lissajous */.motif-46 .lissajous{stroke:currentColor;stroke-width:1.5;fill:none;stroke-dasharray:7 4;animation:m-dash 2.8s linear infinite}
/* 47 Oscillators */.motif-47 .osc{display:flex;gap:12px;height:105px;align-items:flex-start}.motif-47 .pend{width:1px;height:72px;background:currentColor;transform-origin:top;animation:m-pend 2.4s ease-in-out infinite}.motif-47 .pend i{position:absolute;width:9px;height:9px;border:1px solid currentColor;border-radius:50%;bottom:-4px;left:-4px;background:var(--dual-bg-elev)}.motif-47 .p2{animation-delay:-.25s}.motif-47 .p3{animation-delay:-.5s}.motif-47 .p4{animation-delay:-.75s}.motif-47 .p5{animation-delay:-1s}.motif-47 .p6{animation-delay:-1.25s}
/* 48 Clock */.motif-48 .dial{width:104px;height:104px}.motif-48 .clock-hand{position:absolute;width:45px;border-top:1px solid currentColor;transform-origin:right;right:50%;animation:m-spin 4s linear infinite}.motif-48 .clock-dot{width:8px;height:8px;border-radius:50%;background:currentColor}
/* 49 Gauge */.motif-49 .gauge{width:108px;height:54px;border-bottom:0;border-radius:108px 108px 0 0;bottom:33%}.motif-49 .needle{position:absolute;width:47px;border-top:1px solid currentColor;transform-origin:right;right:50%;bottom:33%;animation:m-needle 3s ease-in-out infinite}.motif-49 .gauge-dot{position:absolute;width:9px;height:9px;border-radius:50%;background:currentColor;bottom:30%}
/* 50 Data stream */.motif-50 .bits{display:flex;gap:9px;font-size:1rem}.motif-50 .bits i{font-style:normal;border:1px solid currentColor;width:23px;height:28px;display:grid;place-items:center;animation:m-token 2.5s linear infinite}.motif-50 .bits i:nth-child(2){animation-delay:-.4s}.motif-50 .bits i:nth-child(3){animation-delay:-.8s}.motif-50 .bits i:nth-child(4){animation-delay:-1.2s}.motif-50 .bits i:nth-child(5){animation-delay:-1.6s}.motif-50 .bits i:nth-child(6){animation-delay:-2s}.motif-50 .data-gate{position:absolute;right:15%;height:72px;border-left:1px solid currentColor}
@keyframes m-spin{to{transform:rotate(360deg)}}@keyframes m-pulse{50%{transform:scale(1.18);opacity:.42}}@keyframes m-cloud{to{transform:translate(6px,-6px) scale(1.12);opacity:.45}}@keyframes m-target{0%,100%{transform:translate(-25px,-18px)}50%{transform:translate(29px,22px)}}@keyframes m-dash{to{stroke-dashoffset:-42}}@keyframes m-helix{0%,100%{left:10%;transform:scale(.7)}50%{left:82%;transform:scale(1.15)}}@keyframes m-flow{0%{transform:translate(-22px,18px);opacity:.2}50%{opacity:1}100%{transform:translate(28px,-16px);opacity:.2}}@keyframes m-vector{50%{transform:rotate(80deg)}}@keyframes m-diffuse{0%,100%{transform:translate(0,0);opacity:.9}50%{transform:translate(calc((var(--x,1))*12px),calc((var(--y,1))*-10px));opacity:.3}}@keyframes m-descent{0%{transform:translate(0,0)}50%{transform:translate(52px,38px)}100%{transform:translate(98px,50px)}}@keyframes m-landscape{50%{transform:translateY(-4px) scaleX(.92)}}@keyframes m-cell{50%{background:color-mix(in srgb,var(--dual-accent) 35%,transparent)}}@keyframes m-token{0%{transform:translateX(-22px);opacity:0}50%{opacity:1}100%{transform:translateX(22px);opacity:0}}@keyframes m-queue{0%{transform:translateX(-24px);opacity:.2}60%{opacity:1}100%{transform:translateX(20px);opacity:.2}}@keyframes m-packet{0%,100%{transform:translate(-40px,0);opacity:.2}50%{transform:translate(0,0);opacity:1}}@keyframes m-layer{0%{transform:translateX(-58px)}100%{transform:translateX(58px)}}@keyframes m-breathe{50%{transform:scale(1.06);opacity:.55}}@keyframes m-swarm{to{transform:translate(10px,-8px) rotate(10deg)}}@keyframes m-consensus{50%{transform:translate(0,0)}}@keyframes m-cube{50%{transform:rotate(18deg) scale(1.08)}}@keyframes m-block{50%{transform:translateY(-8px);background:color-mix(in srgb,var(--dual-accent) 10%,transparent)}}@keyframes m-pend{0%,100%{transform:rotate(-18deg)}50%{transform:rotate(18deg)}}@keyframes m-needle{0%,100%{transform:rotate(-35deg)}50%{transform:rotate(35deg)}}
@media(max-width:1100px){.dual-icon-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:760px){.dual-icon-gallery{width:min(100% - 2rem,1320px)}.dual-icon-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:520px){.dual-icon-grid{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.motif *{animation:none!important}}