:root {
    color-scheme: light;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: #172033;
    background: #f4f7fb;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    min-height: 100vh;
    background: #f4f7fb;
}

a {
    color: inherit;
}

.app-shell {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    min-height: 100vh;
}

.sidebar {
    display: flex;
    flex-direction: column;
    padding: 24px 18px;
    background: #10233f;
    color: #dce7f6;
}

.brand {
    display: grid;
    margin-bottom: 34px;
    text-decoration: none;
}

.brand span {
    color: #fff;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: .06em;
}

.brand small {
    margin-top: 3px;
    color: #8fb0da;
}

.sidebar nav {
    display: grid;
    gap: 6px;
}

.nav-section-label {
    margin: 16px 12px 4px;
    color: #8fb0da;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.sidebar nav a,
.logout {
    border: 0;
    border-radius: 8px;
    padding: 10px 12px;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

.sidebar nav a:hover,
.sidebar nav a.active {
    background: #1d3a61;
    color: #fff;
}

.sidebar form {
    margin-top: auto;
}

.logout {
    width: 100%;
    color: #a9bdd8;
}

.topbar {
    display: flex;
    min-height: 86px;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #dfe6ef;
    padding: 18px 32px;
    background: #fff;
}

.topbar p,
.eyebrow {
    margin: 0 0 4px;
    color: #3972bd;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.topbar h1,
.intro-card h2,
.empty-state h2,
.login-card h1 {
    margin: 0;
}

.topbar h1 {
    font-size: 24px;
}

.topbar > span {
    color: #617087;
    font-size: 14px;
}

.content {
    padding: 32px;
}

.intro-card,
.empty-state,
.feature-card,
.login-card {
    border: 1px solid #dfe6ef;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 8px 24px rgb(35 57 88 / 6%);
}

.intro-card,
.empty-state {
    padding: 28px;
}

.intro-card p,
.empty-state p {
    max-width: 720px;
    color: #617087;
    line-height: 1.6;
}

.card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-top: 20px;
}

.feature-card {
    display: grid;
    gap: 8px;
    padding: 22px;
    text-decoration: none;
}

.feature-card:hover {
    border-color: #8cb4e8;
    box-shadow: 0 10px 30px rgb(35 91 164 / 10%);
}

.feature-card span,
.muted {
    color: #617087;
    line-height: 1.5;
}

.status {
    display: inline-block;
    border-radius: 999px;
    background: #edf4fd;
    padding: 6px 10px;
    color: #245f9f;
    font-size: 13px;
    font-weight: 700;
}

.login-page {
    display: grid;
    place-items: center;
    padding: 24px;
    background: #eef3f9;
}

.login-card {
    width: min(420px, 100%);
    padding: 32px;
}

.login-card form {
    display: grid;
    gap: 10px;
    margin-top: 24px;
}

.login-card label {
    margin-top: 6px;
    color: #34445c;
    font-size: 13px;
    font-weight: 700;
}

.login-card input[type="email"],
.login-card input[type="password"] {
    width: 100%;
    min-height: 44px;
    border: 1px solid #cbd6e4;
    border-radius: 8px;
    padding: 0 12px;
    font: inherit;
}

.checkbox {
    display: flex;
    gap: 8px;
    align-items: center;
}

.primary-button {
    min-height: 44px;
    margin-top: 8px;
    border: 0;
    border-radius: 8px;
    background: #245f9f;
    color: #fff;
    cursor: pointer;
    font: inherit;
    font-weight: 800;
}

.secondary-button {
    min-height: 38px;
    border: 1px solid #9fb2c9;
    border-radius: 8px;
    background: #fff;
    padding: 0 14px;
    color: #245f9f;
    cursor: pointer;
    font: inherit;
    font-weight: 800;
}

.danger-button {
    min-height: 44px;
    margin-top: 8px;
    border: 0;
    border-radius: 8px;
    background: #b42318;
    color: #fff;
    cursor: pointer;
    font: inherit;
    font-weight: 800;
}

.button-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.button-row .primary-button,
.button-row .danger-button {
    padding: 0 16px;
}

.primary-link-button {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    border-radius: 8px;
    background: #245f9f;
    padding: 0 16px;
    color: #fff;
    font-weight: 800;
    text-decoration: none;
}

.link-button {
    border: 0;
    background: transparent;
    padding: 0;
    color: #245f9f;
    cursor: pointer;
    font: inherit;
    font-weight: 800;
}

.inline-form {
    display: inline;
    margin-left: 12px;
}

.error {
    border-radius: 8px;
    background: #fff0f0;
    padding: 10px 12px;
    color: #a52a2a;
    font-size: 13px;
}

.page-intro {
    display: flex;
    gap: 24px;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 20px;
    border: 1px solid #dfe6ef;
    border-radius: 12px;
    background: #fff;
    padding: 22px;
}

.page-intro h2,
.panel-card h2,
.dataset-card h2 {
    margin: 0;
}

.page-intro p,
.dataset-card > p,
.timeline p {
    color: #617087;
    line-height: 1.5;
}

.dataset-list {
    display: grid;
    gap: 16px;
}

.dataset-card,
.panel-card {
    border: 1px solid #dfe6ef;
    border-radius: 12px;
    background: #fff;
    padding: 22px;
    box-shadow: 0 8px 24px rgb(35 57 88 / 5%);
}

.dataset-card-header,
.badge-row {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
}

.badge-row {
    justify-content: flex-start;
    flex-wrap: wrap;
}

.badge {
    display: inline-flex;
    border-radius: 999px;
    background: #eef2f7;
    padding: 5px 9px;
    color: #526176;
    font-size: 12px;
    font-weight: 800;
}

.badge-healthy,
.badge-passed,
.badge-enabled,
.badge-info {
    background: #e8f7ef;
    color: #187044;
}

.badge-warning,
.badge-pending {
    background: #fff5d9;
    color: #8a5a00;
}

.badge-error,
.badge-failed,
.badge-disabled {
    background: #ffebeb;
    color: #a12f2f;
}

.summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 20px 0;
}

.summary-grid div,
.detail-list div {
    border-radius: 8px;
    background: #f6f8fb;
    padding: 12px;
}

dt {
    color: #6c7a8e;
    font-size: 12px;
    font-weight: 700;
}

dd {
    margin: 5px 0 0;
    font-weight: 700;
}

code {
    color: #285d99;
}

.record-counts {
    color: #617087;
    font-size: 13px;
}

.source-warning {
    margin: 14px 0;
    border-left: 3px solid #d49a1f;
    border-radius: 6px;
    background: #fff8e8;
    padding: 10px 12px;
    color: #75500b;
    font-size: 13px;
}

.text-link,
.back-link {
    color: #245f9f;
    font-weight: 800;
    text-decoration: none;
}

.back-link {
    display: inline-block;
    margin-bottom: 14px;
}

.detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-top: 18px;
}

