/* Inline vectors retain the measured icon geometry without font glyphs or
   raster assets. Keep glass blur on the surfaces behind the icons. */
.mf-icon{display:block;flex-shrink:0;width:var(--mf-icon-size,24px);height:var(--mf-icon-size,24px)}
svg.mf-icon[data-mf-icon]{fill:var(--mf-icon-fill,none);stroke:var(--mf-icon-ink,currentColor);stroke-width:var(--mf-icon-stroke,2);stroke-linecap:round;stroke-linejoin:round;shape-rendering:geometricPrecision;overflow:visible;filter:none;backface-visibility:visible;transform-box:view-box;transform-origin:center}
.text-link>.mf-icon{width:16px;height:16px;transition:transform .3s cubic-bezier(.4,0,.2,1)}
.text-link:hover>.mf-icon{transform:translateX(4px)}
.close-button>.mf-icon,.episode-back>.mf-icon{width:20px;height:20px}
.close-button,.episode-back{display:grid;place-items:center}
.title-rating{display:inline-flex;align-items:center;gap:4px}
.title-rating>.mf-icon{display:inline-block;width:16px;height:16px;color:var(--af-rating,#facc15);vertical-align:-2px}
.episode-order{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.episode-order>.mf-icon{width:16px;height:16px}
.continue-menu summary>.mf-icon{width:28px;height:28px}
.hero-secondary .button svg.mf-icon{width:24px;height:24px;transform:none;transition:width .3s cubic-bezier(.4,0,.2,1),height .3s cubic-bezier(.4,0,.2,1)}
.hero-secondary .button:hover svg.mf-icon{width:26.4px;height:26.4px;transform:none}
.hero-content{transform:none}
.hero-content.hero-content-changing{transform:translateY(6px)}
.movie-card .poster,.discovery-content .poster-grid{transform:none;backface-visibility:visible}
.movie-card:hover .card-hover-content,.movie-card:has(.poster-open:focus-visible) .card-hover-content,.movie-card:has(.card-save:focus-visible) .card-hover-content{transform:none}
.button.primary:hover,#detail-dialog .detail-actions .button.primary:hover{filter:none}
@keyframes card-entry{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){:where(html:not([data-motion=full])) .hero-secondary .button svg.mf-icon,:where(html:not([data-motion=full])) .text-link>.mf-icon{transition:none}}
:where(html[data-motion=reduced]) .hero-secondary .button svg.mf-icon,:where(html[data-motion=reduced]) .text-link>.mf-icon{transition:none}