.giveaway-page {
    padding-top: 2rem;
    padding-bottom: 3rem;
}

.giveaway-page__head {
    margin-bottom: 1.5rem;
}

.giveaway-page__head h1 {
    margin: 0;
    font-size: 2.4rem;
    line-height: 1.15;
}

.giveaway-page__head p {
    max-width: 46rem;
    margin: 0.75rem 0 0;
    color: #526070;
    font-size: 1.05rem;
    line-height: 1.55;
}

.giveaway-archive-link {
    display: inline-flex;
    margin-top: 0.9rem;
    color: #126ad8;
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 0.15em;
}

body.dark .giveaway-page {
    color: #e7ecf4;
}

body.dark .giveaway-page__head p {
    color: #b7c1d0;
}

body.dark .giveaway-archive-link {
    color: #8fc6ff;
}

.giveaway-alert,
.giveaway-empty {
    border-radius: 6px;
    margin: 0 0 1rem;
    padding: 1rem 1.2rem;
}

.giveaway-alert--success {
    background: #e6f6ed;
    color: #126b38;
}

body.dark .giveaway-alert--success {
    background: #123424;
    border: 1px solid #1f5f40;
    color: #a9f4c9;
}

.giveaway-alert--error {
    background: #fdebec;
    color: #9f1d2c;
}

body.dark .giveaway-alert--error {
    background: #3a171c;
    border: 1px solid #6a2730;
    color: #ffb7c0;
}

.giveaway-empty {
    background: #f4f6f8;
    color: #4d5965;
}

body.dark .giveaway-empty {
    background: #1d222b;
    border: 1px solid #2d3440;
    color: #c8d0dc;
}

.giveaway-list {
    display: grid;
    gap: 1.25rem;
}

.giveaway-archive {
    margin-top: 2.5rem;
}

.giveaway-archive h2 {
    margin: 0 0 1rem;
    font-size: 1.65rem;
    line-height: 1.2;
}

.giveaway-list--archive {
    gap: 1rem;
}

.giveaway-card {
    overflow: hidden;
    border: 1px solid rgba(30, 44, 62, 0.12);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(30, 44, 62, 0.07);
}

body.dark .giveaway-card {
    border-color: #2d3440;
    background: #151a22;
    box-shadow: 0 16px 38px rgba(0, 0, 0, 0.35);
}

.giveaway-card--archive {
    box-shadow: none;
}

.giveaway-card--archive .giveaway-card__media {
    min-height: 190px;
}

.giveaway-card--has-media {
    display: grid;
    grid-template-columns: minmax(220px, 34%) minmax(0, 1fr);
}

.giveaway-card__media {
    min-height: 260px;
    background: #eef2f5;
}

body.dark .giveaway-card__media {
    background: #202733;
}

.giveaway-card__media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.giveaway-card__body {
    padding: 1.4rem;
}

.giveaway-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 0.75rem;
    align-items: center;
    margin-bottom: 0.75rem;
    color: #687482;
    font-size: 0.9rem;
}

body.dark .giveaway-card__meta {
    color: #9ba7b8;
}

.giveaway-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin: 0 0 1rem;
}

.giveaway-stat {
    display: grid;
    gap: 0.15rem;
    min-width: 9rem;
    border: 1px solid #dfe6ef;
    border-radius: 8px;
    padding: 0.65rem 0.8rem;
    background: #f7f9fc;
}

.giveaway-stat__label {
    color: #687482;
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
}

.giveaway-stat__value {
    color: #1d2733;
    font-size: 1.1rem;
    font-weight: 800;
}

body.dark .giveaway-stat {
    border-color: #2d3440;
    background: #10151d;
}

body.dark .giveaway-stat__label {
    color: #93a0b2;
}

body.dark .giveaway-stat__value {
    color: #edf2f7;
}

.giveaway-status {
    display: inline-flex;
    align-items: center;
    min-height: 1.8rem;
    border-radius: 999px;
    padding: 0.2rem 0.7rem;
    font-weight: 700;
}

.giveaway-status--open {
    background: #e5f6ef;
    color: #087143;
}

body.dark .giveaway-status--open {
    background: #123424;
    color: #9df0c2;
}

.giveaway-status--upcoming {
    background: #fff4d7;
    color: #8a5b00;
}

body.dark .giveaway-status--upcoming {
    background: #3b2d12;
    color: #ffd987;
}

.giveaway-status--finished {
    background: #edf0f3;
    color: #59636f;
}

body.dark .giveaway-status--finished {
    background: #252c36;
    color: #c0c8d4;
}

.giveaway-card h2 {
    margin: 0 0 0.75rem;
    font-size: 1.55rem;
    line-height: 1.2;
}

.giveaway-card h3 {
    margin: 0 0 0.75rem;
    font-size: 1.25rem;
    line-height: 1.25;
}

.giveaway-card__description {
    color: #313943;
    line-height: 1.55;
}

body.dark .giveaway-card__description {
    color: #d6dde8;
}

.giveaway-entry-note,
.giveaway-winner {
    display: flex;
    gap: 0.5rem;
    align-items: center;
    margin-top: 1rem;
    border-radius: 6px;
    padding: 0.75rem 0.9rem;
}

.giveaway-entry-note {
    background: #e6f6ed;
    color: #126b38;
}

body.dark .giveaway-entry-note {
    background: #123424;
    border: 1px solid #1f5f40;
    color: #a9f4c9;
}

.giveaway-entry-note--muted {
    background: #f4f6f8;
    color: #59636f;
}

body.dark .giveaway-entry-note--muted {
    background: #1d222b;
    border-color: #2d3440;
    color: #c0c8d4;
}

.giveaway-winner {
    background: #fff4d7;
    color: #7a5200;
}

body.dark .giveaway-winner {
    background: #3b2d12;
    border: 1px solid #6a4a16;
    color: #ffd987;
}

.giveaway-action,
.giveaway-form {
    margin-top: 1.25rem;
}

.giveaway-form {
    display: grid;
    gap: 0.9rem;
}

.giveaway-form label {
    display: grid;
    gap: 0.35rem;
    color: #4f5c68;
    font-weight: 600;
}

body.dark .giveaway-form label {
    color: #c7d0dd;
}

.giveaway-form input {
    box-sizing: border-box;
    width: 100%;
    min-height: 2.8rem;
    border: 1px solid rgba(30, 44, 62, 0.22);
    border-radius: 6px;
    padding: 0.65rem 0.8rem;
    background: #fff;
    color: #1f2933;
    font: inherit;
}

body.dark .giveaway-form input {
    border-color: #3a4350;
    background: #0f131a;
    color: #edf2f7;
}

body.dark .giveaway-form input::placeholder {
    color: #798496;
}

.giveaway-form button,
.giveaway-action .btn {
    justify-self: start;
}

@media (max-width: 760px) {
    .giveaway-page__head h1 {
        font-size: 2rem;
    }

    .giveaway-card {
        grid-template-columns: 1fr;
    }

    .giveaway-card__media {
        min-height: 220px;
    }

    .giveaway-card__body {
        padding: 1rem;
    }
}