.section-animation-editor{border-top:1px solid #dce5f2;padding-top:16px;margin-top:16px}.section-animation-editor h3{font-weight:700;margin-bottom:10px}.animation-switch,.journey-checkbox{display:flex!important;align-items:center;justify-content:space-between;gap:12px}.animation-switch input,.journey-checkbox input{appearance:none!important;width:40px!important;height:23px!important;min-width:40px;position:relative;border:0!important;border-radius:20px!important;background:#cbd5e1!important;padding:0!important;cursor:pointer}.animation-switch input:before,.journey-checkbox input:before{content:'';position:absolute;top:3px;left:3px;width:17px;height:17px;border-radius:50%;background:white;transition:transform .15s}.animation-switch input:checked,.journey-checkbox input:checked{background:#2563eb!important}.animation-switch input:checked:before,.journey-checkbox input:checked:before{transform:translateX(17px)}.animation-switch input:focus-visible,.journey-checkbox input:focus-visible{outline:2px solid #2563eb;outline-offset:3px}

.section-timeline-beam{position:absolute;top:0;inset-inline-start:0;width:3px;background:var(--motion-color);box-shadow:0 0 10px var(--motion-color);pointer-events:none;border-radius:5px}.section-timeline-beam:after{content:"";position:absolute;bottom:0;left:-3px;width:9px;height:9px;border-radius:50%;background:var(--motion-color);box-shadow:0 0 12px var(--motion-color)}

.animation-switch,.journey-checkbox{flex-direction:row!important;text-align:start}.animation-switch span,.journey-checkbox span{flex:1}
/* Block motion controls */
.section-animation-editor .animation-range-number{display:grid;grid-template-columns:minmax(0,1fr) 85px;align-items:center;gap:10px}.section-animation-editor .animation-range-number input[type=range]{min-width:0;padding:0}.section-animation-editor .animation-block-order>div{display:flex;align-items:center;gap:8px;padding:9px 0;border-bottom:1px solid #dce5f2}.section-animation-editor .animation-block-order span{flex:1}.section-animation-editor .animation-block-order button{padding:5px 10px;border:1px solid #dce5f2;border-radius:8px}.section-animation-editor .animation-block-order button:disabled{opacity:.35}
.nav-social-picker{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.nav-social-picker button{position:relative;padding:10px;border:1px solid #dce5f2;border-radius:10px;color:#64748b;background:#f8fafc}.nav-social-picker button.has-link{color:#2563eb}.nav-social-picker button[aria-pressed=true]{border-color:#2563eb}.nav-social-picker small{position:absolute;bottom:0;right:2px;font-size:10px}.nav-social-link-editor{padding:12px;border:1px solid #dce5f2;border-radius:12px}.nav-content-row button{border:1px solid #dce5f2;border-radius:8px;padding:6px}.nav-content-row{grid-template-columns:minmax(0,1fr) 40px 38px}
/* Shared motion controls */
.section-animation-editor .animation-groups{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.section-animation-editor .animation-groups button{flex:1 1 85px;min-height:40px;padding:8px 10px;border:1px solid #dce5f2;border-radius:10px;background:#f8fafc;color:#405675;font-family:inherit;font-size:12px;font-weight:600;line-height:1.5;cursor:pointer}
.section-animation-editor .animation-groups button[aria-pressed=true]{background:#edf3ff;border-color:#2563eb;color:#1d4ed8}
.section-animation-editor .animation-effect-label{font-size:12px;font-weight:700;margin:12px 0 8px}
.section-animation-editor .animation-effects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-bottom:12px}
.section-animation-editor button.animation-effect{display:flex;flex-direction:column;align-items:center;gap:5px;min-width:0;padding:6px 4px;border:1px solid #dce5f2;border-radius:10px;background:#fff;color:#405675;cursor:pointer;font:inherit;font-size:10px;line-height:1.4;text-align:center}
.section-animation-editor button.animation-effect.is-selected{background:#edf3ff;border-color:#2563eb;color:#1d4ed8;box-shadow:0 0 0 1px #2563eb15}
.animation-effect-stage{display:grid;place-items:center;width:100%;height:34px;border-radius:6px;background:#f3f6fb;overflow:hidden}
.animation-effect-stage i{display:block;width:24px;height:14px;border-radius:4px;background:#4c7cec;color:#fff;font:700 8px/14px Arial,sans-serif;font-style:normal;text-align:center}
.animation-effect:hover i,.animation-effect:focus-visible i,.animation-effect.is-selected i{animation:motion-mini-fade 2s ease-in-out infinite}
.animation-effect-stage[data-effect=none] i{animation:none}
.animation-effect-stage[data-effect*=up]{--mini-x:0px;--mini-y:10px}.animation-effect-stage[data-effect*=down]{--mini-x:0px;--mini-y:-10px}.animation-effect-stage[data-effect*=left]{--mini-x:10px;--mini-y:0px}.animation-effect-stage[data-effect*=right]{--mini-x:-10px;--mini-y:0px}
.animation-effect:is(:hover,:focus-visible,.is-selected) [data-effect^=slide] i,.animation-effect:is(:hover,:focus-visible,.is-selected) [data-effect^=fade-] i,.animation-effect:is(:hover,:focus-visible,.is-selected) [data-effect=stagger] i{animation-name:motion-mini-slide}
.animation-effect:is(:hover,:focus-visible,.is-selected) [data-effect^=zoom] i,.animation-effect:is(:hover,:focus-visible,.is-selected) [data-effect=depth] i{animation-name:motion-mini-zoom}
.animation-effect:is(:hover,:focus-visible,.is-selected) [data-effect=blur] i{animation-name:motion-mini-blur}
.animation-effect:is(:hover,:focus-visible,.is-selected) [data-effect^=wipe] i,.animation-effect:is(:hover,:focus-visible,.is-selected) [data-effect^=reveal] i{animation-name:motion-mini-wipe}
.animation-effect:is(:hover,:focus-visible,.is-selected) [data-effect=float] i,.animation-effect:is(:hover,:focus-visible,.is-selected) [data-effect=parallax] i{animation-name:motion-mini-float}
.animation-effect:is(:hover,:focus-visible,.is-selected) [data-effect=pulse] i{animation-name:motion-mini-pulse}
.animation-effect:is(:hover,:focus-visible,.is-selected) [data-effect=rotate] i{animation-name:motion-mini-rotate}
.animation-effect:is(:hover,:focus-visible,.is-selected) [data-effect$=sweep] i{animation-name:motion-mini-glow}
.section-animation-editor .animation-advanced{margin-top:8px;border:1px solid #dce5f2;border-radius:10px;background:#f8fafc;padding:10px}
.section-animation-editor .animation-advanced>summary{cursor:pointer;font-size:12px;font-weight:650}.section-animation-editor .animation-advanced>.fields{margin-top:12px}
.section-animation-editor .animation-path-color{display:flex;gap:8px;align-items:center}.section-animation-editor .animation-path-color input{flex:1;min-width:0;height:40px}.section-animation-editor .animation-path-color button{border:1px solid #dce5f2;border-radius:9px;padding:9px 14px;background:#fff;color:#305ca0}
.section-animation-editor .animation-preview-button{display:block;width:100%;min-height:42px;margin-top:14px;border:1px solid #2563eb;border-radius:10px;background:#2563eb;color:white;font-family:inherit;font-size:13px;font-weight:600;line-height:1.5;cursor:pointer}
.section-animation-editor .animation-preview-button:disabled{opacity:.45;cursor:default}
.section-animation-editor button:focus-visible,.section-animation-editor summary:focus-visible{outline:2px solid #2563eb;outline-offset:2px}
.animation-path-segment{position:absolute;z-index:1;pointer-events:none;border-radius:999px;background:var(--path-color);box-shadow:0 0 calc(7px * var(--path-strength,1)) var(--path-color);transform:scaleY(var(--path-progress,0));transform-origin:top;will-change:transform}
.education-marker.animation-path-lit,.experience-marker.animation-path-lit{color:var(--path-color)!important;background:color-mix(in srgb,var(--path-color) 20%,var(--edu-tag-bg,var(--exp-tag-bg,#263c60)));box-shadow:0 0 calc(12px * var(--path-strength,1)) color-mix(in srgb,var(--path-color) 65%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--path-color) 50%,transparent)}
@keyframes motion-mini-fade{0%,10%{opacity:.15}40%,75%{opacity:1}100%{opacity:.15}}
@keyframes motion-mini-slide{0%,10%{opacity:0;transform:translate(var(--mini-x,0px),var(--mini-y,8px))}40%,75%{opacity:1;transform:translate(0,0)}100%{opacity:0;transform:translate(var(--mini-x,0px),var(--mini-y,8px))}}
@keyframes motion-mini-zoom{0%,10%{opacity:0;transform:scale(.6)}40%,75%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.6)}}
@keyframes motion-mini-blur{0%,10%{filter:blur(3px);opacity:.2}40%,75%{filter:blur(0);opacity:1}100%{filter:blur(3px);opacity:.2}}
@keyframes motion-mini-wipe{0%,10%{clip-path:inset(0 100% 0 0)}40%,75%{clip-path:inset(0)}100%{clip-path:inset(0 100% 0 0)}}
@keyframes motion-mini-float{0%,100%{transform:translateY(4px)}50%{transform:translateY(-4px)}}
@keyframes motion-mini-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.15)}}
@keyframes motion-mini-rotate{0%,100%{transform:rotate(-10deg)}50%{transform:rotate(10deg)}}
@keyframes motion-mini-glow{0%,100%{box-shadow:0 0 0 transparent}50%{box-shadow:0 0 10px #2563eb}}
@media(max-width:420px){.section-animation-editor .animation-effects{gap:6px}.section-animation-editor .animation-range-number{grid-template-columns:minmax(0,1fr) 68px}.section-animation-editor .animation-groups button{font-size:11px}}
@media(prefers-reduced-motion:reduce){.section-animation-editor .animation-effect-stage i{animation:none!important}.animation-path-segment{will-change:auto}}

.education-card.animation-path-card-lit,.experience-card.animation-path-card-lit{box-shadow:0 0 calc(14px * var(--path-strength,1)) color-mix(in srgb,var(--path-color) 30%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--path-color) 50%,transparent)}
