:root{--motion-standard:cubic-bezier(.2,0,0,1);--motion-spring:cubic-bezier(.22,1,.36,1);--motion-emphasized:cubic-bezier(.16,1,.3,1);--motion-panel-duration:320ms}
@media(prefers-reduced-motion:no-preference){
 html.expressive-boot :is(.site-header .brand,.header-actions,.home-intro__date,.home-intro__line,.home-intro__bubble),.expressive-wait{opacity:0}
 .site-header .brand{transform-origin:left center}.header-actions{transform-origin:right center}.home-intro__line{transform-origin:left bottom}.home-intro__bubble{transform-origin:100% 120%}
 /* Keep the responsive, equal corner radius from screen.css throughout the motion. */
 .site-nav{opacity:0;transform:translate3d(0,-6px,0) scale(.985);transform-origin:top right;transition:opacity var(--motion-panel-duration) var(--motion-spring),transform var(--motion-panel-duration) var(--motion-spring),visibility 0s linear var(--motion-panel-duration)}
 .site-nav.is-open{opacity:1;transform:none;transition-delay:0s}
 .site-nav li{opacity:0;transition:opacity 180ms var(--motion-standard)}
 .site-nav.is-open li{opacity:1;transition-delay:calc(20ms + var(--expressive-order,0)*12ms)}
 .site-nav li:focus-within{opacity:1;transition:none}
 .header-icon--menu path{transition:transform 220ms var(--motion-spring)}
 button,.section-link,.load-more,.pill-button,.kg-btn{transition:transform 360ms var(--motion-standard),border-radius 680ms var(--motion-spring),background-color 440ms var(--motion-standard),color 360ms ease}
 .header-actions :is(.search-button,.nav-toggle){transition:transform 160ms var(--motion-standard),background-color 160ms var(--motion-standard),color 160ms ease}
 button:active:not(:disabled),.section-link:active,.load-more:active{transform:scale(.96)}
 .story-card,.buying-card,.author-card{transition:transform 880ms var(--motion-spring)}
 .story-card__media img,.home-template .rail-section--featured .feature-card img:not(.feature-card__avatar),.author-card__media img,.buying-card__media img{transition:transform 1240ms var(--motion-emphasized)}
 .newsletter__field{transition:transform 840ms var(--motion-spring),border-radius 840ms var(--motion-spring)}
 .newsletter__field:focus-within{transform:scale(1.012);border-radius:30px 30px 12px 30px}
 .story-card.is-pointer-hover,.buying-card.is-pointer-hover,.author-card.is-pointer-hover{transform:translateY(-6px) scale(1.008)}
 .story-card.is-pointer-hover .story-card__media img,.author-card.is-pointer-hover .author-card__media img,.buying-card.is-pointer-hover .buying-card__media img{transform:scale(1.045)}
 .home-template .rail-section--featured .feature-card.is-pointer-hover img:not(.feature-card__avatar){transform:scale(1.035)}
 .site-nav a{transition:transform 160ms var(--motion-spring),background-color 140ms linear}
 .site-nav a.is-pointer-hover{transform:translateX(4px);background:rgba(255,255,255,.09)}
 .rail-control.is-pointer-hover:not(:disabled):not(:active),.search-button.is-pointer-hover:not(:active),.nav-toggle.is-pointer-hover:not(:active){transform:scale(1.06)}
 .image-lightbox:not([hidden]){animation:expressive-fade 400ms var(--motion-standard) both}
 .image-lightbox:not([hidden]) .image-lightbox__figure{animation:expressive-lightbox 840ms var(--motion-spring) both}
}
@keyframes expressive-fade{from{opacity:0}to{opacity:1}}
@keyframes expressive-lightbox{from{opacity:0;transform:translate3d(0,18px,0) scale(.92)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.expressive-wait{opacity:1!important}}
@media print{.expressive-wait{opacity:1!important}*,*::before,*::after{animation:none!important;transition:none!important}}
/* Loading affects opacity only; the surrounding layout keeps its existing dimensions. */
@media(prefers-reduced-motion:no-preference){.media-loading{opacity:0}}
@media(prefers-reduced-motion:reduce){.media-loading{opacity:1!important}}
@media print{.media-loading{opacity:1!important}}

@media(prefers-reduced-motion:no-preference){.newsletter__form:is(.loading,.success,.error) .form-message{animation:expressive-fade 600ms cubic-bezier(.22,1,.36,1) both}}
