/* Motion lives inside the existing illustration frames; typography and layout stay still. */
.motion-enhanced{position:relative;isolation:isolate}
.motion-enhanced .many-clicks i,.motion-enhanced .single-action>svg,.motion-enhanced .click-ring,.motion-enhanced .ai-emblem{animation:none!important}
.motion-enhanced .click-ring{display:none}.motion-enhanced .many-clicks i{position:relative;z-index:4;will-change:transform,opacity}.motion-enhanced .single-action>svg{z-index:7;will-change:transform}
.motion-story-bar{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:10px;height:15px;pointer-events:none;z-index:9}
.motion-story-caption{position:relative;display:flex;align-items:center;gap:6px;font-size:9px;line-height:1.5;letter-spacing:-.02em;color:#8f6bad;white-space:nowrap}
.motion-story-caption:before{content:'';width:4px;height:4px;flex-shrink:0;border-radius:50%;background:#b18ad4;box-shadow:0 0 0 3px #b18ad40b}
.motion-story-steps{display:flex;gap:4px;align-items:center}.motion-story-steps i{width:13px;height:2px;border-radius:2px;background:#e4d9ed;transition:background .3s}.motion-story-steps i.active{background:#a37acd}
.motion-enhanced .one-click{position:relative;min-width:90px;min-height:99px}
.motion-single-check{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);width:83px;opacity:0;pointer-events:none;display:flex;align-items:center;flex-direction:column;gap:7px}
.motion-single-check>svg{height:68px;width:68px;overflow:visible;fill:#f9f4ff;stroke:#9360c7;stroke-width:1.8}.motion-single-check path,.motion-local-check path{stroke-dasharray:40;stroke-dashoffset:40;stroke-linecap:round;stroke-linejoin:round;stroke-width:3;fill:none}.motion-single-check>span{font-size:8px;font-weight:600;white-space:nowrap;color:#8b5cb5;letter-spacing:-.02em}
.motion-execute-ring{position:absolute;pointer-events:none;left:50%;top:21px;width:51px;height:51px;border:1px solid #aa7bd4;border-radius:15px;opacity:0;z-index:0}.motion-enhanced .single-action>img{position:relative;z-index:1}
.motion-enhanced .ai-node>span:not(.ai-emblem){font-size:9px;line-height:1.7;color:#9a83ae;margin-top:8px}
.privacy-diagram>.motion-story-bar{left:18px;right:18px;top:12px}
.pipeline-node{position:relative}.motion-generated-lines{position:absolute;bottom:15px;left:19%;right:19%;height:28px;display:grid;gap:5px;align-content:center;pointer-events:none}
.motion-generated-lines>i{display:block;height:4px;border-radius:4px;background:linear-gradient(90deg,#b38ad7,#d7c2eb);transform-origin:left;opacity:0}.motion-generated-lines>i:nth-child(2){width:85%}.motion-generated-lines>i:nth-child(3){width:66%}
.motion-local-assignments{position:absolute;left:12%;right:12%;bottom:12px;display:grid;gap:4px;pointer-events:none}
.motion-local-assignments>i{display:flex;align-items:center;gap:5px;height:8px;font-style:normal;opacity:0}.motion-local-assignments b{width:6px;height:6px;border-radius:50%;background:#c7b4d8;flex-shrink:0}.motion-local-assignments span{height:3px;border-radius:2px;background:#b694d7;flex:1}.motion-local-assignments>i:nth-child(2)>span{max-width:68%}.motion-local-assignments em{font-style:normal;font-size:8px;color:#9361bc;line-height:1}
.motion-local-check{position:absolute;right:-8px;top:-9px;height:26px;width:26px;opacity:0;pointer-events:none}.motion-local-check svg{height:100%;width:100%;fill:#faf6ff;stroke:#a174cb;stroke-width:2}
.motion-packets{position:absolute;inset:0;pointer-events:none;z-index:6;overflow:visible}.motion-packets>span{position:absolute;display:block;white-space:nowrap;opacity:0;box-shadow:0 4px 12px #7c4b9d13}
.motion-criteria-packet,.motion-student-packet{border:1px solid #ccb0e4;border-radius:5px;padding:5px 7px;background:#fbf8ff;color:#9468b5;font-size:8px;font-weight:600;letter-spacing:-.02em}
.motion-student-packet{border-color:#c3b6d0;background:#f5f0f9;color:#8c789c;font-size:7px;padding:4px 6px}
.motion-phrase-packet{display:grid!important;gap:4px;width:45px;height:32px;padding:7px 6px;background:#fcfaff;border:1px solid #ba96d9;border-radius:5px}.motion-phrase-packet>i{display:block;height:3px;border-radius:3px;background:#c09cdd}.motion-phrase-packet>i:nth-child(2){width:83%}.motion-phrase-packet>i:nth-child(3){width:66%}
.motion-enhanced .no-students{z-index:7;transform-origin:center}.motion-enhanced .local-input{z-index:2}
.motion-static .motion-packets{display:none}.motion-static .motion-single-check{opacity:1!important;transform:translate(-50%,-50%)!important}.motion-static .motion-single-check path,.motion-static .motion-local-check path{stroke-dashoffset:0!important}.motion-static .one-click>b,.motion-static .one-click>span{opacity:0!important}.motion-static .motion-generated-lines>i,.motion-static .motion-local-assignments>i,.motion-static .motion-local-check{opacity:1!important;transform:none!important}.motion-static .ai-node>span:not(.ai-emblem),.motion-static .extension-node>span{opacity:0!important}
@media(max-width:1100px){.motion-story-caption{font-size:8px}.motion-story-steps i{width:10px}.motion-generated-lines{bottom:15px}.motion-enhanced .one-click{min-height:97px}}
@media(max-width:700px){.motion-story-caption{font-size:8px;gap:5px}.motion-story-steps{gap:3px}.motion-story-steps i{width:9px}.click-comparison>.motion-story-bar{top:-10px;height:13px}.privacy-diagram.motion-enhanced{padding-top:45px}.privacy-diagram>.motion-story-bar{left:18px;right:18px;top:14px}.privacy-diagram .motion-story-caption{font-size:8px}.privacy-diagram .motion-story-steps i{width:7px}.motion-generated-lines{left:74px;right:24px;bottom:17px;height:25px;gap:4px}.motion-local-assignments{left:74px;right:35px;bottom:14px;gap:4px}.motion-local-check{right:8px;top:8px;width:22px;height:22px}.motion-enhanced .one-click{min-height:88px;min-width:75px}.motion-single-check{width:75px;top:47%;gap:5px}.motion-single-check>svg{height:57px;width:57px}.motion-single-check>span{font-size:7px}.motion-execute-ring{top:17px;width:43px;height:43px;border-radius:12px}.motion-criteria-packet{font-size:8px;padding:4px 6px}.motion-student-packet{font-size:7px}.motion-phrase-packet{width:41px;height:29px;padding:6px}}
@media(max-width:370px){.motion-story-caption{font-size:7px}.motion-story-steps i{width:7px}.privacy-diagram .motion-story-caption{font-size:7px}.privacy-diagram .motion-story-steps i{width:5px}.motion-generated-lines{left:74px;right:16px}.motion-local-assignments{left:74px;right:28px}}
@media(prefers-reduced-motion:reduce){.motion-packets{display:none}.motion-enhanced *{will-change:auto!important}.motion-story-steps i{transition:none}}
@media(max-width:700px){.motion-enhanced .ai-node>span:not(.ai-emblem){grid-column:2;grid-row:2;font-size:9px;line-height:1.6;margin-top:4px}}
.motion-enhanced[data-motion-state="paused"] .many-clicks i,.motion-enhanced[data-motion-state="paused"] .single-action>svg{will-change:auto}
