/**
 * Global interaction and scroll performance (all app pages using layouts.app).
 */

html {
    scroll-behavior: auto;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overscroll-behavior-y: none;
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

.site-header {
    contain: layout style;
}

button,
a,
label,
input,
select,
textarea,
[role='button'] {
    touch-action: manipulation;
}

.thumb-grid,
.results-grid,
.proposal-design-gallery,
.pattern-design-gallery,
.proposal-design-gallery,
.history-panel .thumb-grid {
    contain: layout style;
}

.proposal-design-card,
.pattern-design-card,
.result-card,
.history-thumb-wrap {
    content-visibility: auto;
    contain-intrinsic-size: auto 260px;
}

.pattern-design-gallery,
.thumb-grid {
    overflow-anchor: none;
}

.pattern-actions-panel {
    contain: layout style paint;
}

.auth-bg-wordmark img {
    content-visibility: auto;
}

.progress-bar > span {
    will-change: width;
}

@media (prefers-reduced-motion: reduce) {
    .progress-bar > span {
        will-change: auto;
    }
}