.admin-releases-page {
    margin: 0 auto;
    max-width: 1400px;
    padding-bottom: 5rem;
}

.admin-release-heading,
.admin-release-detail-heading {
    align-items: end;
    display: flex;
    gap: 2rem;
    justify-content: space-between;
    margin-bottom: 2rem;
}

.admin-release-heading h1,
.admin-release-detail-heading h1 {
    font-size: clamp(2.5rem, 5.5vw, 5.2rem);
    margin: 0.45rem 0 1rem;
}

.admin-release-heading > div:first-child p,
.admin-release-detail-heading > div:first-child p {
    max-width: 65ch;
}

.admin-release-assurance,
.admin-release-detail-heading > div:last-child {
    background: color-mix(in srgb, var(--surface-raised) 92%, transparent);
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.45rem;
    max-width: 24rem;
    padding: 1.15rem;
}

.admin-release-assurance span,
.admin-release-detail-heading > div:last-child span {
    color: var(--muted);
    line-height: 1.5;
}

.admin-release-layout {
    align-items: start;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1.35fr) minmax(20rem, 0.65fr);
}

.admin-release-panel {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    padding: clamp(1.2rem, 3vw, 2rem);
}

.admin-release-panel-heading {
    align-items: start;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.admin-release-panel-heading h2 {
    font-size: clamp(1.5rem, 3vw, 2.3rem);
    margin: 0.35rem 0 0;
}

.admin-release-panel-heading > span {
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--muted);
    font-size: 0.72rem;
    padding: 0.32rem 0.65rem;
    text-transform: uppercase;
}

.admin-release-form,
.admin-release-fields,
.admin-release-confirm,
.transition-card {
    display: grid;
    gap: 1rem;
}

.admin-release-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-release-fields label,
.admin-release-confirm label,
.transition-card label {
    display: grid;
    gap: 0.45rem;
}

.admin-release-fields label > span,
.admin-release-confirm label > span,
.transition-card label > span {
    color: var(--muted);
    font-size: 0.82rem;
    font-weight: 700;
}

.admin-release-fields .wide {
    grid-column: 1 / -1;
}

.admin-release-fields input,
.admin-release-fields select,
.admin-release-fields textarea,
.admin-release-confirm input,
.transition-card input,
.transition-card textarea {
    background: var(--surface-solid);
    border: 1px solid var(--line);
    border-radius: 9px;
    color: var(--text);
    font: inherit;
    min-width: 0;
    padding: 0.75rem 0.8rem;
    width: 100%;
}

.admin-release-fields textarea,
.transition-card textarea {
    min-height: 7rem;
    resize: vertical;
}

.admin-release-fields small {
    color: var(--muted);
    line-height: 1.45;
}

.admin-release-confirm {
    background: color-mix(in srgb, var(--primary) 9%, var(--surface-solid));
    border: 1px solid color-mix(in srgb, var(--primary) 38%, transparent);
    border-radius: var(--radius-sm);
    padding: 1rem;
}

.admin-release-confirm p {
    margin: 0;
}

.admin-release-button {
    border: 1px solid transparent;
    border-radius: 9px;
    cursor: pointer;
    font: inherit;
    font-weight: 800;
    padding: 0.75rem 1rem;
}

.admin-release-button.primary {
    background: var(--primary);
    color: white;
}

.admin-release-button.secondary {
    background: var(--surface-raised);
    border-color: var(--line-strong);
    color: var(--text);
}

.admin-release-button.danger {
    background: var(--danger);
    color: #19030a;
}

.admin-release-list {
    display: grid;
    gap: 0.6rem;
}

.admin-release-row {
    align-items: center;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    padding: 1rem;
    text-decoration: none;
}

.admin-release-row:hover {
    border-color: var(--line-strong);
}

.admin-release-row > div {
    display: grid;
    gap: 0.45rem;
}

.admin-release-row small,
.admin-release-empty {
    color: var(--muted);
}

.state {
    border: 1px solid currentColor;
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 800;
    justify-self: start;
    padding: 0.22rem 0.55rem;
    text-transform: uppercase;
}

.state.supported {
    color: var(--success);
}

.state.deprecated {
    color: var(--cyan);
}

.state.blocked {
    color: var(--danger);
}

.admin-release-message {
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.35rem;
    margin-bottom: 1rem;
    padding: 0.9rem 1rem;
}

.admin-release-message.success {
    background: var(--success-surface);
    border-color: color-mix(in srgb, var(--success) 48%, transparent);
    color: var(--success);
}

.admin-release-message.error {
    background: var(--danger-surface);
    border-color: color-mix(in srgb, var(--danger) 48%, transparent);
    color: var(--danger);
}

.admin-release-message small {
    color: var(--muted);
}

.admin-release-breadcrumb {
    color: var(--muted);
    display: flex;
    gap: 0.65rem;
    margin-bottom: 1.6rem;
}

.admin-release-breadcrumb a {
    color: var(--cyan);
}

.admin-release-detail-heading > div:last-child strong {
    font-family: Consolas, monospace;
    font-size: 1.5rem;
}

.admin-release-detail-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 1.1fr) minmax(20rem, 0.9fr);
    margin-bottom: 1rem;
}

.metadata-panel dl {
    margin: 0;
}

.metadata-panel dl div {
    border-bottom: 1px solid var(--line);
    display: grid;
    gap: 1rem;
    grid-template-columns: 10rem minmax(0, 1fr);
    padding: 0.8rem 0;
}

.metadata-panel dt {
    color: var(--muted);
}

.metadata-panel dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.metadata-panel code {
    color: var(--cyan);
    font-size: 0.75rem;
}

.localized-panel h3 {
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    margin: 1.2rem 0 0.35rem;
    text-transform: uppercase;
}

.localized-panel p {
    color: var(--text);
    line-height: 1.65;
    white-space: pre-wrap;
}

.transition-panel > p {
    max-width: 70ch;
}

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

.transition-card {
    background: var(--surface-solid);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    padding: 1rem;
}

.transition-card.danger {
    border-color: color-mix(in srgb, var(--danger) 38%, transparent);
}

.transition-card p {
    min-height: 4.5rem;
}

.admin-release-terminal {
    background: var(--danger-surface);
    border: 1px solid color-mix(in srgb, var(--danger) 38%, transparent);
    border-radius: var(--radius-sm);
    display: grid;
    gap: 0.4rem;
    padding: 1rem;
}

.admin-release-terminal span {
    color: var(--muted);
}

@media (max-width: 1080px) {
    .admin-release-layout,
    .admin-release-detail-grid {
        grid-template-columns: 1fr;
    }

    .catalog-panel {
        order: -1;
    }

    .transition-grid {
        grid-template-columns: 1fr;
    }

    .transition-card p {
        min-height: 0;
    }
}

@media (max-width: 680px) {
    .admin-release-heading,
    .admin-release-detail-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-release-assurance {
        max-width: none;
    }

    .admin-release-fields {
        grid-template-columns: 1fr;
    }

    .admin-release-fields .wide {
        grid-column: auto;
    }

    .metadata-panel dl div {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .admin-release-row {
        scroll-behavior: auto;
    }
}