.detail-list {
    display: grid;
    gap: 8px;
    margin: 16px 0 0;
}

.table-wrap {
    overflow-x: auto;
    margin-top: 14px;
}

table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

th,
td {
    border-bottom: 1px solid #e5eaf0;
    padding: 10px;
    text-align: left;
    white-space: nowrap;
}

th {
    color: #617087;
    font-size: 11px;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.timeline {
    display: grid;
    gap: 12px;
    margin-top: 14px;
}

.timeline article {
    border-top: 1px solid #e5eaf0;
    padding-top: 12px;
}

.timeline article:first-child {
    border-top: 0;
    padding-top: 0;
}

.health-groups {
    display: grid;
    gap: 18px;
}

.health-check-list {
    display: grid;
    gap: 10px;
    margin-top: 16px;
}

.health-check-item {
    border-top: 1px solid #e5eaf0;
    padding-top: 12px;
}

.health-check-item:first-child {
    border-top: 0;
    padding-top: 0;
}

.health-check-heading {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 7px;
}

.health-check-heading time {
    color: #7b8798;
    font-size: 12px;
}

.health-check-item p {
    margin: 5px 0 0;
    color: #617087;
    font-size: 13px;
    line-height: 1.45;
}

.health-summary-card {
    margin-top: 18px;
}

.health-summary-card h3 {
    margin: 0 0 10px;
}

.health-summary-message {
    display: grid;
    gap: 3px;
    border-top: 1px solid #e5eaf0;
    padding: 9px 0;
}

.health-summary-message:first-of-type {
    border-top: 0;
}

.health-summary-message span {
    color: #617087;
    font-size: 13px;
    line-height: 1.4;
}

.diagnostic-section {
    margin-top: 22px;
}

.diagnostic-section > h2 {
    margin-bottom: 6px;
}

.diagnostic-card {
    margin-top: 14px;
}

.column-details,
.sample-details {
    margin-top: 14px;
    border: 1px solid #e1e7ef;
    border-radius: 8px;
    padding: 10px 12px;
}

.column-details summary,
.sample-details summary {
    color: #285d99;
    cursor: pointer;
    font-weight: 700;
}

.column-list {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 10px;
}

.column-list code {
    border-radius: 6px;
    background: #f1f5fa;
    padding: 5px 7px;
    font-size: 12px;
}

.diagnostic-year {
    margin-top: 18px;
    border-top: 1px solid #e5eaf0;
    padding-top: 16px;
}

.diagnostic-metrics {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
    align-items: center;
}

.diagnostic-year p {
    margin: 8px 0;
    color: #617087;
}

.recommendation {
    border-left: 3px solid #3972bd;
    border-radius: 6px;
    background: #edf4fd;
    padding: 10px 12px;
    color: #245f9f;
    font-weight: 700;
}

.repair-warning {
    margin-bottom: 20px;
    border: 1px solid #e7c66f;
    border-radius: 10px;
    background: #fff8e8;
    padding: 14px 16px;
    color: #75500b;
    line-height: 1.5;
}

.repair-year {
    margin-top: 20px;
    border-top: 1px solid #e5eaf0;
    padding-top: 18px;
}

.repair-year h3,
.repair-year h4 {
    margin: 0;
}

.repair-year h4 {
    margin-top: 18px;
}

.repair-summary-grid {
    margin-bottom: 14px;
}

.badge-risk-none {
    background: #e8f7ef;
    color: #187044;
}

.badge-risk-medium {
    background: #fff5d9;
    color: #8a5a00;
}

.badge-risk-high {
    background: #ffebeb;
    color: #a12f2f;
}

.sql-preview {
    margin-top: 16px;
    border: 1px solid #cbd6e4;
    border-radius: 8px;
    background: #f7f9fc;
    padding: 12px;
}

.sql-preview summary {
    color: #a12f2f;
    cursor: pointer;
    font-weight: 800;
}

.sql-preview pre {
    overflow-x: auto;
    margin: 12px 0 0;
    border-radius: 7px;
    background: #172033;
    padding: 14px;
    color: #e7eef8;
    font-size: 12px;
    line-height: 1.55;
}

.sql-preview pre code {
    color: inherit;
}

.admin-form {
    display: grid;
    gap: 10px;
    margin-top: 18px;
}

.admin-form label {
    color: #34445c;
    font-size: 13px;
    font-weight: 800;
}

.admin-form input[type="text"],
.admin-form input[type="url"],
.admin-form input[type="number"],
.admin-form select,
.admin-form textarea {
    width: 100%;
    border: 1px solid #cbd6e4;
    border-radius: 8px;
    padding: 11px 12px;
    background: #fff;
    color: #172033;
    font: inherit;
}

.form-span { grid-column: 1 / -1; }
.checkbox-field { display: flex !important; align-items: center; gap: 9px; }
.checkbox-field input { width: auto !important; }
.map-asset-preview { width: 100%; height: min(68vh, 680px); min-height: 440px; border: 1px solid #cbd6e4; border-radius: 10px; background: #e8edf3; overflow: hidden; }
.preview-toolbar { margin-bottom: 14px; }
.preview-toolbar select { margin-left: 8px; padding: 8px; border: 1px solid #cbd6e4; border-radius: 7px; background: #fff; }
.danger-button { border: 1px solid #d88078; border-radius: 8px; padding: 10px 14px; background: #fff; color: #a12f2f; font: inherit; font-weight: 700; cursor: pointer; }

.admin-form textarea {
    line-height: 1.5;
}

.legend-colour-control {
    display: grid;
    grid-template-columns: 48px minmax(120px, 1fr) 32px;
    gap: 8px;
    align-items: center;
}

.admin-form .legend-colour-control input[type="color"],
.admin-form .legend-class-table input[type="color"] {
    width: 44px;
    height: 40px;
    border: 1px solid #cbd6e4;
    border-radius: 7px;
    background: #fff;
    padding: 3px;
    cursor: pointer;
}

.legend-preview-swatch,
.legend-outline-preview {
    display: inline-block;
    width: 30px;
    height: 30px;
    border: 1px solid #cbd6e4;
    border-radius: 6px;
    background-clip: padding-box;
}

.legend-outline-preview {
    box-sizing: border-box;
    background: #fff;
    border-style: solid;
}

.legend-class-heading {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: end;
    margin-top: 12px;
}

.legend-class-heading h3,
.legend-class-heading p {
    margin: 0;
}

.legend-class-heading p {
    margin-top: 4px;
    color: #617087;
    font-size: 13px;
}

.legend-class-table {
    min-width: 1180px;
}

.legend-class-table th,
.legend-class-table td {
    vertical-align: middle;
}

.legend-class-table input[type="text"],
.legend-class-table input[type="number"] {
    min-width: 100px;
    padding: 8px;
}

.legend-class-table .class-label {
    min-width: 190px;
}

.legend-row-actions {
    display: flex;
    min-width: 94px;
    flex-direction: column;
    gap: 5px;
}

.legend-row-actions button,
.delete-class {
    border: 1px solid #cbd6e4;
    border-radius: 6px;
    background: #fff;
    padding: 6px 8px;
    color: #34445c;
    cursor: pointer;
    white-space: nowrap;
}

.delete-class {
    border-color: #efb4af;
    color: #a12f2f;
}

.legend-row-actions button:disabled {
    opacity: .45;
    cursor: default;
}

.sql-textarea,
.code-block {
    font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.code-block {
    overflow-x: auto;
    border-radius: 8px;
    background: #172033;
    padding: 14px;
    color: #e7eef8;
    font-size: 12px;
    line-height: 1.55;
}

.code-block code {
    color: inherit;
}

nav[role="navigation"] {
    margin-top: 18px;
}

.map-section-heading h3,
.map-section-heading p { margin: 0; }
.map-section-heading p { margin-top: 5px; color: #617087; }
.map-engine-builds { display: grid; grid-template-columns: minmax(160px, 210px) 1fr; gap: 22px; align-items: end; margin-top: 18px; }
.map-year-field { display: grid; gap: 6px; }
.map-year-field label { font-weight: 700; }
.map-year-field input { min-width: 0; border: 1px solid #cbd6e4; border-radius: 7px; padding: 10px; font: inherit; }
.map-year-field small { color: #617087; }
.map-build-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.map-build-actions button { min-height: 42px; margin: 0; padding: 0 13px; }
.map-output-path { overflow-wrap: anywhere; }
.production-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 16px; margin-top: 18px; }
.production-card { border: 1px solid #dbe3ee; border-radius: 10px; background: #fbfdff; padding: 18px; }
.production-card-heading { display: flex; justify-content: space-between; gap: 14px; align-items: start; }
.production-card-heading h4 { margin: 3px 0 0; font-size: 20px; }
.map-card-label { color: #617087; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.production-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px 20px; margin: 18px 0; }
.production-details div { min-width: 0; }
.production-details dt { margin-bottom: 4px; color: #617087; font-size: 11px; font-weight: 700; text-transform: uppercase; }
.production-details dd { margin: 0; overflow-wrap: anywhere; }
.production-actions { display: flex; gap: 8px; }
.production-actions form { margin: 0; }
.production-actions a, .production-actions button { display: inline-flex; min-height: 38px; margin: 0; align-items: center; padding: 0 13px; text-decoration: none; }
.production-actions button:disabled { cursor: not-allowed; opacity: .45; }
.map-empty-state { display: grid; gap: 5px; margin-top: 16px; border: 1px dashed #b9c7d8; border-radius: 10px; padding: 20px; color: #617087; }
.map-empty-state strong { color: #34445c; }
.map-history-wrap { margin-top: 16px; overflow: visible; }
.map-history-filters { display: grid; grid-template-columns: repeat(4, minmax(110px, .7fr)) minmax(220px, 1.6fr) auto; gap: 10px; align-items: end; margin-top: 18px; border-radius: 9px; background: #f5f8fc; padding: 14px; }
.map-history-filters label { display: grid; gap: 5px; min-width: 0; color: #526278; font-size: 12px; font-weight: 700; }
.map-history-filters select, .map-history-filters input { width: 100%; min-width: 0; border: 1px solid #cbd6e4; border-radius: 7px; background: #fff; padding: 9px; font: inherit; }
.map-filter-actions { display: flex; gap: 6px; }
.map-filter-actions button, .map-filter-actions a { display: inline-flex; min-height: 38px; margin: 0; align-items: center; padding: 0 12px; text-decoration: none; }
.map-history-table { width: 100%; table-layout: fixed; }
.map-history-table th, .map-history-table td { padding: 10px 7px; white-space: normal; overflow-wrap: anywhere; vertical-align: top; }
.map-history-table th:first-child { width: 14%; }
.map-history-table th:nth-child(2) { width: 7%; }
.map-history-table th:nth-child(3) { width: 4%; }
.map-history-table th:nth-child(4) { width: 7%; }
.map-history-table th:nth-child(5) { width: 7%; }
.map-history-table th:nth-child(6) { width: 6%; }
.map-history-table th:nth-child(7) { width: 8%; }
.map-history-table th:nth-child(8) { width: 7%; }
.map-history-table th:nth-child(9) { width: 11%; }
.map-history-table th:last-child { width: 29%; }
.map-history-table tr.is-current-production td { background: #f2faf5; }
.map-version-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.map-version-actions form { margin: 0; }
.map-version-actions button, .map-version-actions a { display: inline-flex; width: 100%; min-height: 34px; margin: 0; align-items: center; justify-content: center; padding: 5px 7px; font-size: 11px; text-align: center; text-decoration: none; }
.map-version-actions button:disabled { cursor: not-allowed; opacity: .45; }
.muted-text { color: #617087; }
.map-table-empty { padding: 24px; color: #617087; text-align: center; }
.failed-builds-card details > summary { cursor: pointer; font-weight: 800; }
.failed-builds-heading { display: flex; justify-content: space-between; gap: 18px; align-items: center; margin-bottom: 14px; }
.failed-builds-heading h3, .failed-builds-heading p { margin: 0; }
.failed-builds-heading p { margin-top: 4px; color: #617087; }
.failed-builds-heading form { margin: 0; }
.failed-builds-heading button { min-height: 38px; margin: 0; padding: 0 12px; }
.failed-build-list { display: grid; gap: 10px; margin-top: 16px; }
.failed-build-list article { display: grid; gap: 7px; border: 1px solid #efcfcc; border-radius: 8px; background: #fffafa; padding: 13px; }
.failed-build-list article > span { color: #617087; font-size: 12px; }
.failed-build-list pre { overflow-wrap: anywhere; margin: 0; white-space: pre-wrap; color: #8d2525; font: 12px/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; }
.failed-build-row { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.failed-build-actions { display: flex; gap: 6px; }
.failed-build-actions form { margin: 0; }
.failed-build-actions a, .failed-build-actions button { display: inline-flex; min-height: 34px; margin: 0; align-items: center; padding: 0 10px; font-size: 12px; text-decoration: none; }
.map-build-details { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 0; }
.map-build-details div { min-width: 0; border-bottom: 1px solid #e5eaf0; padding-bottom: 12px; }
.map-build-details .detail-wide { grid-column: 1 / -1; }
.map-build-details dt { margin-bottom: 5px; color: #617087; font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.map-build-details dd { margin: 0; overflow-wrap: anywhere; }
.build-error-panel pre { overflow-wrap: anywhere; border-radius: 8px; background: #fff3f2; padding: 14px; white-space: pre-wrap; color: #8d2525; }
.button-row { display: flex; flex-wrap: wrap; gap: 10px; }
.button-row button { cursor: pointer; }
.source-error { border-color: #efb4af; color: #8d2525; }

nav[role="navigation"] p {
    color: #617087;
    font-size: 13px;
}

@media (max-width: 1100px) {
    .map-history-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .map-filter-search { grid-column: 1 / -1; }
    .map-history-table,
    .map-history-table tbody,
    .map-history-table tr,
    .map-history-table td { display: block; width: 100%; }
    .map-history-table thead { display: none; }
    .map-history-table tbody { display: grid; gap: 14px; }
    .map-history-table tr { overflow: hidden; border: 1px solid #dbe3ee; border-radius: 10px; }
    .map-history-table td { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 12px; border-bottom: 1px solid #edf1f5; padding: 9px 12px; }
    .map-history-table td::before { content: attr(data-label); color: #617087; font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
    .map-history-table .map-actions-cell { display: block; }
    .map-history-table .map-actions-cell::before { display: block; margin-bottom: 8px; }
    .map-version-actions { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .map-table-empty::before { display: none; }
}

@media (max-width: 760px) {
    .app-shell {
        grid-template-columns: 1fr;
    }

    .sidebar {
        min-height: auto;
    }

    .sidebar form {
        margin-top: 18px;
    }

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

    .page-intro,
    .dataset-card-header {
        display: grid;
    }

    .summary-grid,
    .detail-grid,
    .form-grid {
        grid-template-columns: 1fr;
    }

    .health-check-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .topbar,
    .content {
        padding: 20px;
    }

    .map-engine-builds { grid-template-columns: 1fr; align-items: stretch; }
    .map-build-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .map-build-actions button { width: 100%; }
    .production-details { grid-template-columns: 1fr; }
    .map-history-filters { grid-template-columns: 1fr; }
    .map-filter-search { grid-column: auto; }
    .map-filter-actions > * { flex: 1; justify-content: center; }
    .map-history-table td { grid-template-columns: 95px minmax(0, 1fr); }
    .map-version-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .failed-builds-heading, .failed-build-row { align-items: stretch; flex-direction: column; }
    .map-build-details { grid-template-columns: 1fr; }
    .map-build-details .detail-wide { grid-column: auto; }
}