/* animate: purposeful, interruptible, scoped to Roman; accepted shell untouched. */
.roman-budget{--ease-out:cubic-bezier(0.23,1,0.32,1);--ease-in-out:cubic-bezier(0.77,0,0.175,1)}
/* Replace the inherited unsolicited hero entrance with immediate content. */
.roman-budget .rx-hero-images,.roman-budget .rx-hero-copy{animation:none}
.roman-budget #roman-motion .r-motion-photo{transition:opacity 160ms var(--ease-out)}
.roman-budget #roman-motion .r-demo[data-fading] .r-motion-photo{opacity:0;transition-duration:100ms}
.roman-budget [data-motion-instant] .r-motion-photo{transition:none!important}
.roman-budget .rf-card{transition:opacity 200ms var(--ease-out),transform 200ms var(--ease-out)}
.roman-budget .rf-card[data-reveal]{opacity:.82;transform:translateY(8px)}
.roman-budget .rf-card:focus-within{opacity:1;transform:none;transition:none}
.roman-budget .rf-card[data-selected]{outline:2px solid var(--rx-accent);outline-offset:3px}
.roman-budget :is(.r-button,.r-demo-controls button,.rf-filters button){transition:transform 160ms var(--ease-out),background-color 160ms ease,color 160ms ease}
.roman-budget :is(.r-button,.r-demo-controls button,.rf-filters button):active{transform:scale(.97)}
.roman-budget[data-input=keyboard] :is(button,a),.roman-budget[data-input=keyboard] .rf-card{transition:none!important;transform:none!important}
.roman-budget #faq details[open] p{opacity:1;transition:opacity 200ms var(--ease-out)}
.roman-budget #faq details[data-answer-enter] p{opacity:.65}
.roman-budget[data-input=keyboard] #faq details p{transition:none!important;opacity:1}
.roman-budget .ra-status{font-size:14px;line-height:1.5;margin:12px 0 0;min-height:21px}
.roman-budget #roman-calculator:focus-visible{outline:3px solid var(--rx-accent);outline-offset:4px}
.roman-budget .ra-static-states{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:24px 0}
.roman-budget .ra-static-states figure{margin:0}.roman-budget .ra-static-photo{aspect-ratio:4/5;background:url('/roman/roman-motion-visual.png') 50% 0/300% 100%}
.roman-budget .ra-static-photo.closed{background-position:0 0}.roman-budget .ra-static-photo.open{background-position:100% 0}
@media(hover:hover) and (pointer:fine){.roman-budget .rf-copy a:hover{text-decoration-thickness:2px}.roman-budget .r-demo-controls button:hover{background-color:var(--rx-accent);color:#fff}}
@media(prefers-reduced-motion:reduce){.roman-budget .rf-card{transform:none!important;transition:opacity 160ms var(--ease-out)}.roman-budget .rf-card[data-reveal]{transform:none;opacity:1}.roman-budget :is(.r-button,.r-demo-controls button,.rf-filters button):active{transform:none}.roman-budget #roman-motion .r-motion-photo{transition:opacity 160ms var(--ease-out)}.roman-budget #faq details p{transition:opacity 160ms var(--ease-out)}}
@media(max-width:600px){.roman-budget .ra-static-states{grid-template-columns:1fr}}

/* Neutralize inherited ungated photo hover; keyboard and touch do not zoom. */
.roman-budget .r-photo-open img{transition:none;transform:none}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.roman-budget[data-input=pointer] .r-photo-open img{transition:transform 160ms var(--ease-out)}.roman-budget[data-input=pointer] .r-photo-open:hover img{transform:scale(1.025)}}