.contributor-page {
    margin: 0 auto;
    max-width: 1220px;
    padding: 2.4rem 1.5rem 5rem;
}

.contributor-hero,
.contributor-challenge-hero {
    background:
        radial-gradient(
            circle at top right,
            rgba(237, 197, 115, 0.25),
            transparent 36%
        ),
        linear-gradient(
            135deg,
            #123d29,
            #1d6743
        );
    border-radius: 1.2rem;
    color: #ffffff;
    display: flex;
    gap: 2rem;
    justify-content: space-between;
    margin-bottom: 2rem;
    padding: clamp(1.5rem, 5vw, 3rem);
}

.contributor-hero > div:first-child {
    max-width: 720px;
}

.contributor-hero p,
.contributor-challenge-hero > p,
.contributor-section-heading p {
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    margin: 0;
    text-transform: uppercase;
}

.contributor-hero h1,
.contributor-challenge-hero h1 {
    font-size: clamp(2.2rem, 5vw, 4.6rem);
    letter-spacing: -0.065em;
    line-height: 0.98;
    margin: 0.65rem 0 1rem;
}

.contributor-hero > div > span,
.contributor-challenge-hero > span {
    color: rgba(255, 255, 255, 0.76);
    display: block;
    line-height: 1.65;
    max-width: 650px;
}

.contributor-hero-actions {
    align-items: flex-end;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    justify-content: center;
}

.contributor-hero-actions a {
    background: #ffffff;
    border-radius: 0.65rem;
    color: #17583a;
    font-size: 0.82rem;
    font-weight: 850;
    min-width: 165px;
    padding: 0.85rem 1rem;
    text-align: center;
    text-decoration: none;
}

.contributor-hero-actions a.secondary {
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
}

.contributor-section {
    background: #ffffff;
    border: 1px solid #e0e7e2;
    border-radius: 1rem;
    margin-bottom: 1.5rem;
    padding: 1.35rem;
}

