:root {
    --fpm-primary: #9fdfb6;
    --fpm-primary-bg: #eeeeee;
    --fpm-white: #ffffff;
    --fpm-black: #3c3c3b;

    --fpm-fs-display: 50px;
    --fpm-fs-head: 40px;
    --fpm-fs-subhead: 1.25rem;
    --fpm-fs-copy: 1rem;
}

.fpm-search-container {
    h2, h3, h4, p {
        margin-top: 0;
    }
}

.fpm-header {
    margin: 2rem 0;
    display: grid;
    grid-template-columns: 1fr 2fr;
}

.fpm-header__skyline {
    grid-column: 1 / -1;
}

.fpm-header__title {
    text-transform: uppercase;
}

/* Statistics Cards */
.fpm-stats {
    margin: 2rem 0;
    border-top: solid 1px var(--fpm-black);
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
}

.fpm-stats__card {
    text-align: center;
}

.fpm-stats__number {
    display: block;
    font-size: var(--fpm-fs-display);
    font-weight: bold;
}

.fpm-search-section {
    margin: 2rem 0;
}

.fpm-search-section__title {
    font-size: var(--fpm-fs-head);
    text-transform: uppercase;
    margin-bottom: 1rem;
}

/* Form Grid - Horizontal layout for form fields */
.fpm-form-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    margin-bottom: 1rem;
}

@media (min-width: 768px) {
    .fpm-form-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 1rem 2rem;
    }
}

/* Form Elements */
@media (min-width: 768px) {
    .fpm-form-field__letters {
        grid-column: auto / span 3;
    }
}

.fpm-form-label {
    display: block;
    text-transform: uppercase;
    margin-bottom: 0.25rem;
}

.fpm-form-input,
.fpm-form-select {
    margin-top: 0;
    width: 100%;
}

.fpm-form-input:focus,
.fpm-form-select:focus {

}

.fpm-form-input::placeholder {
}

/* Alphabet Filter */
.fpm-alphabet {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(32px, 1fr));
    gap: 4px;
}

.fpm-alphabet__letter {
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--fpm-black);
    background: var(--fpm-white);
    cursor: pointer;
}

.fpm-alphabet__letter:hover {
}

.fpm-alphabet__letter--active {
    background: var(--fpm-black);
    color: var(--fpm-white);
}

.fpm-alphabet__clear {
    font-size: 0.8em;
}

/* Action Buttons */
.fpm-actions {
    display: flex;
    gap: 1rem;
}

.fpm-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.25rem 0.5rem;
    text-decoration: none;
    cursor: pointer;
    border: solid 1px var(--fpm-black);
}

.fpm-results__header {
    margin-bottom: 36px;
}

.fpm-results__count {
    text-align: right;
}

/* Loading State */
.fpm-loading {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.fpm-loading__spinner {
    width: 24px;
    height: 24px;
    border-bottom: 3px solid var(--fpm-black);
    border-top: 3px solid var(--fpm-white);
    border-radius: 50%;
    animation: fpm-spin 1s linear infinite;
}

@keyframes fpm-spin {
    to {
        transform: rotate(360deg);
    }
}

/* Results Grid */
.fpm-results__grid {
    display: grid;
    gap: 1rem;
}

/* Year Groups */
.fpm-year-group {
    margin-bottom: 36px;
}

.h1.fpm-year-group__title {
    text-align: center;
    margin-bottom: 54px;
}

/* Category Groups */
.fpm-category-group {
    margin-bottom: 18px;
}

.fpm-category-group__title {
    text-align: center;
    margin-top: 0 !important;
    margin-bottom: 18px;
}

/* Project Cards */
.fpm-project {
    border-top: solid 1px var(--fpm-black);
    padding-block: 36px;
    overflow-wrap: break-word;
    word-wrap: break-word;
    -ms-word-break: break-all;
    word-break: break-word;
}

.fpm-project:last-child {
    border-bottom: solid 1px var(--fpm-black);
}

.fpm-project__header {
    margin-bottom: 18px;
}

.fpm-project__applicant {
    margin-bottom: 18px;
}

.fpm-project__type {
    line-height: 1.75;
}

.fpm-project__title {
    font-size: 18px !important;
    line-height: 1.75;
    margin-bottom: 18px;
}

.fpm-project__dois {
    margin-top: 9px;
}

/* Pagination */
.fpm-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    margin: 2rem 0;
}

.fpm-pagination__button {
    padding: 0.25rem 0.5rem;
    border: 1px solid var(--fpm-black);
    background: var(--fpm-white);
    cursor: pointer;
    display: flex;
    align-items: center;
}

.fpm-pagination__button:disabled {
    opacity: 0.5;
    cursor: default;
}

.fpm-pagination__info {
    margin: 0 1rem;
}

/* Empty & Error States */
.fpm-empty,
.fpm-error {
    text-align: center;
}

.fpm-error {
    background: #fef2f2;
    color: #b91c1c;
}