.competition-admin-page {
    --admin-purple: var(--maps-brand-purple, #8c52ff);
    --admin-purple-dark: var(--maps-brand-purple-dark, #8a38f5);
    --admin-ink: var(--maps-ink, #223044);
    --admin-muted: var(--maps-muted, #667085);
    --admin-line: var(--maps-brand-purple-border, #ded0ff);
    min-height: 100vh;
    padding: clamp(1rem, 3vw, 2rem) clamp(1rem, 3vw, 2.5rem) 4rem;
    color: var(--admin-ink);
    background: radial-gradient(circle at 95% 0, rgba(140, 82, 255, .12), transparent 27rem), #faf9fc;
    font-family: "Quicksand", sans-serif;
}

.competition-admin-page > * {
    width: min(82rem, 100%);
    margin-inline: auto;
}

.competition-admin-hero {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    padding: clamp(1.5rem, 4vw, 2.6rem);
    border-radius: 1.65rem;
    color: #fff;
    background: linear-gradient(125deg, var(--admin-purple-dark), var(--admin-purple) 58%, var(--admin-purple-dark));
    box-shadow: 0 1rem 2.5rem rgba(55, 31, 99, .2);
}

.competition-admin-hero--achievements {
    background: linear-gradient(125deg, var(--admin-purple-dark), var(--admin-purple) 58%, var(--admin-purple-dark));
}

.competition-admin-hero::after {
    content: "";
    position: absolute;
    width: 9rem;
    height: 9rem;
    right: 2rem;
    top: 1rem;
    background: url('/Images/LoginImages/leaderboard-icon.svg') center / contain no-repeat;
    opacity: .1;
}

.competition-admin-hero--achievements::after {
    background-image: url('/Images/LoginImages/achievements-icon.svg');
}

.competition-admin-hero > * {
    position: relative;
    z-index: 1;
}

.competition-admin-hero p,
.competition-admin-section header p,
.competition-admin-action > div > p,
.competition-admin-filters > div > p {
    margin: 0 0 .25rem;
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.competition-admin-hero p {
    opacity: .72;
}

.competition-admin-hero h1 {
    margin: 0;
    font: 650 clamp(2rem, 5vw, 3.4rem)/1 "Fredoka", sans-serif;
}

.competition-admin-hero > div > span {
    display: block;
    margin-top: .55rem;
    opacity: .82;
}

.competition-admin-role {
    padding: .45rem .75rem;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 999px;
    background: rgba(255, 255, 255, .12);
    font-size: .72rem;
    font-weight: 850;
    white-space: nowrap;
}

.competition-admin-notice,
.competition-admin-boundary {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1rem;
    padding: .9rem 1rem;
    border: 1px solid #dcccf2;
    border-radius: .85rem;
    color: #544263;
    background: #f4eefc;
}

.competition-admin-notice span,
.competition-admin-boundary div span {
    color: var(--admin-muted);
    font-size: .78rem;
}

.competition-admin-notice {
    justify-content: flex-start;
}

.competition-admin-filters,
.competition-admin-section,
.competition-admin-action,
.competition-admin-boundary {
    margin-top: 1rem;
    border: 1px solid var(--admin-line);
    background: #fff;
    box-shadow: 0 .55rem 1.7rem rgba(52, 34, 75, .06);
}

.competition-admin-filters {
    display: grid;
    grid-template-columns: minmax(13rem, 1.35fr) repeat(3, minmax(8rem, 1fr)) minmax(7rem, auto) auto;
    gap: .75rem;
    align-items: end;
    padding: 1rem;
    border-radius: 1.15rem;
}

.competition-admin-filters > .competition-admin-primary {
    grid-column: 1;
    width: 100%;
}

.competition-admin-filters h2,
.competition-admin-section h2,
.competition-admin-action h2 {
    margin: 0;
    font: 650 1.25rem/1.15 "Fredoka", sans-serif;
}

.competition-admin-filters > div > p,
.competition-admin-section header p,
.competition-admin-action > div > p {
    color: var(--admin-purple-dark);
}

.competition-admin-filters label,
.competition-admin-action label {
    display: grid;
    gap: .35rem;
}

.competition-admin-filters label > span,
.competition-admin-action label > span {
    color: #5d5367;
    font-size: .7rem;
    font-weight: 850;
}

.competition-admin-filters select,
.competition-admin-filters input:not([type=checkbox]),
.competition-admin-action textarea {
    width: 100%;
    min-height: 2.65rem;
    padding: .6rem .7rem;
    border: 1px solid #d9d0e4;
    border-radius: .65rem;
    color: var(--admin-ink);
    background: #fff;
    font: inherit;
    font-size: .78rem;
}

.competition-admin-check {
    display: flex !important;
    align-items: center;
    gap: .45rem !important;
    min-height: 2.65rem;
}

.competition-admin-check input[type="checkbox"] {
    width: 1.2rem;
    height: 1.2rem;
    margin: 0;
    accent-color: var(--admin-purple-dark);
}

.competition-admin-check-with-help {
    display: flex;
    align-items: center;
    gap: .25rem;
    min-height: 2.65rem;
}

.competition-admin-heading-with-help {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .25rem;
    min-width: 0;
}

.competition-admin-heading-with-help h2,
.competition-admin-heading-with-help h3 {
    margin: 0;
}

.competition-admin-primary,
.competition-admin-secondary,
.competition-admin-danger {
    min-height: 2.65rem;
    padding: .65rem 1rem;
    border: 1px solid transparent;
    border-radius: .7rem;
    font: 800 .8rem/1.1 "Quicksand", sans-serif;
    cursor: pointer;
}

.competition-admin-primary {
    color: #fff;
    background: var(--admin-purple);
}

.competition-admin-secondary {
    border-color: #d8cee4;
    color: var(--admin-purple-dark);
    background: #fff;
}

.competition-admin-danger {
    color: #fff;
    background: #ac3f50;
}

.competition-admin-section {
    overflow: hidden;
    border-radius: 1.15rem;
}

.competition-admin-section > header {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.15rem;
    border-bottom: 1px solid var(--admin-line);
}

.competition-admin-section > header > span {
    color: var(--admin-muted);
    font-size: .75rem;
    font-weight: 750;
}

.competition-admin-configuration-header {
    align-items: center !important;
}

.competition-admin-change-reason {
    background: #fbfaff;
}

.competition-admin-table-wrap {
    overflow-x: auto;
}

.competition-admin-table-wrap:focus-visible {
    outline: 3px solid var(--maps-brand-purple-dark, #6b35c7);
    outline-offset: 2px;
}

.competition-admin-inline-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

.competition-admin-detail-controls {
    display: flex;
    align-items: end;
    gap: .65rem;
    padding: .9rem 1.1rem;
    border-bottom: 1px solid var(--admin-line);
}

.competition-admin-detail-controls label {
    display: grid;
    flex: 1 1 16rem;
    gap: .3rem;
}

.competition-admin-detail-controls label span {
    color: var(--admin-muted);
    font-size: .7rem;
    font-weight: 850;
}

.competition-admin-detail-controls input {
    min-height: 2.55rem;
    padding: .55rem .7rem;
    border: 1px solid #d9d0e4;
    border-radius: .65rem;
    font: inherit;
}

.competition-admin-page table select,
.competition-admin-detail-controls select,
.competition-admin-correction-grid select {
    min-width: 9.5rem;
    min-height: 2.55rem;
    padding: .5rem 2rem .5rem .65rem;
    border: 1px solid var(--admin-line);
    border-radius: .65rem;
    color: var(--admin-ink);
    background-color: #fff;
    font: 750 .76rem/1.2 "Quicksand", sans-serif;
}

.competition-admin-page select:disabled {
    color: #776d80;
    background-color: #f3f0f6;
}

.competition-admin-subsection {
    padding: 1rem 1.1rem;
    border-top: 1px solid var(--admin-line);
}

.competition-admin-subsection h3 {
    margin: 0 0 .75rem;
    font: 650 1rem/1.2 "Fredoka", sans-serif;
}

.competition-admin-muted {
    margin: 0;
    color: var(--admin-muted);
    font-size: .8rem;
}

.competition-admin-evidence-grid,
.competition-admin-correction-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    padding: 1rem 1.1rem;
}

.competition-admin-evidence-grid > div,
.competition-admin-correction-grid label {
    display: grid;
    gap: .3rem;
}

.competition-admin-evidence-grid span,
.competition-admin-correction-grid label > span {
    color: var(--admin-muted);
    font-size: .68rem;
    font-weight: 850;
    text-transform: uppercase;
}

.competition-admin-evidence-grid strong {
    overflow-wrap: anywhere;
    font-size: .82rem;
}

.competition-admin-correction-grid input,
.competition-admin-correction-grid textarea {
    width: 100%;
    box-sizing: border-box;
    padding: .65rem .7rem;
    border: 1px solid #d9d0e4;
    border-radius: .65rem;
    font: inherit;
}

.competition-admin-wide {
    grid-column: 1 / -1;
}

.competition-evidence-list {
    display: grid;
    gap: .45rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.competition-evidence-list li {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .55rem .7rem;
    border-radius: .6rem;
    background: #faf8fc;
    font-size: .78rem;
}

.competition-admin-page table {
    width: 100%;
    border-collapse: collapse;
    font-size: .76rem;
}

.competition-admin-page th,
.competition-admin-page td {
    padding: .8rem .75rem;
    border-bottom: 1px solid #eee9f3;
    text-align: left;
    vertical-align: middle;
}

.competition-admin-page th {
    color: #6c6375;
    background: #faf8fc;
    font-size: .65rem;
    font-weight: 900;
    letter-spacing: .05em;
    text-transform: uppercase;
    white-space: nowrap;
}

.competition-admin-page td:first-child {
    min-width: 12rem;
}

.competition-admin-page td:first-child strong,
.competition-admin-page td:first-child small {
    display: block;
}

.competition-admin-page td:first-child small {
    margin-top: .2rem;
    color: var(--admin-muted);
}

.competition-admin-formula-table td:first-child {
    min-width: min(30rem, 64vw);
}

.competition-admin-formula-description,
.competition-admin-formula-key,
.competition-admin-formula-reference {
    display: block;
}

.competition-admin-formula-key {
    margin-top: .28rem;
    color: var(--admin-muted);
    font-size: .68rem;
    font-weight: 650;
}

.competition-admin-formula-description {
    max-width: 48rem;
    margin-top: .45rem;
    color: #5f5668;
    line-height: 1.5;
}

.competition-admin-formula-reference {
    min-width: 11rem;
}

.competition-admin-formula-reference strong,
.competition-admin-formula-reference code {
    display: block;
}

.competition-admin-formula-reference code {
    width: fit-content;
    margin-top: .3rem;
    color: var(--admin-muted);
}

.competition-admin-page code {
    padding: .2rem .35rem;
    border-radius: .35rem;
    color: #554565;
    background: #f0ecf4;
    font-size: .68rem;
}

.competition-status {
    display: inline-flex;
    padding: .3rem .55rem;
    border-radius: 999px;
    color: #62586d;
    background: #eeebf2;
    font-size: .66rem;
    font-weight: 850;
    white-space: nowrap;
}

.competition-status--published,
.competition-status--completed,
.competition-status--active {
    color: #14613f;
    background: #e1f7ec;
}

.competition-status--failed,
.competition-status--error {
    color: #8c2933;
    background: #fdecef;
}

.competition-status--closing,
.competition-status--pending {
    color: #795210;
    background: #fff1d5;
}

.competition-status--legacy {
    color: #5f5668;
    background: #eeebf2;
}

.competition-admin-link {
    padding: .35rem .5rem;
    border: 0;
    color: var(--admin-purple-dark);
    background: transparent;
    font: 850 .72rem/1.2 "Quicksand", sans-serif;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.competition-admin-action {
    display: grid;
    grid-template-columns: minmax(15rem, 1fr) minmax(14rem, .85fr) auto;
    gap: 1rem;
    align-items: end;
    padding: 1.15rem;
    border-color: #d8c8ed;
    border-radius: 1.05rem;
    background: linear-gradient(135deg, #fbf8ff, #fff);
}

.competition-admin-action > div:first-child > span {
    display: block;
    margin-top: .35rem;
    color: var(--admin-muted);
    font-size: .76rem;
    line-height: 1.45;
}

.competition-admin-action > div:not(:first-child) {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

.competition-admin-message {
    grid-column: 1 / -1;
    margin: 0;
    padding: .65rem .75rem;
    border-radius: .65rem;
    font-size: .76rem;
}

.competition-admin-message--success {
    color: #155f3e;
    background: #e7f8ef;
}

.competition-admin-message--error {
    color: #8f2832;
    background: #fff0f1;
}

.competition-admin-healthy {
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: 1.2rem;
}

.competition-admin-healthy > span {
    display: grid;
    width: 2.2rem;
    height: 2.2rem;
    place-items: center;
    border-radius: 50%;
    color: #14613f;
    background: #e1f7ec;
    font-weight: 900;
}

.competition-admin-healthy > span img {
    width: 1.25rem;
    height: 1.25rem;
    object-fit: contain;
}

.competition-admin-healthy div {
    display: grid;
    gap: .2rem;
}

.competition-admin-healthy small {
    color: var(--admin-muted);
}

.competition-failure-list,
.display-review-list {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.competition-failure-list li {
    display: grid;
    grid-template-columns: minmax(12rem, 1fr) auto auto minmax(8rem, .6fr);
    gap: .8rem;
    align-items: center;
    padding: .8rem 1rem;
    border-bottom: 1px solid #eee9f3;
    font-size: .75rem;
}

.competition-failure-list li > div {
    display: grid;
    justify-items: start;
    gap: .25rem;
}

.competition-failure-list li > span,
.competition-failure-list li > small {
    color: var(--admin-muted);
}

.display-review-list li {
    display: grid;
    grid-template-columns: minmax(12rem, 1fr) auto auto;
    gap: 1rem;
    align-items: center;
    padding: .85rem 1rem;
    border-bottom: 1px solid #eee9f3;
}

.display-review-list li > div {
    display: grid;
    gap: .18rem;
}

.display-review-list li > div span,
.display-review-list li > div small {
    color: var(--admin-muted);
    font-size: .68rem;
}

.display-review-list li > div strong {
    font-size: .95rem;
}

.competition-admin-boundary div {
    display: grid;
    gap: .2rem;
}

.competition-admin-boundary > span {
    padding: .35rem .6rem;
    border-radius: 999px;
    color: #70510f;
    background: #fff0cf;
    font-size: .7rem;
    font-weight: 850;
    white-space: nowrap;
}

.competition-admin-page :is(button, input, select, textarea):focus-visible {
    outline: 3px solid var(--maps-brand-purple-dark, #6b35c7);
    outline-offset: 2px;
}

@media (forced-colors: active) {
    .competition-admin-table-wrap:focus-visible,
    .competition-admin-page :is(button, input, select, textarea):focus-visible {
        outline-color: Highlight;
    }
}

.competition-admin-page button:disabled {
    opacity: .55;
    cursor: not-allowed;
}

@media (max-width: 1120px) {
    .competition-admin-filters {
        grid-template-columns: repeat(3, 1fr);
    }

    .competition-admin-action {
        grid-template-columns: 1fr 1fr;
    }

    .competition-admin-action > div:first-child,
    .competition-admin-message {
        grid-column: 1 / -1;
    }

    .competition-admin-filters > .competition-admin-primary {
        grid-column: auto;
    }
}

@media (max-width: 720px) {
    .competition-admin-page {
        padding: .75rem .75rem 4rem;
    }

    .competition-admin-hero,
    .competition-admin-notice,
    .competition-admin-boundary {
        align-items: flex-start;
        flex-direction: column;
    }

    .competition-admin-filters,
    .competition-admin-action {
        grid-template-columns: 1fr;
    }

    .competition-admin-action > div:first-child,
    .competition-admin-message {
        grid-column: auto;
    }

    .competition-failure-list li {
        grid-template-columns: 1fr 1fr;
    }

    .display-review-list li {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .display-review-list li > button {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .competition-admin-detail-controls {
        align-items: stretch;
        flex-direction: column;
    }

    .competition-admin-detail-controls label {
        flex-basis: auto;
    }

    .competition-admin-evidence-grid,
    .competition-admin-correction-grid {
        grid-template-columns: 1fr;
    }

    .competition-admin-wide {
        grid-column: auto;
    }
}

@media (prefers-reduced-motion: reduce) {
    .competition-admin-page *,
    .competition-admin-page *::before,
    .competition-admin-page *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}
