/* Shared native motion: twelve contours, three behaviors, no media or runtime. */
.motion-control { position:absolute; z-index:5; left:var(--pad); bottom:1.2rem; display:flex; align-items:center; gap:.6rem; color:var(--muted); font-size:.72rem; cursor:pointer; min-height:32px; }
.motion-control input { margin:0; width:16px; height:16px; accent-color:var(--solar); }
.motion-system { display:none; }
body:has(#motion-pause:checked) *,body:has(#motion-pause:checked) *::before,body:has(#motion-pause:checked) *::after { animation-play-state:paused!important; }
html[data-motion-paused] *,html[data-motion-paused] *::before,html[data-motion-paused] *::after { animation-play-state:paused!important; }

.motion-site.enhanced { background:var(--bg); }
.motion-site.enhanced::before, .motion-site .experience-orbit { display:none; }
.motion-site .case-hero { position:relative; padding-bottom:5rem; }
.motion-seam { --seam-accent:var(--solar); position:relative; isolation:isolate; height:clamp(110px,16vw,220px); overflow:hidden; contain:layout paint; background:var(--bg); border-block:1px solid var(--soft-line); }
.reader-case .motion-seam { --seam-accent:#a393ff; }
.lattice-case .motion-seam { --seam-accent:#9badff; }
.cms-case .motion-seam { --seam-accent:#61daba; }
.seam-field { position:absolute; inset:-70% -8%; perspective:700px; transform-style:preserve-3d; }
.seam-field i { position:absolute; left:50%; top:50%; width:calc(28% + var(--n)*5%); height:calc(34% + var(--n)*4%); border:1px solid var(--seam-accent); border-radius:50%; opacity:calc(.65 - var(--n)*.035); transform:translate(-50%,-50%) rotateX(62deg) rotateZ(calc(var(--n)*5deg)); animation:seam-tide 16s ease-in-out calc(var(--n)*-.55s) infinite alternate; }
.seam-wave .seam-field { transform:rotate(-12deg); }
.seam-wave .seam-field i { border-radius:44%; animation-name:seam-wave; }
.seam-fold .seam-field { inset:-55% 5%; }
.seam-fold .seam-field i { width:calc(18% + var(--n)*4%); height:80%; border-radius:12%; animation-name:seam-fold; }
@keyframes seam-tide { to { transform:translate(-50%,-50%) rotateX(38deg) rotateZ(calc(var(--n)*5deg + 75deg)); } }
@keyframes seam-wave { to { transform:translate(-50%,-50%) rotateX(72deg) rotateZ(calc(var(--n)*-7deg)) scale(1.15); } }
@keyframes seam-fold { to { transform:translate(-50%,-50%) rotateY(58deg) rotateZ(calc(var(--n)*8deg + 90deg)); } }
[data-motion-scene][data-motion-visible="false"], [data-motion-scene][data-motion-visible="false"] *, [data-motion-scene][data-motion-visible="false"]::before, [data-motion-scene][data-motion-visible="false"]::after, [data-motion-scene][data-motion-visible="false"] *::before, [data-motion-scene][data-motion-visible="false"] *::after { animation-play-state:paused; }
html[data-theme="light"] .motion-seam { --seam-accent:#a44722; }
html[data-theme="light"] .reader-case .motion-seam, html[data-theme="light"] .lattice-case .motion-seam { --seam-accent:#515394; }
html[data-theme="light"] .cms-case .motion-seam { --seam-accent:#28755f; }
@media(max-width:620px) { .seam-field { inset:-25% -50%; } .seam-fold .seam-field { inset:-35% -20%; } .seam-field i:nth-child(even) { display:none; } }
@media(prefers-reduced-motion:reduce) {
 .seam-field i { animation:none!important; }
 .motion-control { display:none; }
 .motion-system { display:block; position:absolute; left:var(--pad); bottom:1.4rem; color:var(--muted); font-size:.68rem; }
}

/* This transition occupies the established work/evidence breathing space. */
.evidence > .seam-inset { position:absolute; inset:0 0 auto; height:clamp(40px,4vw,64px); border:0; background:transparent; }