.ai-page .page-hero {
    padding-bottom: 40px;
}

.ai-page .page-hero + .section {
    padding-top: 20px;
}

.recommendation-loading {
    min-width: 0;
    margin-top: 2px;
    text-align: center;
}

.ai-progress {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 6px;
    border-radius: 999px;
    background: #f2dfd6;
}

.ai-progress-bar {
    position: absolute;
    inset-block: 0;
    left: -35%;
    width: 35%;
    border-radius: inherit;
    background: var(--maroon);
    animation: ai-progress-indeterminate 1.4s infinite ease-in-out;
}

.recommendation-loading p {
    min-height: 1.5em;
    margin: 10px 0 0;
    color: var(--muted);
}

.ai-recommendation-form[aria-busy="true"] .button:disabled {
    cursor: wait;
    opacity: .65;
}

@keyframes ai-progress-indeterminate {
    from { left: -35%; }
    to { left: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .ai-progress-bar { animation-duration: 2.8s; }
}