.contributor-section-heading {
    align-items: flex-end;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.contributor-section-heading p {
    color: #24704a;
}

.contributor-section-heading h2 {
    font-size: 1.55rem;
    letter-spacing: -0.04em;
    margin: 0.2rem 0 0;
}

.contributor-section-heading > span {
    color: #758078;
    font-size: 0.72rem;
}

.contributor-leaderboard {
    display: grid;
    gap: 0.5rem;
}

.contributor-leader-row {
    align-items: center;
    border: 1px solid #e4e9e6;
    border-radius: 0.7rem;
    color: #28352d;
    display: grid;
    gap: 0.85rem;
    grid-template-columns:
        45px
        45px
        minmax(170px, 1fr)
        auto
        auto
        105px;
    padding: 0.7rem 0.85rem;
    text-decoration: none;
}

.contributor-leader-row:hover {
    background: #f5f8f6;
    border-color: #bfd2c5;
}

.contributor-rank {
    color: #206a46;
    font-size: 0.88rem;
}

.contributor-leader-avatar img,
.contributor-leader-avatar span {
    align-items: center;
    background: #1c6843;
    border-radius: 50%;
    color: #ffffff;
    display: flex;
    font-size: 0.82rem;
    font-weight: 900;
    height: 42px;
    justify-content: center;
    object-fit: cover;
    width: 42px;
}

.contributor-leader-name {
    display: grid;
}

.contributor-leader-name strong {
    font-size: 0.87rem;
}

.contributor-leader-name small {
    color: #78837c;
    font-size: 0.68rem;
}

.contributor-badge,
.contributor-mini-badge {
    background: #e8f3ec;
    border-radius: 999px;
    color: #246846;
    display: inline-flex;
    font-size: 0.68rem;
    font-weight: 850;
    gap: 0.25rem;
    padding: 0.32rem 0.58rem;
    width: fit-content;
}

.contributor-leader-counts {
    color: #748078;
    display: flex;
    font-size: 0.68rem;
    gap: 0.55rem;
}

.contributor-points {
    color: #175d3c;
    font-size: 1rem;
    text-align: right;
}

.contributor-points small {
    color: #87918b;
    display: block;
    font-size: 0.6rem;
    font-weight: 650;
}

.contributor-ranking-columns {
    display: grid;
    gap: 1.5rem;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
}

.contributor-compact-list {
    display: grid;
    gap: 0.4rem;
}

.contributor-compact-list a {
    align-items: center;
    border-radius: 0.55rem;
    color: #344138;
    display: grid;
    font-size: 0.76rem;
    gap: 0.65rem;
    grid-template-columns:
        38px
        1fr
        auto;
    padding: 0.65rem;
    text-decoration: none;
}

.contributor-compact-list a:hover {
    background: #edf4ef;
}

.contributor-compact-list strong {
    color: #25704a;
}

.contributor-compact-list b {
    color: #647168;
    font-size: 0.69rem;
}

.contributor-promotion-grid {
    display: grid;
    gap: 0.9rem;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
}

.contributor-promotion-card {
    border: 1px solid #dfe7e1;
    border-radius: 0.8rem;
    color: #2c3931;
    display: grid;
    min-height: 190px;
    padding: 1rem;
    text-decoration: none;
}

.contributor-promotion-card > span {
    border-radius: 999px;
    font-size: 0.61rem;
    font-weight: 900;
    padding: 0.26rem 0.5rem;
    width: fit-content;
}

.contributor-promotion-card > span.running {
    background: #dff2e6;
    color: #1e6a43;
}

.contributor-promotion-card > span.upcoming {
    background: #fff0d9;
    color: #9a6226;
}

.contributor-promotion-card > span.finished {
    background: #edf0ee;
    color: #6f7a73;
}

.contributor-promotion-card h3 {
    font-size: 1.05rem;
    margin: 0.7rem 0 0.35rem;
}

.contributor-promotion-card p {
    color: #718078;
    font-size: 0.76rem;
    line-height: 1.5;
}

.contributor-promotion-card > div {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-top: auto;
}

.contributor-promotion-card small {
    color: #808b84;
    font-size: 0.65rem;
}

.contributor-promotion-card > div strong {
    color: #246f49;
    font-size: 0.7rem;
}

.contributor-badge-guide {
    display: grid;
    gap: 0.7rem;
    grid-template-columns:
        repeat(6, minmax(0, 1fr));
}

.contributor-badge-guide article {
    align-items: center;
    background: #f3f7f4;
    border-radius: 0.7rem;
    display: flex;
    flex-direction: column;
    min-height: 130px;
    padding: 1rem 0.6rem;
    text-align: center;
}

.contributor-badge-guide article > span {
    color: #237049;
    font-size: 1.6rem;
}

.contributor-badge-guide strong {
    font-size: 0.76rem;
    margin-top: 0.45rem;
}

.contributor-badge-guide small {
    color: #7a867e;
    font-size: 0.62rem;
    margin-top: 0.25rem;
}

.contributor-empty {
    background: #f4f7f5;
    border-radius: 0.7rem;
    color: #647068;
    padding: 2.5rem 1rem;
    text-align: center;
}

.contributor-empty strong {
    color: #2b3b31;
}

.contributor-empty p {
    font-size: 0.76rem;
    margin: 0.45rem auto 0;
    max-width: 430px;
}

.contributor-empty.compact {
    padding: 1.4rem 0.8rem;
}

.contributor-challenge-hero {
    display: block;
}

.contributor-challenge-hero > a {
    color: rgba(255, 255, 255, 0.74);
    font-size: 0.72rem;
    font-weight: 750;
    text-decoration: none;
}

.contributor-challenge-meta {
    display: grid;
    gap: 0.7rem;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
    margin-top: 1.5rem;
}

.contributor-challenge-meta article {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 0.7rem;
    display: grid;
    gap: 0.25rem;
    padding: 0.8rem;
}

.contributor-challenge-meta small {
    color: rgba(255, 255, 255, 0.65);
    font-size: 0.62rem;
}

.contributor-challenge-meta strong {
    font-size: 0.77rem;
}

.contributor-prize {
    background: rgba(239, 199, 114, 0.16);
    border: 1px solid rgba(239, 199, 114, 0.3);
    border-radius: 0.7rem;
    margin-top: 1rem;
    padding: 0.85rem;
}

.contributor-prize strong {
    color: #f1cf8b;
    font-size: 0.73rem;
    text-transform: uppercase;
}

.contributor-prize p {
    color: #ffffff;
    margin: 0.3rem 0 0;
}

.contributor-winners {
    display: grid;
    gap: 0.65rem;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
}

.contributor-winners a {
    align-items: center;
    background: #fff8e9;
    border: 1px solid #edd9ad;
    border-radius: 0.7rem;
    color: #3b3527;
    display: grid;
    gap: 0.25rem;
    padding: 0.9rem;
    text-decoration: none;
}

.contributor-winners strong {
    color: #a66d28;
}

.contributor-winners b {
    font-size: 0.72rem;
}

@media (max-width: 950px) {
    .contributor-leader-row {
        grid-template-columns:
            38px
            42px
            1fr
            auto;
    }

    .contributor-badge,
    .contributor-leader-counts {
        display: none;
    }

    .contributor-promotion-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .contributor-badge-guide {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .contributor-page {
        padding:
            1rem
            0.8rem
            3rem;
    }

    .contributor-hero {
        flex-direction: column;
    }

    .contributor-hero-actions {
        align-items: stretch;
    }

    .contributor-ranking-columns,
    .contributor-promotion-grid,
    .contributor-winners,
    .contributor-challenge-meta {
        grid-template-columns: 1fr;
    }

    .contributor-badge-guide {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .contributor-leader-row {
        grid-template-columns:
            32px
            38px
            1fr
            78px;
        padding: 0.65rem 0.55rem;
    }

    .contributor-leader-avatar img,
    .contributor-leader-avatar span {
        height: 36px;
        width: 36px;
    }
}

/* CONTRIBUTOR_PERIOD_CSS_START */

.contributor-period-tabs {
    background: #ffffff;
    border: 1px solid #dfe7e2;
    border-radius: 0.8rem;
    display: flex;
    gap: 0.35rem;
    margin-bottom: 1.5rem;
    padding: 0.4rem;
}

.contributor-period-tabs a {
    border-radius: 0.55rem;
    color: #657269;
    flex: 1;
    font-size: 0.78rem;
    font-weight: 850;
    padding: 0.72rem 0.8rem;
    text-align: center;
    text-decoration: none;
}

.contributor-period-tabs a:hover {
    background: #edf4ef;
    color: #1e6844;
}

.contributor-period-tabs a.active {
    background: #185e3d;
    color: #ffffff;
}

.contributor-award-archive {
    display: grid;
    gap: 0.65rem;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
}

.contributor-award-archive a {
    align-items: center;
    background:
        linear-gradient(
            135deg,
            #fff8e7,
            #f6f9f7
        );
    border: 1px solid #eadbb7;
    border-radius: 0.75rem;
    color: #344138;
    display: flex;
    gap: 0.7rem;
    padding: 0.85rem;
    text-decoration: none;
}

.contributor-award-archive > a > strong {
    font-size: 1.35rem;
}

.contributor-award-archive > a > div {
    display: grid;
    gap: 0.15rem;
}

.contributor-award-archive span {
    color: #7d5726;
    font-size: 0.75rem;
    font-weight: 850;
}

.contributor-award-archive small {
    color: #78837c;
    font-size: 0.65rem;
}

@media (max-width: 800px) {
    .contributor-award-archive {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 520px) {
    .contributor-period-tabs {
        flex-direction: column;
    }
}

/* CONTRIBUTOR_PERIOD_CSS_END */