:root {
    --bg: #f0f6f6;
    --surface: #ffffff;
    --text: #123238;
    --muted: #5f7276;
    --primary: #0d8f82;
    --primary-dark: #09695f;
    --accent: #e1f6f2;
    --danger: #dd514c;
    --warning: #f2bf47;
    --success: #21a372;
    --border: #d8e4e6;
    --shadow: 0 16px 40px rgba(16, 76, 78, 0.12);
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    font-family: Poppins, sans-serif;
    color: var(--text);
    background: radial-gradient(circle at top left, #dff4ef 0, #f4f8f9 35%, #ebf2f3 100%);
}

a {
    color: inherit;
    text-decoration: none;
}

.topbar {
    position: sticky;
    top: 0;
    z-index: 50;
    display: grid;
    grid-template-columns: minmax(260px, 340px) auto;
    align-items: center;
    gap: 12px;
    min-height: 82px;
    padding: 0 22px;
    background: linear-gradient(180deg, #ffffff 0%, #f7fbfb 100%);
    border-bottom: 1px solid var(--border);
    box-shadow: 0 4px 15px rgba(10, 70, 77, 0.08);
}

.topbar-brand {
    height: 100%;
    display: flex;
    align-items: center;
}

.brand-badge {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 7px 12px;
    border-radius: 12px;
    background: linear-gradient(135deg, #0f8a80, #1ea59b);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.25);
}

.brand-icon {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: rgba(255, 255, 255, 0.24);
    font-size: 1.1rem;
}

.brand-logo-image {
    width: 54px;
    height: 54px;
    border-radius: 10px;
    object-fit: contain;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.25);
    padding: 4px;
}

/* Perbaikan tumpang tindih logo & menu di mobile */
@media (max-width: 640px) {
    .topbar {
        grid-template-columns: 1fr;
        padding: 10px 14px;
        gap: 10px;
    }
    .topbar-brand {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
    }
    .brand-badge {
        padding: 6px 10px;
    }
    .brand-logo-image {
        width: 42px;
        height: 42px;
    }
    .topbar-actions {
        width: 100%;
        justify-content: flex-end;
        gap: 10px;
    }
    .topbar-main {
        align-items: flex-start;
        gap: 10px;
    }
}

.brand-badge h1 {
    margin: 0;
    font-size: 1.36rem;
    line-height: 1;
    letter-spacing: 0.3px;
}

.brand-badge p {
    margin: 0;
    font-size: 0.74rem;
    opacity: 0.85;
}

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

.ghost-btn {
    border: 1px solid var(--border);
    background: #fff;
    color: #355e63;
    border-radius: 8px;
    padding: 8px 12px;
    font: inherit;
    font-size: 0.86rem;
    cursor: pointer;
}

.notif-dot {
    position: relative;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #f1f8f8;
    color: #244d51;
}

.notif-dot b {
    position: absolute;
    top: -3px;
    right: -2px;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 0.65rem;
    color: #fff;
    background: var(--danger);
}

.user-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 10px 5px 6px;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: #fff;
}

.user-avatar {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #fff;
    font-weight: 700;
    background: linear-gradient(135deg, #0f9f8f, #4cb67f);
}

.user-photo {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid #d4e4e6;
}

.user-meta {
    line-height: 1.05;
}

.user-meta strong {
    display: block;
    font-size: 0.82rem;
}

.user-meta small {
    font-size: 0.72rem;
    color: #5a7479;
}

.logout-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 13px;
    border-radius: 9px;
    color: #fff;
    background: linear-gradient(135deg, #0a8a7b, #056f62);
}

.page-shell {
    width: min(1200px, calc(100% - 32px));
    margin: 18px auto 32px;
}

.hero-section {
    display: grid;
    grid-template-columns: 1.1fr 0.9fr;
    gap: 18px;
    padding: 28px;
    border-radius: 18px;
    border: 1px solid var(--border);
    background:
        linear-gradient(140deg, #f9fffd 0%, #ecf7f6 45%, #e8f4f5 100%),
        radial-gradient(circle at 90% 10%, rgba(14, 143, 130, 0.2), transparent 35%);
    box-shadow: var(--shadow);
}

.hero-text h2 {
    margin: 0;
    font-size: 2rem;
    line-height: 1.12;
}

.hero-subtitle {
    margin: 14px 0 8px;
    font-size: 1.42rem;
    font-weight: 500;
    max-width: 680px;
}

.hero-keywords {
    margin: 0;
    color: #3e595e;
    font-size: 1.05rem;
}

.hero-keywords strong {
    color: #b0643b;
}

.hero-actions {
    margin-top: 22px;
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
}

.btn-primary {
    border: 0;
    font: inherit;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 18px;
    border-radius: 10px;
    background: linear-gradient(135deg, #0f978a, #0d7d71);
    color: #fff;
    font-weight: 600;
    cursor: pointer;
}

.btn-soft {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 18px;
    border-radius: 10px;
    border: 1px solid #bbdbd8;
    background: #fff;
    color: #2a575d;
    font-weight: 500;
}

.hero-search,
.search-inline {
    min-width: 260px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 12px;
    border: 1px solid var(--border);
    background: #fff;
    border-radius: 10px;
}

.hero-search input,
.search-inline input {
    width: 100%;
    border: 0;
    height: 44px;
    font: inherit;
    background: transparent;
    outline: none;
}

.hero-visual {
    display: grid;
    align-content: center;
    gap: 14px;
    padding: 18px;
    border-radius: 15px;
    background: linear-gradient(135deg, rgba(20, 147, 137, 0.18), rgba(67, 168, 137, 0.18));
}

.visual-card {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.84);
    color: #24474c;
    font-weight: 500;
}

.visual-card i {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    color: #0e887d;
    background: #e3f5f1;
}

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

.module-card {
    display: flex;
    gap: 12px;
    padding: 16px;
    border-radius: 14px;
    border: 1px solid var(--border);
    background: rgba(255, 255, 255, 0.96);
}

.module-card h3 {
    margin: 0;
    font-size: 1.06rem;
}

.module-card p {
    margin: 6px 0 0;
    color: var(--muted);
    font-size: 0.92rem;
    line-height: 1.35;
}

.module-icon {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    color: #0d857a;
    background: #e5f5f2;
    font-size: 1.2rem;
}

.stats-grid {
    margin-top: 16px;
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dashboard-stats {
    margin-top: 0;
}

.dashboard-analytics-grid {
    margin-top: 14px;
    display: grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap: 12px;
}

.dashboard-analytics-grid .table-card {
    min-height: 320px;
}

.dashboard-analytics-grid canvas {
    width: 100% !important;
    height: 250px !important;
}

.dashboard-map {
    width: 100%;
    height: 340px;
    border-radius: 10px;
    border: 1px solid #d2e4e6;
    overflow: hidden;
}

.priority-list {
    display: grid;
    gap: 8px;
}

.priority-item {
    border: 1px solid #d7e7e9;
    border-radius: 10px;
    padding: 10px 11px;
    background: #f9fcfc;
}

.priority-item strong {
    display: block;
}

.priority-item small {
    color: #5a7479;
}

.stats-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    border-radius: 12px;
    border: 1px solid #dce6e7;
    background: linear-gradient(180deg, #ffffff 0%, #f9fcfc 100%);
}

/* Balita listing */
.balita-page-shell {
    display: grid;
    gap: 18px;
}

.balita-page-shell > .alert {
    margin: 0;
}

.balita-page-head h2 {
    margin: 0 0 6px;
    font-size: 1.8rem;
}

.balita-page-head p {
    margin: 0;
    color: #65818c;
    max-width: 760px;
    line-height: 1.6;
}

.balita-section-card {
    padding: 18px;
}

.balita-section-card .table-head {
    margin-bottom: 14px;
}

.balita-section-card .table-head h3 {
    margin: 0;
    font-size: 1.02rem;
}

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

.balita-summary-grid .form-card {
    padding: 14px 16px;
    border: 1px solid #d8e7ed;
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f7fbfc 100%);
    box-shadow: 0 14px 28px rgba(13, 57, 68, 0.05);
}

.balita-summary-grid .form-card strong {
    display: block;
    margin-bottom: 6px;
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64808b;
}

.balita-summary-grid .form-card span {
    display: block;
    color: #123744;
    font-size: 1rem;
    font-weight: 700;
}

.balita-summary-grid-two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.balita-filter-card,
.balita-table-card {
    padding: 18px;
}

.balita-filter-card {
    border: 1px solid #d7e6eb;
    background: linear-gradient(180deg, #ffffff 0%, #fbfefe 100%);
}

.balita-filter-form {
    display: grid;
    gap: 16px;
}

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

.balita-nik-search-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
}

.balita-filter-grid label,
.balita-nik-search-grid label {
    display: grid;
    gap: 8px;
    margin: 0;
}

.balita-filter-grid label span,
.balita-nik-search-grid label span {
    font-size: 0.92rem;
    font-weight: 700;
    color: #214450;
}

.balita-filter-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.balita-export-actions {
    display: flex;
    gap: 12px;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    margin-top: -6px;
}

.balita-export-btn {
    min-width: 168px;
    justify-content: center;
}

.balita-table-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
    color: #64808b;
    font-size: 0.92rem;
}

.balita-action-guide {
    display: grid;
    gap: 10px;
    margin-bottom: 14px;
    padding: 14px 16px;
    border: 1px solid #d9e8ed;
    border-radius: 16px;
    background: #f9fcfd;
}

.balita-action-guide strong {
    color: #173d48;
    font-size: 0.9rem;
}

.balita-action-guide-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.balita-action-guide-list span {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 8px 12px;
    border-radius: 999px;
    border: 1px solid #d1e3e8;
    background: #fff;
    color: #234752;
    font-size: 0.86rem;
    font-weight: 600;
}

.balita-table-card .table-head {
    margin-bottom: 14px;
}

.balita-table-card .table-head p {
    margin: 6px 0 0;
    color: #65818c;
}

.balita-table th {
    white-space: nowrap;
}

.balita-table td {
    vertical-align: middle;
}

.balita-table tbody tr:hover {
    background: #f7fbfc;
}

.balita-action-cell {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.balita-action-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    border: 1px solid #d2e4eb;
    background: #fff;
    color: #0d3944;
    text-decoration: none;
    box-shadow: 0 8px 18px rgba(13, 57, 68, 0.08);
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.balita-action-link:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 22px rgba(13, 57, 68, 0.12);
    border-color: #bdd5dd;
}

.balita-action-link.is-disabled,
.balita-action-link:disabled {
    opacity: 0.58;
    cursor: not-allowed;
    pointer-events: none;
    box-shadow: none;
    transform: none;
    filter: saturate(0.45);
}

.balita-action-link.wide {
    width: auto;
    min-width: 42px;
    padding: 0 14px;
}

.balita-action-link.text-button {
    gap: 8px;
    min-height: 36px;
    font-weight: 700;
}

.balita-action-link.text-button span {
    white-space: nowrap;
}

.balita-action-link.success {
    background: #e8fbf1;
    color: #11804b;
}

.balita-action-link.info {
    background: #eaf6ff;
    color: #1769aa;
}

.balita-action-link.primary {
    background: #eef2ff;
    color: #3f51b5;
}

.balita-action-link.warning {
    background: #fff6e6;
    color: #c58300;
}

.balita-action-link.danger {
    background: #fff0f0;
    color: #d94b4b;
}

.balita-action-link.dark {
    background: #f4edf7;
    color: #704281;
}

.stats-card i {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    font-size: 1.2rem;
    color: #c28c1f;
    background: #fff4d9;
}

.stats-card.warning i {
    color: #c65248;
    background: #fde8e6;
}

.stats-card.success i {
    color: #1e8f66;
    background: #e3f8ef;
}

.stats-card p {
    margin: 0;
    color: var(--muted);
    font-size: 0.86rem;
}

.stats-card h3 {
    margin: 3px 0 0;
    font-size: 1.6rem;
}

.page-footnote {
    margin: 14px 0 0;
    color: #60787d;
    text-align: center;
    font-size: 0.92rem;
}

.layout-with-sidebar {
    display: grid;
    grid-template-columns: 230px 1fr;
    gap: 15px;
    width: min(1300px, calc(100% - 30px));
    margin: 15px auto 30px;
}

.sidebar {
    position: sticky;
    top: 98px;
    border-radius: 18px;
    border: 1px solid #1d7f7c;
    color: #e8f8f4;
    min-height: calc(100vh - 130px);
    background:
        linear-gradient(180deg, rgba(16, 114, 111, 0.95) 0%, rgba(14, 94, 88, 0.95) 100%),
        radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.13), transparent 35%);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
}

.sidebar-top {
    padding: 18px 12px;
}

.sidebar-title {
    margin: 0 8px 12px;
    font-size: 0.78rem;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    opacity: 0.8;
}

.sidebar-link {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 7px;
    padding: 11px 12px;
    border-radius: 10px;
    color: #e8f8f4;
}

.sidebar-link.active,
.sidebar-link:hover {
    background: rgba(255, 255, 255, 0.16);
}

.sidebar-weather {
    margin: 0 12px 14px;
    border-radius: 10px;
    padding: 12px;
    display: flex;
    gap: 9px;
    align-items: center;
    background: rgba(255, 255, 255, 0.12);
    font-size: 0.92rem;
}

.content-area {
    min-width: 0;
}

.panel-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin-bottom: 12px;
}

.risk-chip-wrap {
    display: flex;
    gap: 10px;
    align-items: center;
}

.risk-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.88rem;
    border-radius: 999px;
    padding: 8px 12px;
    border: 1px solid var(--border);
    background: #fff;
}

.risk-chip i {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
}

.risk-chip.red i {
    background: var(--danger);
}

.risk-chip.yellow i {
    background: var(--warning);
}

.map-panel {
    position: relative;
    border-radius: 16px;
    border: 1px solid var(--border);
    background: #fff;
    box-shadow: var(--shadow);
    overflow: hidden;
}

.risk-map {
    width: 100%;
    height: calc(100vh - 180px);
    min-height: 580px;
}

.map-geolocate-control {
    background: transparent;
    border: none;
    box-shadow: none;
}

.map-geolocate-btn {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    border: 1px solid #d2e4eb;
    background: #ffffff;
    color: #123744;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 10px 18px rgba(13, 57, 68, 0.15);
    transition: transform 0.16s ease, box-shadow 0.16s ease, border-color 0.16s ease;
}

.map-geolocate-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 24px rgba(13, 57, 68, 0.18);
    border-color: #bdd5dd;
}

.risk-map .leaflet-popup-content-wrapper,
.public-map .leaflet-popup-content-wrapper,
.dashboard-map .leaflet-popup-content-wrapper {
    border-radius: 18px;
    box-shadow: 0 20px 38px rgba(15, 54, 58, 0.18);
}

.risk-map .leaflet-popup-content,
.public-map .leaflet-popup-content,
.dashboard-map .leaflet-popup-content {
    margin: 14px 16px;
}

.sigap-map-popup {
    min-width: 248px;
    display: grid;
    gap: 8px;
    font-family: "Manrope", sans-serif;
    color: #1c3233;
}

.sigap-map-popup__row {
    display: grid;
    grid-template-columns: minmax(110px, 132px) 1fr;
    gap: 8px;
    align-items: start;
}

.sigap-map-popup__label {
    color: #627777;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.45;
}

.sigap-map-popup__value {
    color: #1d3333;
    font-size: 0.84rem;
    font-weight: 700;
    line-height: 1.5;
    word-break: break-word;
}

.sigap-map-popup__value.is-status {
    color: var(--popup-status, #0d8f82);
}

@media (max-width: 640px) {
    .sigap-map-popup {
        min-width: 0;
    }

    .sigap-map-popup__row {
        grid-template-columns: 1fr;
        gap: 2px;
    }
}

.map-geolocate-btn i {
    font-size: 16px;
}

.map-legend {
    position: absolute;
    left: 18px;
    bottom: 18px;
    min-width: 200px;
    border-radius: 10px;
    border: 1px solid var(--border);
    padding: 10px 12px;
    background: rgba(255, 255, 255, 0.92);
}

.map-legend h3 {
    margin: 0 0 8px;
    font-size: 0.92rem;
}

.map-legend p {
    margin: 6px 0;
    font-size: 0.85rem;
}

.dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-right: 7px;
    border-radius: 50%;
}

.dot.red {
    background: var(--danger);
}

.dot.yellow {
    background: var(--warning);
}

.form-card,
.table-card {
    border-radius: 14px;
    border: 1px solid #d8e3e4;
    background: #ffffff;
    box-shadow: 0 12px 22px rgba(13, 76, 73, 0.06);
    padding: 16px;
}

.form-card h2,
.table-card h2 {
    margin: 0 0 6px;
    font-size: 1.45rem;
}

.form-card p,
.table-card p {
    margin: 0 0 16px;
    color: var(--muted);
}

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

.form-grid .full {
    grid-column: 1 / -1;
}

.question-label.bold {
    font-weight: 700;
}

label {
    display: block;
    margin-bottom: 6px;
    font-size: 0.88rem;
    font-weight: 500;
}

input,
select,
textarea {
    width: 100%;
    border: 1px solid #c8dade;
    border-radius: 10px;
    background: #fff;
    padding: 11px 12px;
    font: inherit;
    color: var(--text);
    outline: none;
}

textarea {
    resize: vertical;
}

input:focus,
select:focus,
textarea:focus {
    border-color: #33a79e;
    box-shadow: 0 0 0 3px rgba(38, 156, 142, 0.14);
}

.checkbox-group {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px;
}

.checkbox-card {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-height: 56px;
    padding: 12px 14px;
    border: 1px solid #c8dade;
    border-radius: 14px;
    background: #fbfefe;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
    cursor: pointer;
}

.checkbox-card:hover {
    border-color: #8cbab6;
    box-shadow: 0 12px 24px rgba(17, 93, 84, 0.08);
    transform: translateY(-1px);
}

.checkbox-card input {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    flex-shrink: 0;
}

.checkbox-card span {
    color: #1d4044;
    font-size: 0.95rem;
    line-height: 1.4;
}

.question-section {
    margin-top: 10px;
    padding: 16px 18px;
    border: 1px solid #cfe1e2;
    border-radius: 18px;
    background:
        radial-gradient(circle at top right, rgba(27, 166, 149, 0.12), transparent 28%),
        linear-gradient(135deg, #f7fcfc, #eef8f8);
}

.question-section-badge {
    display: inline-flex;
    align-items: center;
    padding: 5px 10px;
    border-radius: 999px;
    background: rgba(20, 132, 120, 0.12);
    color: #0f7468;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.question-section h3 {
    margin: 10px 0 6px;
    color: #123c40;
    font-size: 1.1rem;
}

.question-section p {
    margin: 0;
    color: #57757a;
    font-size: 0.92rem;
    line-height: 1.55;
}

.form-actions {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-top: 6px;
}

.fixed-location-box {
    margin-top: 10px;
    padding: 14px;
    border-radius: 12px;
    border: 1px solid #c9dde0;
    background: #f7fbfb;
}

.fixed-location-box h3 {
    margin: 0;
    font-size: 1.05rem;
}

.fixed-location-box p {
    margin: 6px 0 12px;
    font-size: 0.88rem;
    color: #4e6b70;
}

.geo-inline {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-bottom: 12px;
}

.geo-status {
    font-size: 0.86rem;
    color: #547378;
}

.geo-status[data-state="success"] {
    color: #1f8358;
}

.geo-status[data-state="warning"] {
    color: #966f0d;
}

.geo-status[data-state="error"] {
    color: #a33933;
}

.mini-map-wrap {
    border: 1px solid #c8dade;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
}

.mini-input-map {
    width: 100%;
    height: 220px;
    min-height: 220px;
}

.question-admin-wrap {
    display: grid;
    gap: 14px;
}

.question-new-box {
    border: 1px solid #c9dde0;
    border-radius: 12px;
    background: #f8fcfc;
    padding: 14px;
}

.question-new-box h3 {
    margin: 0 0 12px;
    font-size: 1.05rem;
}

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

.table-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin-bottom: 12px;
}

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

.search-inline.compact {
    min-width: 310px;
}

.table-wrap {
    overflow-x: auto;
    border-radius: 12px;
    border: 1px solid #d2e2e4;
}

table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
}

th,
td {
    text-align: left;
    padding: 11px 12px;
    border-bottom: 1px solid #e1ecee;
    font-size: 0.9rem;
    vertical-align: top;
}

thead th {
    background: #f2f8f8;
    font-weight: 600;
    color: #244b4f;
}

tbody tr:hover {
    background: #f8fcfc;
}

td small {
    display: block;
    color: #647d81;
    margin-top: 4px;
}

.answer-item {
    font-size: 0.82rem;
    line-height: 1.35;
    margin-bottom: 4px;
    color: #2b4d52;
}

.muted-small {
    font-size: 0.82rem;
    color: #728b8f;
}

.status-pill {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 4px 9px;
    font-size: 0.76rem;
    font-weight: 600;
}

.status-pill.pending {
    color: #966f0d;
    background: #fff4d5;
}

.status-pill.approved {
    color: #1f8358;
    background: #e6f7ef;
}

.status-pill.rejected {
    color: #9a2d29;
    background: #feeceb;
}

.status-pill.completed,
.status-pill.muted {
    color: #5b757a;
    background: #ebf1f2;
}

.action-col {
    min-width: 170px;
}

.btn-mini {
    padding: 6px 10px;
    border-radius: 8px;
    font-size: 0.78rem;
}

.btn-soft.danger {
    border-color: #f3c3c0;
    color: #9d3a35;
    background: #fff8f8;
}

.inline-form {
    display: grid;
    gap: 8px;
}

.inline-actions {
    display: flex;
    gap: 6px;
}

.notif-list {
    display: grid;
    gap: 10px;
}

.notif-item {
    border-radius: 12px;
    border: 1px solid #d0e1e3;
    padding: 12px;
    background: #fff;
}

.notif-item.unread {
    border-color: #87cfc6;
    background: #f5fdfb;
}

.notif-item h3 {
    margin: 0 0 6px;
    font-size: 1rem;
}

.notif-item p {
    margin: 0;
    font-size: 0.9rem;
    color: #415f64;
}

.notif-meta {
    margin-top: 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
}

.table-user-photo {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid #d4e4e6;
}

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

.status-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 5px 9px;
    font-size: 0.78rem;
    font-weight: 600;
}

.status-badge.danger {
    color: #ae3430;
    background: #fde7e5;
}

.status-badge.warning {
    color: #8c6f16;
    background: #fff4d5;
}

.status-badge.ok {
    color: #1e7e4a;
    background: #e4f8ee;
}

.empty-state {
    text-align: center;
    color: #6b8387;
    padding: 24px;
}

.alert {
    border-radius: 10px;
    padding: 10px 12px;
    margin-bottom: 12px;
    font-size: 0.92rem;
    border: 1px solid transparent;
}

.alert.error {
    color: #9a2d29;
    background: #feeceb;
    border-color: #f5cac7;
}

.alert.success {
    color: #1f754f;
    background: #e6f7ef;
    border-color: #bee9d3;
}

.login-body {
    min-height: 100vh;
    background:
        radial-gradient(circle at 15% 20%, rgba(17, 146, 132, 0.22), transparent 30%),
        radial-gradient(circle at 85% 90%, rgba(95, 176, 141, 0.22), transparent 40%),
        linear-gradient(135deg, #e8f7f3, #f6fafb);
    display: grid;
    place-items: center;
    padding: 16px;
}

.login-shell {
    width: min(1080px, 100%);
    display: grid;
    grid-template-columns: 1fr 420px;
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid #bdd9d6;
    background: #fff;
    box-shadow: var(--shadow);
}

.login-showcase {
    padding: 34px;
    background:
        linear-gradient(150deg, rgba(9, 128, 120, 0.96), rgba(8, 108, 98, 0.94)),
        radial-gradient(circle at 85% 20%, rgba(255, 255, 255, 0.22), transparent 35%);
    color: #edf9f5;
}

.showcase-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 7px 10px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.14);
}

.login-logo {
    width: 46px;
    height: 46px;
    border-radius: 10px;
    object-fit: contain;
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.28);
    padding: 4px;
}

.showcase-badge h1 {
    margin: 0;
    font-size: 1.22rem;
}

.showcase-badge p {
    margin: 0;
    font-size: 0.72rem;
    opacity: 0.92;
}

.login-showcase h2 {
    margin: 22px 0 10px;
    font-size: 1.9rem;
    line-height: 1.2;
}

.login-showcase p {
    margin: 0;
    max-width: 500px;
    color: #d0eee8;
}

.login-showcase ul {
    margin: 20px 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 10px;
}

.login-showcase li {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.login-card {
    padding: 28px;
}

.login-card h3 {
    margin: 0;
    font-size: 1.5rem;
}

.login-card > p {
    margin: 6px 0 18px;
    color: var(--muted);
}

.form-stack label {
    margin-bottom: 5px;
}

.form-stack .input-with-icon {
    margin-bottom: 12px;
}

.input-with-icon {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 0 11px;
    border-radius: 10px;
    border: 1px solid #cadcdf;
}

.input-with-icon input {
    border: 0;
    box-shadow: none;
    height: 44px;
    padding: 0;
}

.input-with-icon i {
    color: #4d6a70;
}

.login-helper {
    margin-top: 16px;
    border-radius: 10px;
    padding: 11px 12px;
    background: #f1f7f7;
    color: #3d5d62;
    font-size: 0.86rem;
}

.login-helper p {
    margin: 4px 0;
}

.settings-preview {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.settings-preview h3 {
    margin: 0;
    font-size: 1rem;
}

.logo-preview {
    max-width: 360px;
    width: 100%;
    height: auto;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: #f6fbfb;
}

.slide-preview {
    width: 100%;
    max-width: 320px;
    height: 120px;
    object-fit: cover;
    border-radius: 10px;
    border: 1px solid var(--border);
    background: #f5f9fa;
}

.checkbox-inline {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    margin-top: 8px;
    font-size: 0.88rem;
    color: #3a5a5f;
}

.checkbox-inline input {
    width: 16px;
    height: 16px;
}

.public-body {
    margin: 0;
    background:
        radial-gradient(circle at 15% 15%, rgba(12, 148, 134, 0.2), transparent 28%),
        radial-gradient(circle at 85% 85%, rgba(58, 177, 138, 0.2), transparent 30%),
        linear-gradient(160deg, #edf8f6, #f8fbfc);
}

.public-header {
    width: min(1300px, calc(100% - 24px));
    margin: 14px auto 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    padding: 10px 14px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
}

.public-brand {
    display: flex;
    align-items: center;
    gap: 12px;
}

.public-brand img {
    width: 170px;
    max-width: 42vw;
    border-radius: 9px;
}

.public-brand h1 {
    margin: 0;
    font-size: 1.24rem;
}

.public-brand p {
    margin: 0;
    color: #5d777c;
    font-size: 0.88rem;
}

.public-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.public-main {
    width: min(1300px, calc(100% - 24px));
    margin: 14px auto 24px;
}

.public-hero {
    border-radius: 18px;
    border: 1px solid var(--border);
    overflow: hidden;
    background: #fff;
    box-shadow: var(--shadow);
}

.public-slider {
    position: relative;
    height: clamp(250px, 38vw, 460px);
    background: #cee7e3;
}

.public-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transform: scale(1.02);
    transition: opacity 0.45s ease, transform 0.45s ease;
}

.public-slide.active {
    opacity: 1;
    transform: scale(1);
}

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

.slide-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    border: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(7, 44, 43, 0.52);
    color: #fff;
    display: grid;
    place-items: center;
    cursor: pointer;
}

.slide-btn.prev {
    left: 14px;
}

.slide-btn.next {
    right: 14px;
}

.slide-dots {
    position: absolute;
    left: 50%;
    bottom: 12px;
    transform: translateX(-50%);
    display: flex;
    gap: 8px;
}

.slide-dot {
    border: 0;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.5);
    cursor: pointer;
}

.slide-dot.active {
    background: #fff;
}

.public-hero-text {
    padding: 20px 22px 24px;
    background:
        linear-gradient(145deg, rgba(13, 143, 130, 0.15), rgba(47, 165, 140, 0.08)),
        #fff;
}

.public-hero-text h2 {
    margin: 0;
    font-size: clamp(1.4rem, 3vw, 2.1rem);
}

.public-hero-text p {
    margin: 8px 0 0;
    color: #3f6167;
    font-size: clamp(1rem, 1.4vw, 1.18rem);
}

.public-map-section {
    margin-top: 14px;
    border-radius: 16px;
    border: 1px solid var(--border);
    background: #fff;
    padding: 16px;
    box-shadow: var(--shadow);
}

.section-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 10px;
    margin-bottom: 12px;
}

.section-head h3 {
    margin: 0;
    font-size: 1.35rem;
}

.section-head p {
    margin: 0;
    color: #5e787d;
}

.public-map-wrap {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #d2e4e6;
}

.public-map {
    width: 100%;
    height: min(68vh, 620px);
    min-height: 420px;
}

.public-footer {
    width: min(1300px, calc(100% - 24px));
    margin: 0 auto 20px;
    border-radius: 14px;
    border: 1px solid var(--border);
    background: #fff;
    box-shadow: var(--shadow);
    padding: 16px 18px;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 14px;
}

.public-footer.premium {
    grid-template-columns: 1fr;
    padding: 0;
    overflow: hidden;
}

.footer-brand-panel {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 18px;
    background: linear-gradient(140deg, rgba(8, 133, 119, 0.15), rgba(28, 168, 140, 0.08));
    border-bottom: 1px solid #d2e5e7;
}

.footer-brand-panel img {
    width: 82px;
    height: 82px;
    object-fit: contain;
    border-radius: 14px;
    background: #fff;
    border: 1px solid #d2e5e7;
    padding: 6px;
}

.footer-brand-panel h4 {
    margin: 0;
    font-size: 1.2rem;
}

.footer-brand-panel p {
    margin: 5px 0 0;
    color: #4d6a70;
}

.footer-grid-panel {
    padding: 16px 18px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.footer-col h4 {
    margin: 0 0 8px;
    font-size: 1.08rem;
}

.footer-col p {
    margin: 2px 0;
    color: #496469;
}

.footer-link {
    display: block;
    margin: 6px 0;
    color: #166259;
    font-weight: 500;
}

.footer-mini {
    margin-top: 8px;
    font-size: 0.84rem;
    color: #638186;
}

.footer-bottom-bar {
    border-top: 1px solid #d2e5e7;
    padding: 10px 18px 13px;
    display: flex;
    justify-content: space-between;
    gap: 10px;
    color: #5b757a;
    font-size: 0.86rem;
}

/* Enterprise polish */
body {
    background:
        radial-gradient(circle at 12% 8%, rgba(40, 171, 151, 0.14), transparent 24%),
        radial-gradient(circle at 88% 92%, rgba(17, 128, 117, 0.1), transparent 28%),
        linear-gradient(180deg, #edf4f5 0%, #eaf2f4 45%, #edf4f5 100%);
}

.topbar {
    min-height: 78px;
    padding: 8px 20px;
    border-bottom: 1px solid #cbdde0;
    box-shadow: 0 6px 18px rgba(16, 76, 78, 0.08);
}

.topbar-actions {
    gap: 10px;
}

.ghost-btn {
    min-height: 38px;
    padding: 8px 13px;
    border-color: #c6d7da;
    color: #34575c;
}

.layout-with-sidebar {
    width: min(1400px, calc(100% - 28px));
    gap: 18px;
}

.sidebar {
    top: 92px;
    border-radius: 20px;
    border-color: #1a7f79;
    background:
        linear-gradient(180deg, rgba(18, 122, 116, 0.96) 0%, rgba(15, 97, 92, 0.96) 100%),
        radial-gradient(circle at 15% 10%, rgba(255, 255, 255, 0.17), transparent 30%);
}

.sidebar-link {
    min-height: 44px;
    border-radius: 11px;
    font-size: 1.02rem;
}

.content-area {
    display: grid;
    gap: 14px;
    align-content: start;
}

.form-card,
.table-card {
    border-radius: 18px;
    padding: 22px;
    border-color: #d0e0e3;
    box-shadow: 0 14px 35px rgba(18, 83, 82, 0.12);
}

.form-card h2,
.table-card h2 {
    font-size: 1.62rem;
    margin-bottom: 8px;
}

.form-card p,
.table-card p {
    margin-bottom: 18px;
}

label {
    font-size: 0.9rem;
}

input,
select,
textarea {
    border-color: #c6d9dd;
    min-height: 47px;
}

textarea {
    min-height: 120px;
}

.btn-primary,
.btn-soft {
    min-height: 42px;
    padding: 10px 16px;
}

.btn-mini {
    min-height: 32px;
    padding: 6px 10px;
}

.table-wrap {
    border-color: #d5e4e7;
}

th,
td {
    border-bottom-color: #e3ecef;
}

thead th {
    background: #eff6f7;
}

.fixed-location-box {
    border-color: #cddfe2;
    background: linear-gradient(180deg, #fbfefe, #f4fbfc);
}

.mini-map-wrap {
    border-color: #c7dade;
}

.mini-input-map {
    height: 250px;
}

.dashboard-analytics-grid .table-card {
    min-height: 360px;
}

.dashboard-map {
    height: 390px;
}

.priority-item {
    padding: 11px 12px;
    background: #f7fcfc;
}

.public-header {
    background: rgba(255, 255, 255, 0.97);
    border-color: #cfdee2;
}

.public-footer.premium {
    border-color: #ccdfe2;
    box-shadow: 0 15px 38px rgba(16, 78, 81, 0.14);
}

.footer-brand-panel {
    padding: 18px 20px;
}

.footer-grid-panel {
    padding: 18px 20px;
}

.footer-bottom-bar {
    padding: 11px 20px 14px;
}

/* Internal header redesign */
.topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 108px;
    padding: 10px 22px;
    background: linear-gradient(180deg, #ffffff 0%, #f7fbfc 100%);
}

.topbar-brand {
    flex: 0 0 clamp(420px, 48vw, 620px);
    min-width: 320px;
}

.brand-badge {
    position: relative;
    overflow: hidden;
    width: 100%;
    min-height: 92px;
    padding: 10px 22px 10px 16px;
    border-radius: 18px 18px 42px 18px;
    background:
        radial-gradient(circle at 85% 20%, rgba(255, 255, 255, 0.16), transparent 38%),
        linear-gradient(135deg, #0d8f82 0%, #138579 58%, #1ba393 100%);
    border: 1px solid rgba(255, 255, 255, 0.34);
    box-shadow: 0 12px 28px rgba(8, 94, 88, 0.28);
}

.brand-badge::before {
    content: "";
    position: absolute;
    right: 16px;
    top: 12px;
    width: 96px;
    height: 96px;
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.2) 2px, transparent 2.5px);
    background-size: 12px 12px;
    opacity: 0.35;
}

.brand-logo-image {
    width: 176px;
    height: 86px;
    border-radius: 0;
    background: transparent;
    border: 0;
    padding: 0;
    object-fit: contain;
    z-index: 1;
}

.brand-copy {
    position: relative;
    z-index: 1;
}

.brand-badge h1 {
    font-size: 2rem;
    line-height: 1;
    letter-spacing: 0.5px;
}

.brand-badge p {
    margin-top: 3px;
    font-size: 0.9rem;
    opacity: 0.95;
}

.topbar-center {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.center-chip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 13px;
    border-radius: 999px;
    border: 1px solid #c8dde0;
    background: #fff;
    color: #31585d;
    font-size: 0.86rem;
    font-weight: 600;
    white-space: nowrap;
}

.center-chip.soft {
    background: #f2f9f8;
    color: #37666a;
}

.topbar-actions {
    margin-left: auto;
    gap: 10px;
}

@media (max-width: 1180px) {
    .topbar {
        flex-wrap: wrap;
        min-height: auto;
        row-gap: 10px;
        padding: 10px 14px;
    }

    .topbar-brand {
        flex: 1 1 100%;
        min-width: 0;
    }

    .topbar-center {
        width: 100%;
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .topbar-actions {
        width: 100%;
        justify-content: flex-end;
        flex-wrap: wrap;
    }

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

    .public-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .public-footer {
        grid-template-columns: 1fr;
    }

    .footer-grid-panel {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 960px) {
    .layout-with-sidebar {
        grid-template-columns: 1fr;
    }

    .sidebar {
        min-height: auto;
        position: static;
    }

    .risk-map {
        min-height: 460px;
    }

    .hero-section {
        grid-template-columns: 1fr;
    }

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

    .dashboard-analytics-grid {
        grid-template-columns: 1fr;
    }

    .login-shell {
        grid-template-columns: 1fr;
    }

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

    .section-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .question-new-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    .topbar {
        gap: 10px;
    }

    .topbar-center {
        display: none;
    }

    .brand-badge p,
    .user-meta small {
        display: none;
    }

    .brand-logo-image {
        width: 104px;
        height: 54px;
    }

    .brand-badge h1 {
        font-size: 1.35rem;
    }

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

    .table-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .table-actions {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .search-inline.compact {
        min-width: 0;
        width: 100%;
    }

    .public-brand {
        flex-direction: column;
        align-items: flex-start;
    }

    .public-header-actions {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .footer-brand-panel {
        flex-direction: column;
        align-items: flex-start;
    }

    .footer-bottom-bar {
        flex-direction: column;
        align-items: flex-start;
    }

    .geo-inline {
        flex-direction: column;
        align-items: flex-start;
    }
}

.schedule-card-gap {
    margin-top: 14px;
}

.public-schedule-section {
    margin-top: 14px;
    border-radius: 16px;
    border: 1px solid var(--border);
    background: #fff;
    padding: 16px;
    box-shadow: var(--shadow);
}

.public-schedule-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.public-schedule-card {
    border-radius: 12px;
    border: 1px solid #d6e5e8;
    background: linear-gradient(180deg, #ffffff 0%, #f8fcfc 100%);
    padding: 12px;
}

.public-schedule-card h4 {
    margin: 0 0 8px;
    font-size: 1.04rem;
}

.public-schedule-card p {
    margin: 5px 0;
    color: #426167;
    font-size: 0.9rem;
}

.public-empty {
    border: 1px dashed #c8dadd;
    border-radius: 12px;
    background: #f8fcfc;
}

.action-col .inline-form {
    margin-top: 6px;
}

@media (max-width: 1100px) {
    .public-schedule-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .public-schedule-grid {
        grid-template-columns: 1fr;
    }
}

/* Professional internal header */
.topbar {
    position: sticky;
    top: 0;
    z-index: 60;
    display: grid;
    grid-template-columns: minmax(240px, 320px) minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 74px;
    padding: 8px 12px;
    border-bottom: 1px solid #d3e2e5;
    background: linear-gradient(180deg, #ffffff 0%, #f7fbfb 100%);
    box-shadow: 0 4px 16px rgba(13, 76, 76, 0.08);
}

.topbar-brand {
    min-width: 0;
}

.brand-badge {
    width: 100%;
    min-height: 56px;
    padding: 6px 10px;
    border-radius: 12px;
    background:
        radial-gradient(circle at 88% 15%, rgba(255, 255, 255, 0.14), transparent 35%),
        linear-gradient(135deg, #0c8f83 0%, #17998d 100%);
    box-shadow: 0 8px 18px rgba(8, 104, 95, 0.24);
}

.brand-logo-image {
    width: 58px;
    height: 38px;
    object-fit: contain;
    object-position: center;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.18);
    padding: 2px;
}

.brand-badge h1 {
    margin: 0;
    font-size: 0.94rem;
    line-height: 1;
    white-space: nowrap;
    letter-spacing: 0.4px;
}

.brand-badge p {
    margin: 3px 0 0;
    font-size: 0.69rem;
    opacity: 0.9;
    white-space: nowrap;
}

.topbar-center {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: thin;
    padding-bottom: 2px;
}

.topbar-center::-webkit-scrollbar {
    height: 5px;
}

.topbar-center::-webkit-scrollbar-thumb {
    background: #c7dadd;
    border-radius: 999px;
}

.top-nav-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 9px;
    border-radius: 9px;
    border: 1px solid #d0e1e3;
    background: #fff;
    color: #31575d;
    font-size: 0.76rem;
    font-weight: 600;
    white-space: nowrap;
    flex: 0 0 auto;
}

.top-nav-link.active {
    border-color: #98d2cb;
    background: #e9f8f5;
    color: #0f6f67;
}

.topbar-actions {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
}

.ghost-btn {
    padding: 7px 10px;
    font-size: 0.79rem;
    border-radius: 8px;
}

.notif-dot {
    width: 33px;
    height: 33px;
}

.user-chip {
    padding: 4px 8px 4px 5px;
}

.user-avatar,
.user-photo {
    width: 27px;
    height: 27px;
}

.user-meta strong {
    font-size: 0.78rem;
}

.logout-btn {
    padding: 8px 11px;
    border-radius: 8px;
    font-size: 0.83rem;
}

.topbar-clock {
    min-width: 146px;
    padding: 7px 9px;
    border-radius: 9px;
    border: 1px solid #cfe0e4;
    background: #f8fcfc;
    color: #264d54;
    font-size: 0.74rem;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0.2px;
}

.layout-with-sidebar {
    grid-template-columns: 214px 1fr;
    width: min(1260px, calc(100% - 22px));
    gap: 12px;
}

.sidebar {
    border-radius: 14px;
    min-height: calc(100vh - 110px);
    top: 84px;
}

.sidebar-top {
    padding: 14px 10px;
}

.sidebar-link {
    margin-bottom: 4px;
    padding: 9px 10px;
    font-size: 0.93rem;
}

.sidebar-title {
    margin-bottom: 10px;
}

.form-card,
.table-card {
    padding: 14px;
    border-radius: 14px;
}

.stats-grid {
    margin-top: 10px;
    gap: 10px;
}

.stats-card {
    padding: 12px;
}

.dashboard-analytics-grid {
    gap: 10px;
}

.priority-item {
    padding: 9px 10px;
}

.app-copyright {
    width: min(1300px, calc(100% - 30px));
    margin: 0 auto 20px;
    text-align: center;
    color: #5a7479;
    font-size: 0.84rem;
    padding: 8px 10px;
}

.login-copyright {
    text-align: center;
    color: #5d767a;
    font-size: 0.84rem;
    margin: 10px 0 4px;
}

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

.mobile-app-card {
    border: 1px solid #d2e3e6;
    border-radius: 12px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fcfc 100%);
    padding: 14px;
}

.mobile-app-card h3 {
    margin: 0 0 8px;
    font-size: 1.08rem;
}

.mobile-app-card h3 i {
    margin-right: 6px;
}

.mobile-app-card p {
    margin: 5px 0;
}

.install-guide {
    margin-top: 14px;
    border: 1px solid #d2e2e6;
    border-radius: 12px;
    background: #f8fcfc;
    padding: 13px;
}

.install-guide h3 {
    margin: 0 0 8px;
}

.install-guide ul {
    margin: 0;
    padding-left: 18px;
    color: #3d5f64;
}

@media (max-width: 1280px) {
    .topbar {
        grid-template-columns: minmax(220px, 280px) minmax(0, 1fr) auto;
    }

    .top-nav-link {
        font-size: 0.74rem;
        padding: 6px 8px;
    }

    .layout-with-sidebar {
        width: min(1220px, calc(100% - 18px));
        grid-template-columns: 198px 1fr;
    }
}

@media (max-width: 1050px) {
    .topbar {
        grid-template-columns: 1fr;
        gap: 8px;
        padding: 8px 10px;
    }

    .topbar-center {
        justify-content: flex-start;
        overflow-x: auto;
    }

    .topbar-actions {
        justify-content: flex-end;
        flex-wrap: wrap;
    }

    .topbar-clock {
        order: -1;
    }

    .layout-with-sidebar {
        grid-template-columns: 1fr;
    }

    .sidebar {
        min-height: auto;
        position: static;
    }
}

@media (max-width: 720px) {
    .brand-badge h1 {
        font-size: 0.96rem;
    }

    .brand-logo-image {
        width: 48px;
        height: 30px;
    }

    .topbar-center {
        display: none;
    }

    .topbar-clock {
        min-width: 0;
        width: 100%;
    }

    .mobile-app-grid {
        grid-template-columns: 1fr;
    }
}

/* Public Portal Refresh */
.public-body {
    background:
        radial-gradient(circle at top left, rgba(16, 159, 146, 0.12), transparent 30%),
        radial-gradient(circle at top right, rgba(250, 176, 63, 0.12), transparent 24%),
        linear-gradient(180deg, #f6fbfb 0%, #edf5f5 52%, #f7fcfb 100%);
    color: #16363d;
}

.public-body a {
    color: inherit;
}

.public-header {
    position: sticky;
    top: 0;
    z-index: 40;
    background: rgba(246, 252, 251, 0.88);
    backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(15, 110, 101, 0.1);
    box-shadow: 0 12px 28px rgba(11, 75, 70, 0.08);
}

.public-header-shell,
.public-main,
.public-footer.premium {
    width: min(1240px, calc(100% - 32px));
    margin-inline: auto;
}

.public-header-shell {
    display: grid;
    grid-template-columns: minmax(280px, 360px) minmax(0, 1fr) auto;
    align-items: center;
    gap: 24px;
    padding: 16px 0;
}

.public-brand {
    position: relative;
    display: flex;
    align-items: center;
    gap: 18px;
    overflow: hidden;
    padding: 18px 20px;
    border-radius: 28px;
    text-decoration: none;
    color: #ffffff;
    background: linear-gradient(135deg, #0d8f82 0%, #15a093 50%, #0a756a 100%);
    box-shadow: 0 20px 36px rgba(12, 114, 103, 0.22);
}

.public-brand::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 84% 24%, rgba(255, 255, 255, 0.2) 0, rgba(255, 255, 255, 0.04) 14%, transparent 15%),
        radial-gradient(circle at 88% 38%, rgba(255, 255, 255, 0.18) 0, rgba(255, 255, 255, 0.04) 12%, transparent 13%),
        radial-gradient(circle at 86% 52%, rgba(255, 255, 255, 0.12) 0, rgba(255, 255, 255, 0.04) 10%, transparent 11%);
    pointer-events: none;
}

.public-brand img {
    position: relative;
    z-index: 1;
    width: 88px;
    height: 88px;
    object-fit: contain;
    border-radius: 22px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.public-brand > div {
    position: relative;
    z-index: 1;
}

.public-brand-kicker {
    display: inline-flex;
    align-items: center;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    background: rgba(255, 255, 255, 0.15);
}

.public-brand h1 {
    margin: 8px 0 4px;
    font-size: clamp(1.4rem, 2vw, 2.05rem);
    line-height: 1.02;
    letter-spacing: 0.02em;
}

.public-brand p {
    margin: 0;
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.96rem;
}

.public-nav {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
}

.public-nav-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 18px;
    border-radius: 999px;
    border: 1px solid #d2e6e3;
    background: rgba(255, 255, 255, 0.78);
    color: #2d5a60;
    text-decoration: none;
    font-weight: 600;
    box-shadow: 0 8px 20px rgba(16, 80, 76, 0.05);
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease, background 0.22s ease;
}

.public-nav-link:hover,
.public-nav-link.active {
    border-color: rgba(13, 143, 130, 0.3);
    background: linear-gradient(180deg, #ffffff 0%, #ecf9f6 100%);
    color: #0d6e65;
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(12, 105, 96, 0.1);
}

.public-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

.public-body .btn-primary,
.public-body .btn-soft {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 0 22px;
    border-radius: 16px;
    text-decoration: none;
    font-weight: 700;
    letter-spacing: 0.01em;
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease, background 0.22s ease;
}

.public-body .btn-primary {
    color: #ffffff;
    background: linear-gradient(135deg, #0e8f82 0%, #0b756a 100%);
    border: 1px solid rgba(6, 102, 92, 0.4);
    box-shadow: 0 16px 28px rgba(12, 117, 107, 0.2);
}

.public-body .btn-soft {
    color: #0c6f66;
    background: rgba(255, 255, 255, 0.84);
    border: 1px solid #d3e6e3;
    box-shadow: 0 12px 24px rgba(13, 86, 82, 0.06);
}

.public-body .btn-primary:hover,
.public-body .btn-soft:hover {
    transform: translateY(-1px);
}

.public-main {
    display: grid;
    gap: 24px;
    padding: 26px 0 40px;
}

.public-hero,
.public-schedule-section,
.public-map-section {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(183, 215, 213, 0.9);
    border-radius: 34px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.95) 0%, rgba(246, 252, 252, 0.96) 100%);
    box-shadow: 0 24px 46px rgba(16, 78, 74, 0.08);
}

.public-hero::before,
.public-schedule-section::before,
.public-map-section::before {
    content: "";
    position: absolute;
    inset: auto -100px -120px auto;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(13, 143, 130, 0.1) 0%, transparent 66%);
    pointer-events: none;
}

.public-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(340px, 0.95fr);
    gap: 32px;
    align-items: center;
    padding: 42px;
}

.public-hero-copy {
    position: relative;
    z-index: 1;
}

.public-chip {
    display: inline-flex;
    align-items: center;
    padding: 9px 14px;
    border-radius: 999px;
    background: linear-gradient(180deg, #f4fbfa 0%, #ebf8f6 100%);
    border: 1px solid #cfe6e2;
    color: #0d6f66;
    font-size: 0.86rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.public-hero-copy h2 {
    margin: 18px 0 14px;
    max-width: 760px;
    color: #12353b;
    font-size: clamp(2.3rem, 4.4vw, 4.05rem);
    line-height: 1.02;
}

.public-hero-lead {
    margin: 0 0 12px;
    font-size: clamp(1.16rem, 2vw, 1.52rem);
    font-weight: 700;
    color: #0c766c;
}

.public-hero-subtext {
    max-width: 640px;
    margin: 0;
    color: #557378;
    font-size: 1rem;
    line-height: 1.75;
}

.public-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 28px;
}

.public-trust-row {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 20px;
}

.public-trust-row span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    border-radius: 16px;
    background: rgba(243, 250, 249, 0.92);
    border: 1px solid #d7e9e7;
    color: #486b70;
    font-weight: 500;
}

.public-slider-card {
    position: relative;
    z-index: 1;
    padding: 18px;
    border-radius: 30px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.9) 0%, rgba(240, 249, 248, 0.96) 100%);
    border: 1px solid rgba(201, 228, 223, 0.9);
    box-shadow: 0 24px 48px rgba(9, 84, 78, 0.12);
}

.public-slider {
    position: relative;
    min-height: 410px;
    border-radius: 24px;
    overflow: hidden;
    background: linear-gradient(135deg, #d9efec 0%, #b9ddd8 100%);
}

.public-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transform: scale(1.03);
    transition: opacity 0.45s ease, transform 0.45s ease;
}

.public-slide.active {
    opacity: 1;
    transform: scale(1);
}

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

.slide-btn {
    position: absolute;
    top: 50%;
    z-index: 2;
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.88);
    color: #0d7168;
    box-shadow: 0 12px 24px rgba(9, 69, 65, 0.14);
    transform: translateY(-50%);
    cursor: pointer;
}

.slide-btn.prev {
    left: 16px;
}

.slide-btn.next {
    right: 16px;
}

.slide-dots {
    position: absolute;
    left: 50%;
    bottom: 18px;
    z-index: 2;
    display: flex;
    gap: 8px;
    transform: translateX(-50%);
}

.slide-dot {
    width: 11px;
    height: 11px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.48);
    cursor: pointer;
}

.slide-dot.active {
    background: #ffffff;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.22);
}

.public-slider-caption {
    display: grid;
    gap: 4px;
    padding: 16px 6px 2px;
}

.public-slider-caption strong {
    color: #14373d;
    font-size: 1rem;
}

.public-slider-caption span {
    color: #56767b;
    font-size: 0.94rem;
}

.public-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.public-kpi-card {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 22px 20px;
    border-radius: 24px;
    border: 1px solid rgba(200, 227, 223, 0.92);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(244, 251, 251, 0.96) 100%);
    box-shadow: 0 20px 34px rgba(15, 79, 75, 0.07);
}

.public-kpi-card i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    border-radius: 18px;
    background: rgba(13, 143, 130, 0.12);
    color: #0d8b7f;
    font-size: 1.24rem;
}

.public-kpi-card.warn i {
    background: rgba(217, 87, 73, 0.12);
    color: #cb544a;
}

.public-kpi-card.soft i {
    background: rgba(247, 171, 53, 0.15);
    color: #cf8a1a;
}

.public-kpi-card strong {
    display: block;
    color: #17363c;
    font-size: clamp(1.45rem, 2vw, 2rem);
    line-height: 1.05;
}

.public-kpi-card span {
    display: block;
    margin-top: 5px;
    color: #5d7a7f;
    font-size: 0.92rem;
}

.public-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.public-feature-card {
    padding: 26px 24px;
    border-radius: 26px;
    border: 1px solid rgba(204, 229, 225, 0.92);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.94) 0%, rgba(247, 252, 252, 0.97) 100%);
    box-shadow: 0 22px 34px rgba(18, 78, 75, 0.06);
}

.public-feature-card i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 18px;
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(14, 143, 130, 0.12) 0%, rgba(247, 171, 53, 0.15) 100%);
    color: #0c7b71;
    font-size: 1.4rem;
}

.public-feature-card h3 {
    margin: 0 0 10px;
    color: #14353b;
    font-size: 1.2rem;
}

.public-feature-card p {
    margin: 0;
    color: #607c81;
    line-height: 1.7;
}

.public-schedule-section,
.public-map-section {
    padding: 32px;
}

.public-body .section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 20px;
}

.public-body .section-head h3 {
    margin: 0;
    color: #15373d;
    font-size: clamp(1.55rem, 2.4vw, 2.1rem);
}

.public-body .section-head p {
    max-width: 560px;
    margin: 0;
    color: #5d7a7f;
    line-height: 1.65;
}

.public-schedule-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.public-schedule-card,
.public-map-aside-card {
    border-radius: 24px;
    border: 1px solid rgba(204, 228, 224, 0.94);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(245, 251, 251, 0.96) 100%);
    box-shadow: 0 18px 30px rgba(15, 78, 73, 0.06);
}

.public-schedule-card {
    padding: 22px 20px;
}

.public-schedule-card h4 {
    margin: 0 0 14px;
    color: #14353b;
    font-size: 1.08rem;
}

.public-schedule-card p {
    margin: 0 0 10px;
    color: #5e7a7f;
    line-height: 1.65;
}

.public-schedule-card p:last-child {
    margin-bottom: 0;
}

.public-empty {
    padding: 24px;
    border-radius: 22px;
    border: 1px dashed #cfe2df;
    background: rgba(248, 252, 252, 0.82);
    color: #5b787d;
}

.public-map-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, 0.72fr);
    gap: 18px;
}

.public-map-wrap {
    position: relative;
    min-height: 560px;
    overflow: hidden;
    border-radius: 28px;
    border: 1px solid rgba(196, 225, 222, 0.94);
    background: #dfeeed;
    box-shadow: 0 22px 34px rgba(14, 84, 79, 0.08);
}

.public-map {
    min-height: 560px;
}

.public-map-aside {
    display: grid;
    align-content: start;
    gap: 16px;
}

.public-map-aside-card {
    padding: 22px;
}

.public-map-aside-card h4 {
    margin: 0 0 10px;
    color: #16363c;
    font-size: 1.05rem;
}

.public-map-aside-card p {
    margin: 0;
    color: #607c81;
    line-height: 1.7;
}

.public-map-aside-card.accent {
    background: linear-gradient(135deg, rgba(13, 143, 130, 0.98) 0%, rgba(11, 117, 106, 0.96) 100%);
    border-color: rgba(9, 102, 92, 0.45);
    box-shadow: 0 24px 40px rgba(7, 89, 81, 0.22);
}

.public-map-aside-card.accent h4,
.public-map-aside-card.accent p {
    color: #ffffff;
}

.public-map-aside-card.accent .btn-primary {
    width: 100%;
    margin-top: 16px;
    background: #ffffff;
    color: #0b7268;
    border-color: rgba(255, 255, 255, 0.2);
    box-shadow: 0 14px 30px rgba(6, 59, 54, 0.16);
}

.map-legend {
    position: absolute;
    left: 18px;
    bottom: 18px;
    z-index: 20;
    padding: 16px 18px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(196, 220, 218, 0.94);
    box-shadow: 0 16px 26px rgba(12, 76, 72, 0.12);
}

.map-legend h3 {
    margin: 0 0 8px;
    font-size: 1rem;
    color: #17373d;
}

.map-legend p {
    margin: 5px 0;
    color: #5c787d;
}

.public-footer.premium {
    margin-top: 6px;
    margin-bottom: 34px;
    padding: 30px;
    border-radius: 34px;
    background:
        radial-gradient(circle at top right, rgba(255, 255, 255, 0.12), transparent 28%),
        linear-gradient(135deg, #0e7c72 0%, #0a645c 100%);
    color: #ffffff;
    box-shadow: 0 26px 44px rgba(9, 74, 67, 0.2);
}

.public-footer-top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 24px;
    align-items: center;
    padding-bottom: 24px;
    margin-bottom: 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}

.footer-brand-panel {
    display: flex;
    align-items: center;
    gap: 18px;
}

.footer-brand-panel img {
    width: 90px;
    height: 90px;
    object-fit: contain;
    border-radius: 24px;
    padding: 10px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.18);
}

.footer-brand-panel h4 {
    margin: 10px 0 8px;
    font-size: 1.45rem;
}

.footer-brand-panel p {
    max-width: 680px;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.7;
}

.public-footer-cta {
    display: grid;
    justify-items: end;
    gap: 12px;
}

.public-footer-cta span {
    color: rgba(255, 255, 255, 0.84);
    font-weight: 500;
}

.public-footer-cta .btn-primary {
    min-width: 220px;
    background: #ffffff;
    color: #0b746a;
    border-color: rgba(255, 255, 255, 0.16);
    box-shadow: 0 16px 28px rgba(6, 60, 55, 0.16);
}

.footer-grid-panel {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.footer-col {
    padding: 20px 22px;
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
}

.footer-col h4 {
    margin: 0 0 14px;
    color: #ffffff;
    font-size: 1.08rem;
}

.footer-col p,
.footer-link,
.footer-mini {
    margin: 0 0 8px;
    color: rgba(255, 255, 255, 0.8);
    line-height: 1.7;
    text-decoration: none;
}

.footer-link {
    display: block;
}

.footer-link:hover {
    color: #ffffff;
}

.footer-bottom-bar {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 12px 24px;
    margin-top: 24px;
    padding-top: 22px;
    border-top: 1px solid rgba(255, 255, 255, 0.16);
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.92rem;
}

#portal-home,
#jadwal-posyandu,
#peta-publik,
#portal-footer {
    scroll-margin-top: 112px;
}

@media (max-width: 1180px) {
    .public-header-shell {
        grid-template-columns: 1fr;
        justify-items: start;
    }

    .public-nav,
    .public-header-actions {
        justify-content: flex-start;
    }

    .public-hero-grid,
    .public-map-grid,
    .public-footer-top {
        grid-template-columns: 1fr;
    }

    .public-kpi-grid,
    .public-schedule-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .public-feature-grid,
    .footer-grid-panel {
        grid-template-columns: 1fr;
    }

    .public-footer-cta {
        justify-items: start;
    }
}

@media (max-width: 760px) {
    .public-header-shell,
    .public-main,
    .public-footer.premium {
        width: min(1240px, calc(100% - 20px));
    }

    .public-brand {
        width: 100%;
        padding: 16px;
        border-radius: 24px;
    }

    .public-brand img {
        width: 72px;
        height: 72px;
    }

    .public-hero-grid,
    .public-schedule-section,
    .public-map-section,
    .public-footer.premium {
        padding: 22px;
    }

    .public-hero-copy h2 {
        font-size: 2rem;
    }

    .public-nav {
        width: 100%;
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: 4px;
    }

    .public-nav-link {
        white-space: nowrap;
    }

    .public-header-actions,
    .public-hero-actions,
    .public-trust-row {
        width: 100%;
    }

    .public-header-actions > *,
    .public-hero-actions > * {
        flex: 1 1 100%;
    }

    .public-kpi-grid,
    .public-feature-grid,
    .public-schedule-grid {
        grid-template-columns: 1fr;
    }

    .public-slider {
        min-height: 320px;
    }

    .public-map-wrap,
    .public-map {
        min-height: 380px;
    }

    .public-body .section-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .footer-brand-panel {
        align-items: flex-start;
        flex-direction: column;
    }

    .footer-brand-panel img {
        width: 78px;
        height: 78px;
    }

    .footer-bottom-bar {
        flex-direction: column;
    }
}

/* Public Portal Polish v2 */
.public-body {
    background:
        radial-gradient(circle at top left, rgba(8, 132, 121, 0.14), transparent 28%),
        radial-gradient(circle at top right, rgba(244, 175, 67, 0.12), transparent 22%),
        linear-gradient(180deg, #eef6f4 0%, #f7fbfa 38%, #edf6f5 100%);
}

.public-header {
    position: sticky;
    top: 0;
    z-index: 90;
    padding: 14px 0 10px;
    background: linear-gradient(180deg, rgba(239, 246, 244, 0.98) 0%, rgba(239, 246, 244, 0.94) 100%);
    border: 0;
    box-shadow: none;
    backdrop-filter: none;
    transition: padding 0.22s ease;
}

.public-header-shell {
    grid-template-columns: minmax(300px, 420px) minmax(0, 1fr);
    grid-template-areas:
        "brand actions"
        "nav nav";
    align-items: start;
    gap: 16px 24px;
    padding: 18px 22px;
    border-radius: 30px;
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid #d7e9e5;
    box-shadow: 0 18px 40px rgba(20, 81, 75, 0.1);
    transition: padding 0.22s ease, border-radius 0.22s ease, box-shadow 0.22s ease, gap 0.22s ease;
}

.public-brand {
    grid-area: brand;
    min-height: 116px;
    gap: 15px;
    padding: 16px 18px;
    border-radius: 28px;
    background:
        radial-gradient(circle at 88% 22%, rgba(255, 255, 255, 0.22), transparent 13%),
        linear-gradient(135deg, #109a8e 0%, #139d8c 54%, #0b786f 100%);
    box-shadow: 0 16px 34px rgba(9, 114, 102, 0.22);
    transition: min-height 0.22s ease, padding 0.22s ease, border-radius 0.22s ease, gap 0.22s ease, box-shadow 0.22s ease;
}

.public-brand::after {
    background:
        radial-gradient(circle at 86% 20%, rgba(255, 255, 255, 0.18) 0, rgba(255, 255, 255, 0.04) 11%, transparent 12%),
        radial-gradient(circle at 90% 36%, rgba(255, 255, 255, 0.14) 0, rgba(255, 255, 255, 0.03) 9%, transparent 10%),
        radial-gradient(circle at 82% 50%, rgba(255, 255, 255, 0.1) 0, rgba(255, 255, 255, 0.03) 8%, transparent 9%);
}

.public-brand img {
    width: 78px;
    height: 78px;
    padding: 8px;
    border-radius: 22px;
    transition: width 0.22s ease, height 0.22s ease, border-radius 0.22s ease;
}

.public-brand h1 {
    max-width: 260px;
    margin: 7px 0 3px;
    font-size: clamp(1.32rem, 1.75vw, 1.82rem);
    letter-spacing: 0;
    transition: font-size 0.22s ease;
}

.public-brand p {
    font-size: 0.98rem;
}

.public-nav {
    grid-area: nav;
    justify-content: flex-start;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: none;
}

.public-nav::-webkit-scrollbar {
    display: none;
}

.public-nav-link {
    min-height: 46px;
    padding: 0 20px;
    white-space: nowrap;
    transition: min-height 0.22s ease, padding 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease, background 0.22s ease;
}

.public-header-actions {
    grid-area: actions;
    justify-content: flex-end;
    align-self: center;
}

.public-header.is-condensed {
    padding: 8px 0 6px;
}

.public-header.is-condensed .public-header-shell {
    gap: 12px 18px;
    padding: 12px 16px;
    border-radius: 24px;
    box-shadow: 0 14px 28px rgba(20, 81, 75, 0.1);
}

.public-header.is-condensed .public-brand {
    min-height: 88px;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 22px;
    box-shadow: 0 12px 24px rgba(9, 114, 102, 0.18);
}

.public-header.is-condensed .public-brand img {
    width: 58px;
    height: 58px;
    border-radius: 16px;
}

.public-header.is-condensed .public-brand h1 {
    font-size: 1.4rem;
}

.public-header.is-condensed .public-brand p {
    font-size: 0.92rem;
}

.public-header.is-condensed .public-nav-link {
    min-height: 40px;
    padding: 0 16px;
}

.public-header.is-condensed .public-body .btn-primary,
.public-header.is-condensed .public-body .btn-soft,
.public-header.is-condensed .btn-primary,
.public-header.is-condensed .btn-soft {
    min-height: 44px;
    padding: 0 18px;
    border-radius: 14px;
}

.public-main {
    gap: 22px;
    padding: 14px 0 36px;
}

.public-hero,
.public-schedule-section,
.public-map-section,
.public-footer.premium {
    border-radius: 30px;
}

.public-hero-grid {
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
    gap: 24px;
    padding: 34px;
}

.public-chip {
    padding: 8px 14px;
    font-size: 0.84rem;
}

.public-hero-copy h2 {
    max-width: 620px;
    margin: 16px 0 14px;
    font-size: clamp(2.05rem, 3.65vw, 3.5rem);
    line-height: 0.98;
    letter-spacing: -0.03em;
}

.public-hero-lead {
    font-size: clamp(1.08rem, 1.5vw, 1.32rem);
}

.public-hero-subtext {
    max-width: 610px;
    font-size: 1rem;
    line-height: 1.78;
}

.public-hero-actions {
    margin-top: 24px;
}

.public-trust-row span {
    padding: 11px 14px;
    border-radius: 15px;
    font-size: 0.95rem;
}

.public-slider-card {
    padding: 16px;
    border-radius: 28px;
}

.public-slider {
    min-height: 360px;
    background: linear-gradient(135deg, #deefed 0%, #bddfd9 100%);
}

.public-slide {
    display: grid;
    place-items: center;
    padding: 14px;
    background:
        radial-gradient(circle at bottom left, rgba(255, 255, 255, 0.18), transparent 26%),
        linear-gradient(135deg, rgba(12, 145, 131, 0.1) 0%, rgba(255, 255, 255, 0.06) 100%);
}

.public-slide img {
    width: 100%;
    height: 100%;
    border-radius: 20px;
    object-fit: contain;
    background: rgba(255, 255, 255, 0.24);
}

.slide-btn {
    width: 42px;
    height: 42px;
    background: rgba(255, 255, 255, 0.94);
}

.public-slider-caption {
    padding: 14px 4px 2px;
}

.public-kpi-grid {
    gap: 16px;
}

.public-kpi-card {
    padding: 20px 18px;
    border-radius: 22px;
}

.public-feature-grid {
    gap: 16px;
}

.public-feature-card {
    padding: 24px 22px;
    border-radius: 24px;
}

.public-schedule-section,
.public-map-section {
    padding: 28px;
}

.public-body .section-head {
    margin-bottom: 18px;
}

.public-schedule-grid {
    gap: 14px;
}

.public-schedule-card {
    padding: 20px 18px;
    border-radius: 22px;
}

.public-map-section {
    overflow: clip;
    isolation: isolate;
}

.public-map-grid {
    grid-template-columns: minmax(0, 1.36fr) minmax(300px, 0.72fr);
    align-items: stretch;
}

.public-map-wrap {
    min-height: 520px;
    border-radius: 28px;
    isolation: isolate;
    background: #deecea;
}

.public-map {
    height: 100%;
    min-height: 520px;
}

.public-map-wrap .leaflet-container {
    width: 100%;
    height: 100%;
    background: #deecea;
    border-radius: inherit;
}

.public-map-wrap .leaflet-top,
.public-map-wrap .leaflet-bottom {
    z-index: 12;
}

.public-map-wrap .leaflet-pane {
    z-index: 1;
}

.map-legend {
    left: 16px;
    bottom: 16px;
    border-radius: 16px;
}

.public-map-aside {
    gap: 14px;
}

.public-map-aside-card {
    padding: 20px;
    border-radius: 22px;
}

.public-map-aside-card.accent .btn-primary {
    min-height: 48px;
}

.public-footer.premium {
    margin-top: 8px;
    margin-bottom: 34px;
    padding: 28px 30px;
    background:
        radial-gradient(circle at top right, rgba(255, 255, 255, 0.12), transparent 26%),
        linear-gradient(135deg, #0f8b7f 0%, #0a6f67 100%);
}

.public-footer-top {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px 24px;
    padding-bottom: 22px;
    margin-bottom: 22px;
}

.footer-brand-panel {
    gap: 16px;
}

.footer-brand-panel img {
    width: 82px;
    height: 82px;
    padding: 8px;
}

.footer-brand-panel h4 {
    margin: 8px 0 6px;
    font-size: 1.36rem;
}

.footer-grid-panel {
    gap: 16px;
}

.footer-col {
    padding: 18px 20px;
    border-radius: 22px;
}

.footer-bottom-bar {
    margin-top: 22px;
    padding-top: 18px;
}

@media (max-width: 1180px) {
    .public-header-shell {
        grid-template-columns: 1fr;
        grid-template-areas:
            "brand"
            "nav"
            "actions";
    }

    .public-header-actions {
        justify-content: flex-start;
    }

    .public-hero-grid,
    .public-map-grid,
    .public-footer-top,
    .footer-grid-panel {
        grid-template-columns: 1fr;
    }

    .public-kpi-grid,
    .public-schedule-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .public-feature-grid {
        grid-template-columns: 1fr;
    }

    .public-footer-cta {
        justify-items: start;
    }
}

@media (max-width: 760px) {
    .public-header {
        padding: 10px 0 8px;
    }

    .public-header-shell,
    .public-main,
    .public-footer.premium {
        width: min(1240px, calc(100% - 18px));
    }

    .public-header-shell {
        padding: 14px;
        border-radius: 24px;
    }

    .public-brand {
        min-height: auto;
        padding: 14px;
        gap: 12px;
        border-radius: 22px;
    }

    .public-brand img {
        width: 64px;
        height: 64px;
        border-radius: 18px;
    }

    .public-brand h1 {
        max-width: none;
        font-size: 1.34rem;
    }

    .public-nav-link,
    .public-body .btn-primary,
    .public-body .btn-soft {
        min-height: 44px;
    }

    .public-hero-grid,
    .public-schedule-section,
    .public-map-section,
    .public-footer.premium {
        padding: 22px;
    }

    .public-hero-copy h2 {
        font-size: 2.15rem;
    }

    .public-slider {
        min-height: 300px;
    }

    .public-slide {
        padding: 10px;
    }

    .public-kpi-grid,
    .public-feature-grid,
    .public-schedule-grid {
        grid-template-columns: 1fr;
    }

    .public-map-wrap,
    .public-map {
        min-height: 380px;
    }

    .map-legend {
        left: 12px;
        bottom: 12px;
        padding: 12px 14px;
    }

    .footer-brand-panel {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Internal Dashboard Premium v2 */
.topbar {
    display: grid;
    grid-template-columns: minmax(260px, 320px) minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    width: min(1400px, calc(100% - 22px));
    margin: 10px auto 0;
    padding: 10px 14px;
    border-radius: 24px;
    border: 1px solid #cfe1df;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.97) 0%, rgba(246, 251, 250, 0.98) 100%);
    box-shadow: 0 16px 36px rgba(13, 79, 76, 0.08);
}

.topbar-brand {
    min-width: 0;
}

.brand-badge {
    min-height: 74px;
    padding: 10px 14px;
    border-radius: 20px;
    background:
        radial-gradient(circle at 88% 22%, rgba(255, 255, 255, 0.16), transparent 18%),
        linear-gradient(135deg, #119a8f 0%, #0f8d80 52%, #0b776d 100%);
    box-shadow: 0 18px 30px rgba(10, 106, 99, 0.2);
}

.brand-badge::before {
    opacity: 0.7;
}

.brand-logo-image {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    padding: 5px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.16);
}

.brand-copy h1,
.brand-badge h1 {
    margin: 0;
    font-size: 1.28rem;
    letter-spacing: 0.02em;
}

.brand-copy p,
.brand-badge p {
    margin-top: 4px;
    font-size: 0.83rem;
    opacity: 0.92;
}

.topbar-center {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    min-width: 0;
    overflow: visible;
}

.topbar-context-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid #d7e6e4;
    background: rgba(255, 255, 255, 0.88);
    color: #42636a;
    font-size: 0.88rem;
    font-weight: 600;
    box-shadow: 0 10px 20px rgba(16, 81, 77, 0.05);
}

.topbar-context-chip i {
    color: #0f8378;
}

.topbar-context-chip.primary {
    color: #0c6f66;
    border-color: rgba(15, 142, 129, 0.22);
    background: linear-gradient(180deg, #ffffff 0%, #ebf8f6 100%);
}

.topbar-actions {
    gap: 10px;
    align-items: center;
}

.topbar-clock {
    min-width: 170px;
    padding: 10px 12px;
    border-radius: 14px;
    border: 1px solid #d6e5e3;
    background: linear-gradient(180deg, #ffffff 0%, #f3faf9 100%);
    color: #49656b;
    font-size: 0.85rem;
    font-weight: 700;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.ghost-btn {
    min-height: 42px;
    padding: 0 14px;
    border-radius: 14px;
    border-color: #d7e6e4;
    color: #436067;
    font-size: 0.86rem;
    font-weight: 600;
    box-shadow: 0 10px 20px rgba(12, 79, 74, 0.04);
}

.ghost-btn:hover {
    border-color: #9dd3cc;
    background: #f0fbf8;
    color: #0e756b;
}

.notif-dot {
    width: 40px;
    height: 40px;
    border-radius: 14px;
    background: linear-gradient(180deg, #ffffff 0%, #f4fbfb 100%);
    border: 1px solid #d6e5e3;
    box-shadow: 0 10px 20px rgba(12, 79, 74, 0.05);
}

.notif-dot b {
    top: -5px;
    right: -4px;
    width: 18px;
    height: 18px;
    line-height: 18px;
}

.user-chip {
    gap: 10px;
    padding: 6px 11px 6px 6px;
    border-radius: 16px;
    border: 1px solid #d5e5e2;
    background: linear-gradient(180deg, #ffffff 0%, #f5fbfa 100%);
    box-shadow: 0 12px 22px rgba(12, 79, 74, 0.05);
}

.user-avatar,
.user-photo {
    width: 34px;
    height: 34px;
    border-radius: 11px;
}

.user-meta strong {
    font-size: 0.92rem;
}

.user-meta small {
    color: #728e93;
    font-size: 0.73rem;
}

.logout-btn {
    min-height: 42px;
    padding: 0 16px;
    border-radius: 14px;
    font-size: 0.88rem;
    font-weight: 700;
    box-shadow: 0 14px 24px rgba(12, 104, 96, 0.18);
}

.layout-with-sidebar {
    width: min(1400px, calc(100% - 22px));
    grid-template-columns: 234px 1fr;
    gap: 18px;
    margin: 16px auto 28px;
}

.sidebar {
    top: 106px;
    min-height: calc(100vh - 144px);
    border-radius: 24px;
    border: 1px solid rgba(17, 122, 117, 0.45);
    background:
        radial-gradient(circle at top right, rgba(255, 255, 255, 0.12), transparent 24%),
        linear-gradient(180deg, #128b80 0%, #0e7269 100%);
    box-shadow: 0 18px 34px rgba(12, 76, 73, 0.18);
}

.sidebar-top {
    padding: 20px 14px 14px;
}

.sidebar-title {
    margin: 0 10px 12px;
    font-size: 0.74rem;
    letter-spacing: 0.16em;
    color: rgba(232, 248, 244, 0.78);
}

.sidebar-link {
    position: relative;
    gap: 12px;
    min-height: 46px;
    margin-bottom: 6px;
    padding: 11px 13px;
    border-radius: 14px;
    font-size: 0.96rem;
    font-weight: 600;
    transition: transform 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}

.sidebar-link i {
    width: 18px;
    text-align: center;
    opacity: 0.96;
}

.sidebar-link.active,
.sidebar-link:hover {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0.12) 100%);
    transform: translateX(2px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.sidebar-link.active::before {
    content: "";
    position: absolute;
    left: -4px;
    top: 10px;
    bottom: 10px;
    width: 4px;
    border-radius: 999px;
    background: #ffffff;
}

.sidebar-accordion {
    margin-bottom: 8px;
}

.sidebar-accordion-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    background: transparent;
    border: none;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.sidebar-accordion-main {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.sidebar-accordion-caret {
    margin-left: 12px;
    transition: transform 0.18s ease;
    opacity: 0.88;
}

.sidebar-accordion.is-open .sidebar-accordion-caret {
    transform: rotate(180deg);
}

.sidebar-submenu {
    overflow: hidden;
    max-height: 0;
    margin: 0 0 6px 6px;
    padding-left: 10px;
    border-left: 1px solid rgba(255, 255, 255, 0.18);
    display: grid;
    gap: 4px;
    transition: max-height 0.22s ease, opacity 0.18s ease;
    opacity: 0;
}

.sidebar-accordion.is-open .sidebar-submenu {
    opacity: 1;
}

.sidebar-sublink {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 40px;
    padding: 9px 12px;
    margin: 2px 6px;
    border-radius: 12px;
    font-size: 0.9rem;
    font-weight: 600;
    color: #e9f9f6;
    transition: transform 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}

.sidebar-sublink.active,
.sidebar-sublink:hover {
    background: rgba(255, 255, 255, 0.12);
    transform: translateX(2px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.sidebar-sublink.active::before {
    content: "";
    position: absolute;
    left: -9px;
    top: 8px;
    bottom: 8px;
    width: 3px;
    border-radius: 999px;
    background: #ffffff;
}

.sidebar-weather {
    margin: 0 14px 16px;
    padding: 13px 14px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.12);
    font-size: 0.9rem;
}

.content-area {
    display: grid;
    gap: 18px;
    align-content: start;
}

.dashboard-hero-panel {
    display: grid;
    grid-template-columns: minmax(0, 1.18fr) minmax(280px, 0.82fr);
    gap: 14px;
    padding: 18px 20px;
    border-radius: 20px;
    border: 1px solid #d9e6e3;
    background:
        radial-gradient(circle at top right, rgba(18, 150, 140, 0.16), transparent 24%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(245, 251, 250, 0.98) 100%);
    box-shadow: 0 14px 26px rgba(16, 76, 73, 0.07);
}

.dashboard-kicker {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    background: #edf8f7;
    border: 1px solid #d4e8e5;
    color: #0d766b;
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.dashboard-hero-copy h2 {
    margin: 10px 0 8px;
    color: #16373d;
    font-size: clamp(1.55rem, 2.4vw, 2.2rem);
    line-height: 1.08;
}

.dashboard-hero-copy p {
    max-width: 720px;
    margin: 0;
    color: #5f7a80;
    line-height: 1.65;
    font-size: 0.95rem;
}

.dashboard-hero-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.dashboard-hero-tags span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    border-radius: 12px;
    background: rgba(242, 250, 249, 0.94);
    border: 1px solid #d6e7e4;
    color: #4e6f75;
    font-weight: 600;
}

.dashboard-hero-tags i {
    color: #0d8378;
}

.dashboard-hero-side {
    display: grid;
    gap: 14px;
}

.hero-insight-card {
    display: grid;
    gap: 6px;
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px solid #dce8e5;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(246, 251, 250, 0.98) 100%);
    box-shadow: 0 12px 22px rgba(16, 76, 73, 0.06);
}

.hero-insight-card small {
    color: #658187;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.hero-insight-card strong {
    color: #14373d;
    font-size: 1.32rem;
    line-height: 1.05;
}

.hero-insight-card span {
    color: #5d7a80;
    line-height: 1.55;
}

.hero-insight-card.accent {
    background: linear-gradient(135deg, #12968a 0%, #0d7f74 100%);
    border-color: rgba(8, 111, 102, 0.28);
    box-shadow: 0 22px 34px rgba(10, 106, 99, 0.2);
}

.hero-insight-card.accent small,
.hero-insight-card.accent strong,
.hero-insight-card.accent span {
    color: #ffffff;
}

.stats-grid.dashboard-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

.stats-card {
    gap: 14px;
    padding: 18px;
    border-radius: 22px;
    border: 1px solid #d6e5e3;
    background: linear-gradient(180deg, #ffffff 0%, #f7fbfb 100%);
    box-shadow: 0 16px 30px rgba(16, 76, 73, 0.06);
}

.stats-card i {
    width: 54px;
    height: 54px;
    border-radius: 18px;
}

.stats-card.info i {
    color: #0d7e93;
    background: #e6f6fb;
}

.stats-card p {
    margin: 0;
    color: #6c878d;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.stats-card h3 {
    margin: 6px 0 4px;
    color: #14373d;
    font-size: clamp(1.55rem, 2vw, 2rem);
    line-height: 1.02;
}

.stats-card small {
    display: block;
    color: #668086;
    line-height: 1.5;
}

.dashboard-analytics-grid {
    gap: 16px;
}

.dashboard-card {
    border-radius: 16px;
    border: 1px solid #d6e5e3;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(247, 251, 251, 0.98) 100%);
    box-shadow: 0 12px 26px rgba(16, 76, 73, 0.06);
    padding: 16px 18px;
}

.dashboard-card .card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.dashboard-card h2 {
    margin: 0;
    color: #14373d;
    font-size: 1.05rem;
}

.dashboard-card .card-head p {
    margin: 4px 0 0;
    max-width: 520px;
    color: #678186;
    font-size: 0.9rem;
    line-height: 1.55;
}

.card-badge {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 10px;
    border-radius: 999px;
    border: 1px solid #d6e5e3;
    background: #f3fbf9;
    color: #0e776c;
    font-size: 0.78rem;
    font-weight: 700;
    white-space: nowrap;
}

.card-badge.warning {
    background: #fff4e0;
    border-color: #f2d58e;
    color: #aa6f04;
}

.card-badge.success {
    background: #e8faf2;
    border-color: #b9e4cc;
    color: #1a8a61;
}

.chart-wrap {
    position: relative;
    min-height: 260px;
}

.dashboard-analytics-grid .table-card {
    min-height: 360px;
}

.dashboard-analytics-grid canvas {
    height: 260px !important;
}

.risk-chip-wrap {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.risk-chip {
    border-radius: 999px;
    background: #f8fbfb;
    color: #5c777c;
    font-weight: 600;
}

.dashboard-map {
    height: 360px;
    border-radius: 18px;
    border: 1px solid #d6e5e3;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
    position: relative;
    overflow: hidden;
}

.map-empty-state {
    position: absolute;
    inset: 18px;
    display: grid;
    place-items: center;
    border-radius: 16px;
    border: 1px dashed #cfe0de;
    background: rgba(255, 255, 255, 0.9);
    color: #5e7a80;
    font-weight: 600;
    z-index: 500;
}

.priority-card .card-head {
    margin-bottom: 18px;
}

.priority-list {
    gap: 12px;
}

.priority-item {
    display: grid;
    grid-template-columns: 46px 1fr;
    gap: 14px;
    align-items: start;
    padding: 14px;
    border-radius: 18px;
    border: 1px solid #d6e5e3;
    background: linear-gradient(180deg, #ffffff 0%, #f7fbfb 100%);
}

.priority-rank {
    display: inline-grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 16px;
    background: linear-gradient(135deg, #e5f6f3 0%, #d7eeea 100%);
    color: #0f7d73;
    font-size: 0.94rem;
    font-weight: 800;
}

.priority-item-body {
    display: grid;
    gap: 10px;
}

.priority-item-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
}

.priority-item strong {
    color: #15373d;
    font-size: 1rem;
}

.priority-total {
    color: #708b90;
    font-size: 0.85rem;
    font-weight: 700;
}

.priority-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.priority-badge {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 10px;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 700;
}

.priority-badge.danger {
    background: #fde8e6;
    color: #bd5148;
}

.priority-badge.warning {
    background: #fff3dc;
    color: #b07a14;
}

.app-copyright {
    width: min(1400px, calc(100% - 22px));
    margin-bottom: 24px;
    color: #668085;
    font-size: 0.88rem;
}

@media (max-width: 1280px) {
    .topbar {
        grid-template-columns: 1fr;
    }

    .topbar-center,
    .topbar-actions {
        justify-content: flex-start;
    }

    .layout-with-sidebar {
        grid-template-columns: 220px 1fr;
    }

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

@media (max-width: 1080px) {
    .dashboard-hero-panel,
    .dashboard-analytics-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-card .card-head,
    .priority-item-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .risk-chip-wrap {
        justify-content: flex-start;
    }

    .layout-with-sidebar {
        grid-template-columns: 1fr;
    }

    .sidebar {
        position: static;
        min-height: auto;
    }
}

@media (max-width: 720px) {
    .topbar {
        width: min(1400px, calc(100% - 16px));
        padding: 10px;
        border-radius: 18px;
    }

    .brand-badge {
        min-height: 64px;
        padding: 9px 11px;
    }

    .brand-copy h1,
    .brand-badge h1 {
        font-size: 1.02rem;
    }

    .brand-copy p,
    .brand-badge p {
        display: none;
    }

    .topbar-context {
        display: none;
    }

    .topbar-actions {
        flex-wrap: wrap;
    }

    .topbar-clock {
        width: 100%;
        min-width: 0;
    }

    .layout-with-sidebar {
        width: min(1400px, calc(100% - 16px));
        gap: 14px;
    }

    .dashboard-hero-panel,
    .dashboard-card {
        padding: 18px;
        border-radius: 20px;
    }

    .stats-grid.dashboard-stats {
        grid-template-columns: 1fr;
    }

    .dashboard-map {
        height: 320px;
    }
}

/* Internal Header Refinement v3 */
.topbar {
    grid-template-columns: minmax(260px, 320px) minmax(0, 1fr) auto;
    gap: 16px;
    padding: 10px 12px;
    border-radius: 22px;
}

.topbar-heading {
    min-width: 0;
    display: grid;
    align-content: center;
    gap: 8px;
}

.topbar-heading-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: fit-content;
    min-height: 32px;
    padding: 0 12px;
    border-radius: 999px;
    background: #edf8f7;
    border: 1px solid #d5e7e4;
    color: #0e776c;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.topbar-heading-copy h2 {
    margin: 0;
    color: #17363c;
    font-size: 1.22rem;
    line-height: 1.05;
}

.topbar-heading-copy p {
    margin: 4px 0 0;
    color: #6a868b;
    font-size: 0.9rem;
    line-height: 1.55;
}

.topbar-actions {
    display: grid;
    grid-template-columns: auto auto;
    align-items: center;
    gap: 10px 12px;
}

.topbar-tools,
.topbar-profile {
    display: flex;
    align-items: center;
    gap: 10px;
}

.topbar-tools {
    justify-content: flex-end;
}

.topbar-profile {
    justify-content: flex-end;
}

.topbar-clock {
    min-width: 164px;
}

.brand-badge {
    min-height: 70px;
}

@media (max-width: 1320px) {
    .topbar {
        grid-template-columns: minmax(250px, 310px) minmax(0, 1fr);
        grid-template-areas:
            "brand actions"
            "heading heading";
    }

    .topbar-brand {
        grid-area: brand;
    }

    .topbar-heading {
        grid-area: heading;
    }

    .topbar-actions {
        grid-area: actions;
        grid-template-columns: 1fr;
        justify-items: end;
    }

    .topbar-tools,
    .topbar-profile {
        justify-content: flex-end;
    }
}

@media (max-width: 920px) {
    .topbar {
        grid-template-columns: 1fr;
        grid-template-areas:
            "brand"
            "heading"
            "actions";
    }

    .topbar-actions {
        justify-items: start;
        width: 100%;
    }

    .topbar-tools,
    .topbar-profile {
        flex-wrap: wrap;
        justify-content: flex-start;
        width: 100%;
    }
}

@media (max-width: 720px) {
    .topbar-heading-copy p {
        display: none;
    }

    .topbar-tools,
    .topbar-profile {
        gap: 8px;
    }

    .topbar-clock {
        width: 100%;
        min-width: 0;
    }
}

/* 2026-03-11 professional admin/public refinement */
.settings-status-grid,
.question-summary-grid,
.history-summary-grid,
.approvals-summary-grid,
.wa-summary-grid {
    margin-top: 18px;
}

.public-settings-form,
.professional-question-admin {
    gap: 22px;
}

.settings-section {
    border: 1px solid #d6e6e4;
    border-radius: 22px;
    background: linear-gradient(180deg, #ffffff 0%, #f7fbfb 100%);
    padding: 22px;
}

.settings-section-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    margin-bottom: 18px;
}

.settings-section-head h3 {
    margin: 0 0 6px;
    font-size: 1.16rem;
    color: #10363b;
}

.settings-section-head p {
    margin: 0;
    color: #628086;
    max-width: 760px;
}

.settings-media-grid,
.settings-slider-grid,
.settings-copy-grid {
    display: grid;
    gap: 18px;
}

.settings-media-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 18px;
}

.settings-slider-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

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

.settings-slide-card,
.settings-preview,
.settings-copy-field,
.question-editor-card,
.history-record-card,
.approval-card {
    border: 1px solid #d4e5e3;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 28px rgba(17, 64, 61, 0.06);
}

.settings-slide-card,
.settings-preview,
.settings-copy-field {
    padding: 18px;
}

.settings-slide-card h4,
.settings-preview h4,
.settings-copy-field label {
    margin-top: 0;
}

.settings-copy-field label {
    display: block;
    margin-bottom: 8px;
    font-weight: 700;
    color: #17383d;
}

.settings-copy-field textarea,
.settings-copy-field input {
    width: 100%;
}

.settings-form-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    position: sticky;
    bottom: 12px;
    padding: 14px 18px;
    border: 1px solid rgba(15, 118, 110, 0.14);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(16px);
    box-shadow: 0 18px 30px rgba(14, 73, 68, 0.1);
}

.settings-workspace-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    padding: 18px 20px;
    border: 1px solid #d6e6e4;
    border-radius: 20px;
    background: linear-gradient(180deg, #ffffff 0%, #f6fbfb 100%);
    box-shadow: 0 12px 30px rgba(17, 64, 61, 0.07);
}

.settings-workspace-status {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.settings-workspace-status strong {
    display: block;
    color: #12363a;
    font-size: 1rem;
}

.settings-workspace-status p {
    margin: 4px 0 0;
    color: #648085;
    line-height: 1.6;
}

.settings-workspace-indicator {
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
    margin-top: 4px;
    border-radius: 999px;
    background: #90a8a6;
    box-shadow: 0 0 0 6px rgba(144, 168, 166, 0.16);
}

.settings-workspace-status[data-settings-dirty-state="dirty"] .settings-workspace-indicator {
    background: #e39a2b;
    box-shadow: 0 0 0 6px rgba(227, 154, 43, 0.18);
}

.settings-workspace-actions,
.settings-section-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.settings-brand-card,
.settings-slide-card {
    display: grid;
    gap: 16px;
}

.settings-preview-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
}

.settings-preview-head h4 {
    margin: 0 0 4px;
    color: #15383d;
}

.settings-preview-head p {
    margin: 0;
    color: #6b8588;
    line-height: 1.55;
}

.settings-inline-badge {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 12px;
    border-radius: 999px;
    background: #edf8f6;
    border: 1px solid #cfe6e2;
    color: #0f7a70;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.settings-brand-stage {
    padding: 14px;
    border-radius: 18px;
    background: linear-gradient(180deg, #f8fcfc 0%, #eef7f6 100%);
    border: 1px solid #d7e7e4;
}

.settings-brand-stage-shell {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    min-height: 120px;
    padding: 16px 18px;
    border-radius: 18px;
    background: linear-gradient(135deg, #143734 0%, #1a4c45 58%, #1f6157 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.settings-brand-stage-shell.is-sidebar {
    background: linear-gradient(180deg, #1d5d53 0%, #228072 100%);
}

.settings-brand-stage-logo {
    --logo-stage-scale: 1.6;
    display: grid;
    place-items: center;
    min-height: 84px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.1);
    overflow: hidden;
}

.settings-brand-stage-logo img {
    display: block;
    max-width: 90%;
    max-height: 90%;
    object-fit: contain;
    transform: scale(var(--logo-stage-scale));
    transform-origin: center center;
    filter: drop-shadow(0 8px 18px rgba(3, 27, 31, 0.14));
}

.settings-brand-stage-copy {
    display: grid;
    gap: 4px;
}

.settings-brand-stage-copy span {
    color: rgba(236, 227, 193, 0.82);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.settings-brand-stage-copy strong {
    color: #ffffff;
    font-size: 1.16rem;
}

.settings-brand-stage-copy small {
    color: rgba(237, 246, 242, 0.76);
    font-size: 0.85rem;
}

.settings-file-block {
    display: grid;
    grid-template-columns: minmax(160px, 220px) minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}

.logo-preview {
    width: 100%;
    max-width: none;
    min-height: 180px;
    max-height: 180px;
    object-fit: contain;
    padding: 16px;
}

.slide-preview {
    width: 100%;
    max-width: none;
    height: 190px;
    object-fit: cover;
    border-radius: 14px;
}

.settings-file-stack {
    display: grid;
    gap: 10px;
}

.settings-file-meta {
    display: grid;
    gap: 4px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px dashed #d4e5e3;
    background: #f8fcfc;
}

.settings-file-meta strong {
    color: #15383d;
    word-break: break-word;
}

.settings-file-meta small {
    color: #6b8588;
    line-height: 1.5;
}

.settings-inline-toggle {
    margin-top: -2px;
}

.settings-hero-card {
    margin-top: 22px;
}

.settings-hero-stage {
    display: grid;
    grid-template-columns: minmax(240px, 0.85fr) minmax(0, 1.15fr);
    gap: 18px;
    padding: 18px;
    border-radius: 20px;
    background: linear-gradient(180deg, #f9fcfb 0%, #eef8f4 100%);
    border: 1px solid #d7e7e4;
}

.settings-hero-stage-copy {
    display: grid;
    align-content: center;
    gap: 8px;
    padding: 6px 2px;
}

.settings-hero-stage-copy span {
    color: #0f7a70;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.settings-hero-stage-copy strong {
    color: #15383d;
    font-size: 1.28rem;
    line-height: 1.3;
}

.settings-hero-stage-copy small {
    color: #6b8588;
    font-size: 0.94rem;
    line-height: 1.7;
}

.settings-hero-stage-media {
    min-height: 260px;
    padding: 12px;
    border-radius: 20px;
    background: #ffffff;
    border: 1px solid #dce9e6;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.settings-hero-preview,
.settings-hero-preview-tile {
    height: 100%;
    min-height: 236px;
    border-radius: 18px;
    object-fit: cover;
}

.settings-hero-file-block .settings-file-meta strong {
    word-break: break-word;
}

.settings-logo-scale-field {
    margin-top: 0;
    padding-top: 14px;
}

.settings-scale-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}

.settings-scale-head strong {
    color: #116d65;
    font-size: 1rem;
}

.settings-scale-controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 96px;
    gap: 12px;
    align-items: center;
}

.settings-scale-controls input[type="range"] {
    width: 100%;
    accent-color: #108a7e;
}

.settings-scale-controls input[type="number"] {
    width: 100%;
    text-align: center;
}

.settings-form-actions-copy {
    display: grid;
    gap: 4px;
    margin-right: auto;
}

.settings-form-actions-copy strong {
    color: #14373c;
}

.settings-form-actions-copy span {
    color: #678285;
    line-height: 1.55;
}

.question-card-list,
.history-card-list,
.approval-card-list {
    display: grid;
    gap: 18px;
}

.question-editor-card,
.history-record-card,
.approval-card {
    padding: 20px;
}

.question-editor-head,
.history-record-top,
.approval-card {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-start;
}

.question-editor-index {
    width: 52px;
    height: 52px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: linear-gradient(180deg, #108a7e 0%, #0b6d65 100%);
    color: #fff;
    font-weight: 800;
    box-shadow: 0 12px 24px rgba(11, 109, 101, 0.18);
}

.question-editor-head h3,
.history-record-title h3,
.approval-card-title h3 {
    margin: 0 0 4px;
    color: #11333a;
}

.question-editor-head p,
.approval-card-reason {
    margin: 0;
    color: #628086;
}

.question-editor-flags,
.history-record-actions,
.approval-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-end;
}

.question-editor-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px 16px;
    margin-top: 18px;
}

.question-editor-grid .span-2 {
    grid-column: span 2;
}

.question-editor-grid .span-3 {
    grid-column: span 3;
}

.question-editor-grid .span-4 {
    grid-column: 1 / -1;
}

.question-editor-checks {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    padding-top: 16px;
    margin-top: 16px;
    border-top: 1px dashed #d4e3e1;
}

.sticky-form-actions {
    position: sticky;
    bottom: 10px;
    z-index: 5;
    padding: 14px 18px;
    border-radius: 18px;
    border: 1px solid rgba(15, 118, 110, 0.16);
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: blur(14px);
    box-shadow: 0 18px 32px rgba(16, 71, 66, 0.1);
}

.history-toolbar {
    margin-bottom: 18px;
}

.history-actions {
    align-items: center;
}

.history-record-name-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
}

.history-record-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
    color: #5f7b80;
    font-size: 0.94rem;
}

.history-record-meta span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.history-record-grid {
    display: grid;
    grid-template-columns: minmax(280px, 0.9fr) minmax(0, 1.35fr);
    gap: 20px;
    margin-top: 18px;
}

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

.history-summary-item,
.history-answer-item {
    border: 1px solid #deece9;
    border-radius: 16px;
    background: linear-gradient(180deg, #fbfdfd 0%, #f6fbfa 100%);
    padding: 14px 16px;
}

.history-summary-item span,
.history-answer-item span {
    display: block;
    margin-bottom: 6px;
    color: #67848a;
    font-size: 0.84rem;
    font-weight: 600;
}

.history-summary-item strong,
.history-answer-item strong {
    color: #15343a;
    font-size: 1rem;
    line-height: 1.55;
}

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

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

.admin-feed-list {
    display: grid;
    gap: 12px;
}

.admin-feed-item {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: flex-start;
    padding: 14px 16px;
    border: 1px solid #d8e8e6;
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbfb 100%);
}

.admin-feed-main strong {
    display: block;
    margin-bottom: 4px;
    color: #15353a;
}

.admin-feed-main p,
.admin-feed-empty {
    margin: 0;
    color: #658287;
}

.admin-feed-meta {
    display: grid;
    gap: 8px;
    justify-items: end;
    color: #58777d;
    font-size: 0.84rem;
}

.approval-card-list {
    margin-top: 10px;
}

.approval-card {
    align-items: center;
}

.approval-card-main {
    flex: 1 1 auto;
}

.approval-card-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.approval-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
    color: #638086;
    font-size: 0.92rem;
    margin-bottom: 10px;
}

.wa-template-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 18px;
}

.wa-template-chip {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 0 16px;
    border-radius: 999px;
    border: 1px solid #cfe2df;
    background: #fff;
    color: #16525a;
    font-weight: 600;
    text-decoration: none;
    transition: 0.2s ease;
}

.wa-template-chip:hover,
.wa-template-chip.active {
    background: linear-gradient(180deg, #0f9384 0%, #0a776d 100%);
    border-color: #0f9384;
    color: #fff;
    box-shadow: 0 14px 24px rgba(10, 119, 109, 0.18);
}

.app-modal {
    position: fixed;
    inset: 0;
    z-index: 120;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(8, 31, 35, 0.52);
    backdrop-filter: blur(8px);
}

.app-modal.is-open {
    display: flex;
}

.has-modal-open {
    overflow: hidden;
}

.app-modal-card {
    width: min(680px, 100%);
    max-height: calc(100vh - 40px);
    overflow: auto;
    border-radius: 24px;
    border: 1px solid rgba(212, 228, 225, 0.95);
    background: linear-gradient(180deg, #ffffff 0%, #f7fbfa 100%);
    box-shadow: 0 24px 60px rgba(11, 52, 49, 0.24);
    padding: 22px;
}

.app-modal-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    margin-bottom: 18px;
}

.app-modal-kicker {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(13, 143, 130, 0.1);
    color: #0d8277;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.app-modal-head h3 {
    margin: 0 0 6px;
    font-size: 1.3rem;
    color: #12343a;
}

.app-modal-head p {
    margin: 0;
    color: #658187;
}

.icon-btn {
    width: 42px;
    height: 42px;
    border: 1px solid #d7e7e4;
    border-radius: 14px;
    background: #fff;
    color: #234a50;
    cursor: pointer;
}

.approval-modal-actions {
    justify-content: flex-start;
}

@media (max-width: 1100px) {
    .dashboard-admin-grid,
    .settings-media-grid,
    .settings-slider-grid,
    .settings-copy-grid,
    .history-record-grid,
    .question-editor-grid {
        grid-template-columns: 1fr;
    }

    .question-editor-grid .span-2,
    .question-editor-grid .span-3,
    .question-editor-grid .span-4 {
        grid-column: auto;
    }

    .settings-file-block,
    .settings-brand-stage-shell,
    .settings-hero-stage {
        grid-template-columns: 1fr;
    }

    .settings-hero-stage-media,
    .settings-hero-preview,
    .settings-hero-preview-tile {
        min-height: 220px;
    }

    .settings-workspace-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .settings-workspace-actions,
    .settings-section-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 860px) {
    .question-editor-head,
    .history-record-top,
    .approval-card,
    .admin-feed-item,
    .settings-section-head {
        flex-direction: column;
    }

    .question-editor-flags,
    .history-record-actions,
    .approval-card-actions,
    .admin-feed-meta {
        justify-content: flex-start;
        justify-items: start;
    }

    .history-record-summary,
    .history-answer-grid {
        grid-template-columns: 1fr;
    }

    .settings-form-actions,
    .sticky-form-actions {
        position: static;
    }

    .settings-scale-controls {
        grid-template-columns: 1fr;
    }

    .settings-form-actions {
        align-items: stretch;
    }

    .settings-form-actions > *,
    .settings-workspace-actions > * {
        width: 100%;
        justify-content: center;
    }
}

/* 2026-03-11 unified header/footer refinement */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.topbar {
    width: min(1400px, calc(100% - 22px));
    margin: 6px auto 0;
    grid-template-columns: minmax(240px, 310px) minmax(0, 1fr) auto;
    gap: 18px;
    padding: 12px 14px;
    border-radius: 26px;
}

.topbar-brand {
    flex: 0 0 auto;
    min-width: 0;
}

.brand-badge.brand-badge-logo-only {
    justify-content: center;
    min-height: 92px;
    padding: 14px 18px;
    border-radius: 28px;
}

.brand-badge.brand-badge-logo-only::before {
    opacity: 0.26;
}

.brand-badge.brand-badge-logo-only .brand-logo-image {
    width: min(100%, 232px);
    height: 76px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    object-fit: contain;
    filter: drop-shadow(0 8px 16px rgba(1, 52, 49, 0.18));
}

.topbar-heading {
    padding-inline: 6px;
}

.public-header {
    position: sticky;
    top: 0;
    z-index: 45;
    padding-top: 10px;
    background: linear-gradient(180deg, rgba(241, 248, 246, 0.96), rgba(241, 248, 246, 0.72) 75%, transparent 100%);
    backdrop-filter: blur(10px);
}

.public-header-shell {
    width: min(1400px, calc(100% - 22px));
}

.public-brand {
    justify-content: center;
    align-items: center;
    max-width: 320px;
    min-height: 96px;
    padding: 14px 18px;
}

.public-brand img {
    width: min(100%, 248px);
    height: 78px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    object-fit: contain;
    filter: drop-shadow(0 8px 18px rgba(1, 52, 49, 0.18));
}

.public-brand > div,
.brand-copy {
    display: none;
}

.auth-page-header {
    background: transparent;
    backdrop-filter: none;
}

.auth-header-shell {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 22px;
    border-radius: 30px;
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid #d7e9e5;
    box-shadow: 0 18px 40px rgba(20, 81, 75, 0.1);
}

.auth-header-actions {
    margin-left: auto;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.login-body {
    display: block;
    padding: 0 16px 24px;
}

.login-shell {
    margin: 16px auto 0;
}

.site-footer {
    width: min(1400px, calc(100% - 22px));
    margin: 20px auto 28px;
    border-radius: 30px;
    background:
        radial-gradient(circle at 15% 18%, rgba(255, 255, 255, 0.14), transparent 24%),
        linear-gradient(135deg, #0d8f82 0%, #118579 56%, #0b6c63 100%);
    color: #eefaf7;
    box-shadow: 0 24px 50px rgba(10, 84, 78, 0.2);
}

.site-footer-shell {
    padding: 22px 24px 18px;
    display: grid;
    gap: 16px;
}

.site-footer-main {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(214, 240, 235, 0.18);
}

.site-footer-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 176px;
    min-height: 88px;
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.site-footer-brand img {
    width: min(100%, 146px);
    height: 68px;
    object-fit: contain;
    filter: drop-shadow(0 8px 16px rgba(1, 52, 49, 0.2));
}

.site-footer-copy h4 {
    margin: 6px 0 6px;
    font-size: 1.34rem;
    color: #ffffff;
}

.site-footer-copy p {
    margin: 0;
    max-width: 620px;
    color: rgba(238, 250, 247, 0.84);
    line-height: 1.7;
}

.site-footer-kicker {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.site-footer-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.site-footer .btn-soft,
.site-footer .btn-primary {
    min-height: 46px;
    border-radius: 16px;
    box-shadow: none;
}

.site-footer .btn-soft {
    border-color: rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
}

.site-footer .btn-primary {
    background: #ffffff;
    color: #0d7369;
}

.site-footer-subrow {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.site-footer-detail {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 0 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.1);
    color: rgba(238, 250, 247, 0.9);
    font-size: 0.9rem;
}

.site-footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding-top: 12px;
    border-top: 1px solid rgba(214, 240, 235, 0.14);
}

.site-footer-links,
.site-footer-legal {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: center;
}

.site-footer-links a {
    color: rgba(255, 255, 255, 0.92);
    text-decoration: none;
    font-weight: 600;
}

.site-footer-legal {
    justify-content: flex-end;
    color: rgba(238, 250, 247, 0.78);
    font-size: 0.9rem;
}

.dashboard-admin-grid {
    align-items: start;
}

.dashboard-scroll-card {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: 430px;
}

.dashboard-scroll-card .admin-feed-list {
    flex: 1 1 auto;
    min-height: 0;
    max-height: 320px;
    overflow: auto;
    padding-right: 4px;
    scrollbar-width: thin;
}

.dashboard-scroll-card .admin-feed-list::-webkit-scrollbar {
    width: 8px;
}

.dashboard-scroll-card .admin-feed-list::-webkit-scrollbar-thumb {
    background: #c8ddda;
    border-radius: 999px;
}

.dashboard-scroll-card .form-actions {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid #dce9e6;
}

@media (max-width: 1320px) {
    .topbar {
        grid-template-columns: minmax(220px, 290px) minmax(0, 1fr);
        grid-template-areas:
            "brand actions"
            "heading heading";
    }

    .topbar-brand {
        grid-area: brand;
    }

    .topbar-heading {
        grid-area: heading;
    }

    .topbar-actions {
        grid-area: actions;
    }

    .site-footer-main {
        grid-template-columns: 1fr;
        align-items: flex-start;
    }

    .site-footer-actions {
        justify-content: flex-start;
    }

    .site-footer-bottom {
        flex-direction: column;
        align-items: flex-start;
    }

    .site-footer-legal {
        justify-content: flex-start;
    }
}

@media (max-width: 920px) {
    .topbar {
        grid-template-columns: 1fr;
        grid-template-areas:
            "brand"
            "heading"
            "actions";
    }

    .topbar-actions,
    .topbar-tools,
    .topbar-profile,
    .auth-header-shell,
    .auth-header-actions {
        width: 100%;
        justify-content: flex-start;
    }

    .brand-badge.brand-badge-logo-only,
    .public-brand {
        max-width: 100%;
    }

    .site-footer-detail {
        width: 100%;
        justify-content: flex-start;
    }
}

@media (max-width: 720px) {
    .topbar,
    .public-header-shell,
    .auth-header-shell,
    .site-footer {
        width: min(1400px, calc(100% - 16px));
    }

    .brand-badge.brand-badge-logo-only .brand-logo-image,
    .public-brand img {
        width: min(100%, 210px);
        height: 68px;
    }

    .site-footer-shell {
        padding: 18px;
    }

    .site-footer-links,
    .site-footer-legal {
        gap: 12px;
    }
}

/* 2026-03-11 header direction based on reference banner */
.topbar,
.public-header-shell,
.auth-header-shell {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(249, 252, 252, 0.96));
    border: 1px solid #d7e7e4;
    box-shadow: 0 18px 38px rgba(17, 77, 72, 0.1);
}

.brand-badge.brand-badge-logo-only,
.public-brand {
    position: relative;
    overflow: visible;
    max-width: 360px;
    min-height: 112px;
    padding: 14px 24px 14px 20px;
    border-radius: 26px 0 26px 26px;
    background:
        radial-gradient(circle at 72% 28%, rgba(255, 255, 255, 0.16), transparent 18%),
        radial-gradient(circle at 86% 50%, rgba(255, 255, 255, 0.14) 2px, transparent 3px),
        linear-gradient(135deg, #0f9c8c 0%, #118f82 56%, #0c6f67 100%);
    box-shadow: 0 18px 34px rgba(11, 107, 99, 0.24);
}

.brand-badge.brand-badge-logo-only::after,
.public-brand::after {
    content: "";
    position: absolute;
    inset: 0 -42px 0 auto;
    width: 84px;
    background:
        radial-gradient(circle at 40% 30%, rgba(255, 255, 255, 0.16), transparent 34%),
        linear-gradient(135deg, #149685 0%, #0f8075 100%);
    transform: skewX(-28deg);
    transform-origin: top;
    border-radius: 0 28px 28px 0;
    box-shadow: 12px 0 26px rgba(11, 107, 99, 0.14);
}

.brand-badge.brand-badge-logo-only::before,
.public-brand::before {
    content: "";
    position: absolute;
    right: 14px;
    top: 14px;
    width: 108px;
    height: 82px;
    background:
        radial-gradient(circle, rgba(255, 255, 255, 0.22) 2px, transparent 2.6px);
    background-size: 12px 12px;
    opacity: 0.34;
    z-index: 0;
}

.brand-badge.brand-badge-logo-only .brand-logo-image,
.public-brand img {
    position: relative;
    z-index: 1;
    width: min(100%, 268px);
    height: 88px;
    object-fit: contain;
    filter: drop-shadow(0 10px 18px rgba(1, 43, 40, 0.2));
}

.topbar-heading {
    align-self: center;
}

.topbar-heading-kicker {
    background: rgba(15, 143, 130, 0.08);
}

.topbar-heading-copy h2 {
    font-size: 1.28rem;
}

.topbar-heading-copy p {
    max-width: 560px;
}

.public-header {
    background: linear-gradient(180deg, rgba(240, 248, 246, 0.96), rgba(240, 248, 246, 0.74) 72%, transparent 100%);
}

.public-header-shell {
    padding: 14px 20px;
    border-radius: 26px;
    grid-template-columns: minmax(320px, 380px) minmax(0, 1fr);
    grid-template-areas:
        "brand actions"
        "brand nav";
    align-items: center;
}

.public-brand {
    grid-area: brand;
    max-width: 340px;
}

.public-nav {
    grid-area: nav;
    justify-content: flex-start;
    padding-left: 18px;
}

.public-header-actions {
    grid-area: actions;
    justify-content: flex-end;
}

.auth-header-shell {
    padding: 14px 20px;
    border-radius: 26px;
}

.auth-header-shell .public-brand {
    max-width: 340px;
}

@media (max-width: 1180px) {
    .public-header-shell {
        grid-template-columns: 1fr;
        grid-template-areas:
            "brand"
            "actions"
            "nav";
    }

    .public-nav,
    .public-header-actions {
        padding-left: 0;
        justify-content: flex-start;
    }
}

@media (max-width: 920px) {
    .brand-badge.brand-badge-logo-only,
    .public-brand {
        min-height: 96px;
        padding: 12px 18px 12px 16px;
        border-radius: 24px 0 24px 24px;
    }

    .brand-badge.brand-badge-logo-only::after,
    .public-brand::after {
        right: -28px;
        width: 62px;
    }

    .brand-badge.brand-badge-logo-only .brand-logo-image,
    .public-brand img {
        width: min(100%, 224px);
        height: 74px;
    }
}

@media (max-width: 640px) {
    .brand-badge.brand-badge-logo-only,
    .public-brand {
        max-width: 100%;
    }

    .brand-badge.brand-badge-logo-only::after,
    .public-brand::after {
        display: none;
    }

    .brand-badge.brand-badge-logo-only,
    .public-brand,
    .auth-header-shell,
    .public-header-shell {
        border-radius: 22px;
    }

    .brand-badge.brand-badge-logo-only .brand-logo-image,
    .public-brand img {
        width: min(100%, 200px);
        height: 66px;
    }
}

/* 2026-03-11 logo visibility boost */
.brand-badge.brand-badge-logo-only,
.public-brand {
    overflow: hidden;
}

.brand-badge.brand-badge-logo-only .brand-logo-image,
.public-brand img {
    display: block;
    width: min(100%, 360px);
    height: 112px;
    transform: scale(1.62);
    transform-origin: center center;
}

@media (max-width: 920px) {
    .brand-badge.brand-badge-logo-only .brand-logo-image,
    .public-brand img {
        width: min(100%, 310px);
        height: 98px;
        transform: scale(1.44);
    }
}

@media (max-width: 640px) {
    .brand-badge.brand-badge-logo-only .brand-logo-image,
    .public-brand img {
        width: min(100%, 260px);
        height: 82px;
        transform: scale(1.28);
    }
}

/* 2026-03-11 admin-controlled logo scaling */
.settings-logo-scale-field {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px dashed #d6e6e3;
}

.settings-logo-scale-field label {
    display: block;
    margin-bottom: 8px;
    font-weight: 700;
    color: #17383d;
}

.settings-logo-scale-field input {
    width: 100%;
}

.settings-logo-scale-field small {
    display: block;
    margin-top: 8px;
    color: #6a8489;
}

.brand-badge.brand-badge-logo-only .brand-logo-image,
.public-brand img {
    transform: scale(var(--header-logo-scale, 1.62));
    transform-origin: center center;
}

@media (max-width: 920px) {
    .brand-badge.brand-badge-logo-only .brand-logo-image,
    .public-brand img {
        transform: scale(calc(var(--header-logo-scale, 1.62) * 0.9));
    }
}

@media (max-width: 640px) {
    .brand-badge.brand-badge-logo-only .brand-logo-image,
    .public-brand img {
        transform: scale(calc(var(--header-logo-scale, 1.62) * 0.8));
    }
}

/* 2026-03-12 premium public chrome */
.public-header {
    position: sticky;
    top: 0;
    z-index: 60;
    padding: 18px 0 8px;
    background: linear-gradient(180deg, rgba(236, 244, 242, 0.96), rgba(236, 244, 242, 0.72) 72%, transparent 100%);
}

.public-header-shell {
    width: min(1400px, calc(100% - 28px));
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(320px, 430px) minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    padding: 16px 20px;
    border-radius: 30px;
    border: 1px solid rgba(191, 212, 207, 0.92);
    background:
        radial-gradient(circle at top right, rgba(255, 255, 255, 0.82), transparent 30%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(246, 250, 249, 0.94));
    box-shadow: 0 26px 45px rgba(11, 57, 60, 0.12);
    backdrop-filter: blur(16px);
}

.public-header .public-brand,
.auth-header-shell .public-brand {
    position: relative;
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    width: 100%;
    max-width: none;
    min-height: 112px;
    padding: 18px 20px;
    border-radius: 28px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background:
        radial-gradient(circle at top right, rgba(244, 215, 130, 0.22), transparent 24%),
        linear-gradient(135deg, #11363d 0%, #0d5454 54%, #117665 100%);
    box-shadow: 0 24px 40px rgba(7, 51, 54, 0.22);
    overflow: hidden;
}

.public-header .public-brand::before,
.public-header .public-brand::after,
.auth-header-shell .public-brand::before,
.auth-header-shell .public-brand::after {
    display: none;
}

.public-brand-media {
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
    width: 88px;
    height: 88px;
    border-radius: 24px;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0.08));
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.public-brand .public-brand-media img {
    display: block;
    width: 100%;
    height: 100%;
    padding: 12px;
    object-fit: contain;
    transform: scale(var(--header-logo-scale, 1.6));
    transform-origin: center;
    filter: drop-shadow(0 10px 18px rgba(2, 28, 34, 0.18));
}

.public-brand-copy {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 6px;
    min-width: 0;
}

.public-brand-kicker {
    display: inline-flex;
    align-items: center;
    width: max-content;
    min-height: 30px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(245, 217, 135, 0.15);
    color: #f8e6b4;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.public-brand-title {
    display: block;
    color: #ffffff;
    font-size: 1.22rem;
    line-height: 1.1;
    letter-spacing: 0.05em;
}

.public-brand-subtitle {
    color: rgba(237, 247, 245, 0.82);
    font-size: 0.9rem;
    line-height: 1.45;
}

.public-nav {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 0;
    margin: 0;
}

.public-nav-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 18px;
    border-radius: 999px;
    border: 1px solid rgba(184, 206, 202, 0.9);
    background: rgba(255, 255, 255, 0.8);
    color: #17393d;
    font-size: 0.95rem;
    font-weight: 600;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
    transition: transform 0.25s ease, background 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
}

.public-nav-link:hover,
.public-nav-link.active {
    background: linear-gradient(135deg, #11363d 0%, #0d5454 100%);
    color: #ffffff;
    box-shadow: 0 18px 30px rgba(11, 57, 60, 0.18);
    transform: translateY(-1px);
}

.public-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex-wrap: wrap;
}

.public-header-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 16px;
    border-radius: 999px;
    border: 1px solid rgba(17, 79, 77, 0.12);
    background: rgba(17, 79, 77, 0.08);
    color: #125150;
    font-weight: 700;
}

.public-header .btn-soft,
.public-header .btn-primary {
    min-height: 48px;
    border-radius: 16px;
}

.public-header .btn-soft {
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(188, 212, 207, 0.92);
    color: #17393d;
}

.public-header .btn-primary {
    background: linear-gradient(135deg, #16373b 0%, #0f5d57 100%);
    box-shadow: 0 20px 28px rgba(10, 52, 57, 0.22);
}

.auth-page-header .public-header-shell {
    grid-template-columns: minmax(320px, 430px) auto;
}

.auth-header-actions {
    justify-content: flex-end;
}

.public-header.is-condensed {
    padding-top: 10px;
}

.public-header.is-condensed .public-header-shell {
    gap: 14px;
    padding-top: 12px;
    padding-bottom: 12px;
}

.public-header.is-condensed .public-brand,
.public-header.is-condensed .auth-header-shell .public-brand {
    min-height: 94px;
    padding-top: 14px;
    padding-bottom: 14px;
}

.public-header.is-condensed .public-brand-media {
    width: 72px;
    height: 72px;
}

.public-header.is-condensed .public-brand .public-brand-media img {
    padding: 10px;
    transform: scale(calc(var(--header-logo-scale, 1.6) * 0.92));
}

.public-header.is-condensed .public-brand-title {
    font-size: 1.08rem;
}

.public-header.is-condensed .public-brand-subtitle {
    font-size: 0.82rem;
}

.site-footer {
    position: relative;
    width: min(1400px, calc(100% - 28px));
    margin: 28px auto 34px;
    border-radius: 34px;
    overflow: hidden;
    background:
        radial-gradient(circle at top right, rgba(246, 216, 137, 0.16), transparent 24%),
        radial-gradient(circle at bottom left, rgba(17, 119, 101, 0.28), transparent 30%),
        linear-gradient(145deg, #0c2830 0%, #0e4c50 52%, #117868 100%);
    color: #eef8f5;
    box-shadow: 0 32px 60px rgba(6, 34, 42, 0.26);
}

.site-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, rgba(255, 255, 255, 0.08), transparent 38%, transparent 62%, rgba(255, 255, 255, 0.06));
    pointer-events: none;
}

.site-footer-shell {
    position: relative;
    padding: 32px 32px 24px;
    display: grid;
    gap: 22px;
}

.site-footer-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) auto;
    align-items: center;
    gap: 24px;
    padding-bottom: 22px;
    border-bottom: 1px solid rgba(223, 240, 236, 0.16);
}

.site-footer-brand-block {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 18px;
}

.site-footer-brand {
    width: 128px;
    min-height: 128px;
    border-radius: 30px;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.18), rgba(255, 255, 255, 0.06));
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 22px 34px rgba(4, 24, 30, 0.2);
}

.site-footer-brand img {
    width: 100%;
    height: 100%;
    padding: 18px;
    object-fit: contain;
}

.site-footer-copy {
    display: grid;
    gap: 10px;
}

.site-footer-kicker {
    display: inline-flex;
    align-items: center;
    width: max-content;
    min-height: 30px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(245, 217, 135, 0.14);
    color: #f7e3a8;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.site-footer-copy h4 {
    margin: 0;
    color: #ffffff;
    font-size: 1.72rem;
    line-height: 1.15;
}

.site-footer-copy p {
    margin: 0;
    max-width: 640px;
    color: rgba(237, 248, 245, 0.82);
    line-height: 1.8;
}

.site-footer-cta {
    display: grid;
    justify-items: end;
    gap: 14px;
    min-width: 320px;
    padding: 20px 22px;
    border-radius: 26px;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.05));
    border: 1px solid rgba(255, 255, 255, 0.16);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.site-footer-cta > span {
    color: rgba(245, 249, 248, 0.9);
    font-weight: 600;
    text-align: right;
}

.site-footer-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 12px;
}

.site-footer .btn-soft,
.site-footer .btn-primary {
    min-height: 50px;
    border-radius: 16px;
}

.site-footer .btn-soft {
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
}

.site-footer .btn-primary {
    background: linear-gradient(135deg, #f5dfa0 0%, #d2a84a 100%);
    color: #12363b;
    font-weight: 700;
    box-shadow: 0 16px 24px rgba(7, 28, 32, 0.18);
}

.site-footer-grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr 1fr;
    gap: 18px;
}

.site-footer-card {
    padding: 24px;
    border-radius: 26px;
    background: linear-gradient(160deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.05));
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.site-footer-card-label {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 11px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    color: #f2e0ad;
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.site-footer-card-copy {
    display: grid;
    gap: 10px;
    margin-top: 18px;
}

.site-footer-card-copy p {
    margin: 0;
    color: rgba(237, 248, 245, 0.84);
    line-height: 1.75;
}

.site-footer-contact-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    width: max-content;
    min-height: 46px;
    padding: 0 14px;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
    font-weight: 700;
}

.site-footer-meta {
    display: inline-flex;
    align-items: flex-start;
    gap: 10px;
}

.site-footer-link-list {
    display: grid;
    gap: 12px;
    margin-top: 18px;
}

.site-footer-link-list a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 46px;
    padding: 0 14px;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.06);
    color: rgba(248, 252, 250, 0.94);
    font-weight: 600;
    transition: transform 0.24s ease, background 0.24s ease, border-color 0.24s ease;
}

.site-footer-link-list a::after {
    content: ">";
    color: rgba(247, 227, 168, 0.92);
    font-size: 0.94rem;
}

.site-footer-link-list a:hover {
    transform: translateY(-1px);
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.2);
}

.site-footer-bottom {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 16px 24px;
    padding-top: 6px;
    border-top: 1px solid rgba(223, 240, 236, 0.14);
}

.site-footer-legal {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 18px;
    align-items: center;
    color: rgba(230, 244, 240, 0.78);
    font-size: 0.92rem;
}

.site-footer-legal-right {
    justify-content: flex-end;
    text-align: right;
}

.site-footer .is-disabled,
.site-footer-contact-link.is-disabled {
    pointer-events: none;
    opacity: 0.62;
}

#portal-home,
#jadwal-posyandu,
#peta-publik,
#portal-footer {
    scroll-margin-top: 132px;
}

@media (max-width: 1240px) {
    .public-header-shell,
    .auth-page-header .public-header-shell {
        grid-template-columns: minmax(0, 1fr);
    }

    .public-nav,
    .public-header-actions,
    .auth-header-actions {
        justify-content: flex-start;
    }

    .site-footer-hero,
    .site-footer-grid {
        grid-template-columns: 1fr;
    }

    .site-footer-cta,
    .site-footer-actions {
        justify-items: start;
        justify-content: flex-start;
    }

    .site-footer-cta > span,
    .site-footer-legal-right {
        text-align: left;
    }
}

@media (max-width: 760px) {
    .public-header {
        padding-top: 14px;
    }

    .public-header-shell,
    .site-footer {
        width: min(1400px, calc(100% - 18px));
    }

    .public-header-shell {
        padding: 14px;
        border-radius: 24px;
    }

    .public-header .public-brand,
    .auth-header-shell .public-brand {
        grid-template-columns: 74px minmax(0, 1fr);
        min-height: auto;
        padding: 16px;
        border-radius: 24px;
    }

    .public-brand-media {
        width: 74px;
        height: 74px;
        border-radius: 20px;
    }

    .public-brand .public-brand-media img {
        padding: 10px;
        transform: scale(calc(var(--header-logo-scale, 1.6) * 0.88));
    }

    .public-brand-title {
        font-size: 1.05rem;
    }

    .public-brand-subtitle {
        font-size: 0.82rem;
    }

    .public-nav {
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: 4px;
    }

    .public-nav-link {
        white-space: nowrap;
    }

    .public-header-actions {
        width: 100%;
    }

    .public-header-actions > * {
        flex: 1 1 180px;
        justify-content: center;
    }

    .site-footer-shell {
        padding: 24px 20px 20px;
    }

    .site-footer-brand-block {
        grid-template-columns: 1fr;
    }

    .site-footer-brand {
        width: 112px;
        min-height: 112px;
    }

    .site-footer-copy h4 {
        font-size: 1.48rem;
    }

    .site-footer-card {
        padding: 20px;
        border-radius: 22px;
    }
}

@media (max-width: 560px) {
    .public-header .public-brand,
    .auth-header-shell .public-brand {
        grid-template-columns: 1fr;
    }

    .public-brand-media {
        width: 84px;
        height: 84px;
    }

    .public-header-actions > * {
        flex-basis: 100%;
    }

    .site-footer {
        border-radius: 28px;
    }

    .site-footer-cta {
        min-width: 0;
        border-radius: 22px;
    }

    .site-footer-link-list a,
    .site-footer-contact-link {
        width: 100%;
    }

    .site-footer-legal,
    .site-footer-legal-right {
        justify-content: flex-start;
        text-align: left;
    }
}
/* 2026-03-12 dashboard admin fill */
.dashboard-admin-stack {
    display: grid;
    gap: 18px;
    min-width: 0;
}

.dashboard-command-card {
    display: grid;
    gap: 18px;
}

.dashboard-command-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.dashboard-command-metric {
    padding: 16px;
    border-radius: 18px;
    border: 1px solid #d8e8e6;
    background: linear-gradient(180deg, #ffffff 0%, #f7fbfb 100%);
}

.dashboard-command-metric span {
    display: block;
    color: #5d7d82;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.dashboard-command-metric strong {
    display: block;
    margin-top: 8px;
    color: #13363b;
    font-size: 1.8rem;
    line-height: 1;
}

.dashboard-command-metric small {
    display: block;
    margin-top: 8px;
    color: #69868b;
    line-height: 1.45;
}

.dashboard-command-metric.accent {
    background: linear-gradient(180deg, #fef7e8 0%, #fffdf7 100%);
    border-color: #edd7a6;
}

.dashboard-command-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
    gap: 16px;
}

.dashboard-command-panel {
    padding: 18px;
    border-radius: 22px;
    border: 1px solid #d9e9e7;
    background: linear-gradient(180deg, #fcfefe 0%, #f4faf9 100%);
}

.dashboard-command-panel.emphasis {
    background: linear-gradient(180deg, #eef8f4 0%, #f8fcfb 100%);
}

.dashboard-command-panel h3 {
    margin: 0 0 14px;
    color: #15363b;
    font-size: 1.02rem;
}

.dashboard-command-list {
    display: grid;
    gap: 12px;
}

.dashboard-command-item {
    display: grid;
    gap: 4px;
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px solid #d8e8e6;
    background: #ffffff;
}

.dashboard-command-item strong {
    color: #15363b;
}

.dashboard-command-item span,
.dashboard-command-item small,
.dashboard-command-empty,
.dashboard-command-highlight p {
    color: #67848a;
    line-height: 1.55;
}

.dashboard-command-item small {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.dashboard-command-empty {
    padding: 16px;
    border-radius: 16px;
    border: 1px dashed #cfe2df;
    background: #ffffff;
}

.dashboard-command-highlight {
    padding: 18px;
    border-radius: 18px;
    background: linear-gradient(135deg, #11373d 0%, #0d5b58 100%);
    box-shadow: 0 20px 30px rgba(11, 57, 60, 0.16);
}

.dashboard-command-highlight span {
    display: block;
    color: rgba(239, 249, 247, 0.76);
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.dashboard-command-highlight strong {
    display: block;
    margin: 8px 0 10px;
    color: #ffffff;
    font-size: 1.28rem;
}

.dashboard-command-highlight p {
    margin: 0;
    color: rgba(239, 249, 247, 0.82);
}

.dashboard-command-links {
    display: grid;
    gap: 10px;
    margin-top: 16px;
}

.dashboard-command-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 48px;
    padding: 0 16px;
    border-radius: 16px;
    border: 1px solid #d7e7e4;
    background: #ffffff;
    color: #154147;
    font-weight: 700;
}

.dashboard-command-link i {
    color: #0d8277;
}

@media (max-width: 1100px) {
    .dashboard-command-metrics,
    .dashboard-command-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .dashboard-command-card,
    .dashboard-command-panel,
    .dashboard-command-highlight {
        border-radius: 20px;
    }

    .dashboard-command-metric {
        padding: 14px;
    }
}
/* 2026-03-12 dashboard admin spacing fix */
.dashboard-admin-grid {
    grid-template-columns: minmax(0, 1.08fr) minmax(340px, 0.92fr);
    align-items: stretch;
}

.dashboard-admin-stack {
    align-content: start;
}

.dashboard-admin-stack > * {
    min-width: 0;
}

.dashboard-command-card {
    min-height: 360px;
}

.dashboard-command-grid {
    align-items: stretch;
}

.dashboard-command-panel,
.dashboard-command-panel.emphasis {
    height: 100%;
}

.dashboard-command-panel.emphasis {
    display: grid;
    align-content: start;
}

.dashboard-scroll-card {
    min-height: 320px;
}

@media (max-width: 1100px) {
    .dashboard-admin-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-command-card,
    .dashboard-scroll-card {
        min-height: 0;
    }
}
/* 2026-03-12 nutrition status selector */
.nutrition-status-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.nutrition-status-card {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 88px;
    padding: 16px;
    border-radius: 18px;
    border: 1px solid #d2e4e6;
    background: linear-gradient(180deg, #ffffff 0%, #f9fcfc 100%);
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.nutrition-status-card::after {
    content: "";
    position: absolute;
    top: 12px;
    right: 12px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(13, 143, 130, 0.1);
    color: #0d8f82;
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 0.82rem;
    opacity: 0;
    transform: scale(0.85);
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.nutrition-status-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 28px rgba(10, 69, 72, 0.08);
}

.nutrition-status-card input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.nutrition-status-card-body {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.nutrition-status-dot {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    flex: 0 0 16px;
    box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.75);
}

.nutrition-status-copy {
    display: grid;
    gap: 4px;
}

.nutrition-status-copy strong {
    color: #15373c;
    font-size: 1rem;
}

.nutrition-status-copy small {
    color: #668388;
    line-height: 1.45;
}

.nutrition-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 12px;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
    white-space: nowrap;
}

.nutrition-status-card.danger {
    border-color: #f0c9c7;
    background: linear-gradient(180deg, #fff8f7 0%, #fffdfd 100%);
}

.nutrition-status-card.danger .nutrition-status-dot {
    background: #dd514c;
}

.nutrition-status-card.danger .nutrition-status-badge {
    background: #fde8e6;
    color: #a43733;
}

.nutrition-status-card.warning {
    border-color: #edd8a3;
    background: linear-gradient(180deg, #fffaf0 0%, #fffdf9 100%);
}

.nutrition-status-card.warning .nutrition-status-dot {
    background: #f2bf47;
}

.nutrition-status-card.warning .nutrition-status-badge {
    background: #fff2cf;
    color: #8c6b12;
}

.nutrition-status-card.ok,
.nutrition-status-card.info {
    border-color: #cde5dd;
    background: linear-gradient(180deg, #f5fcf9 0%, #fcfffe 100%);
}

.nutrition-status-card.ok .nutrition-status-dot,
.nutrition-status-card.info .nutrition-status-dot {
    background: #2aaf7a;
}

.nutrition-status-card.ok .nutrition-status-badge,
.nutrition-status-card.info .nutrition-status-badge {
    background: #e7f8ef;
    color: #1d7f56;
}

.nutrition-status-card.selected {
    border-width: 2px;
    border-color: #0d8f82;
    box-shadow: 0 20px 32px rgba(10, 69, 72, 0.12);
}

.nutrition-status-card.selected::after,
.nutrition-status-card:has(input:checked)::after {
    content: "\f00c";
    opacity: 1;
    transform: scale(1);
}

.nutrition-status-card.selected,
.nutrition-status-card:has(input:checked) {
    border-width: 2px;
    border-color: #0d8f82;
    box-shadow: 0 20px 32px rgba(10, 69, 72, 0.12);
}

.nutrition-status-card.selected .nutrition-status-copy strong,
.nutrition-status-card:has(input:checked) .nutrition-status-copy strong {
    color: #0d5f57;
}

.nutrition-status-card.selected .nutrition-status-badge,
.nutrition-status-card:has(input:checked) .nutrition-status-badge {
    box-shadow: inset 0 0 0 1px rgba(13, 143, 130, 0.16);
}

.nutrition-status-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 16px;
    margin-top: 10px;
    color: #5f7b80;
    font-size: 0.85rem;
}

.nutrition-status-legend span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.nutrition-status-legend span:nth-child(1) i {
    color: #dd514c;
}

.nutrition-status-legend span:nth-child(2) i {
    color: #f2bf47;
}

.nutrition-status-legend span:nth-child(3) i {
    color: #2aaf7a;
}

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

    .nutrition-status-card {
        align-items: flex-start;
        flex-direction: column;
    }
}
/* 2026-03-12 history density and radio choices */
.choice-group {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px;
}

.choice-card {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-height: 56px;
    padding: 12px 14px;
    border: 1px solid #c8dade;
    border-radius: 14px;
    background: #fbfefe;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease, background 0.2s ease;
    cursor: pointer;
}

.choice-card:hover {
    border-color: #8cbab6;
    box-shadow: 0 12px 24px rgba(17, 93, 84, 0.08);
    transform: translateY(-1px);
}

.choice-card.selected,
.choice-card:has(input:checked) {
    border-color: #149f91;
    background: linear-gradient(180deg, #f8fffe 0%, #eefaf8 100%);
    box-shadow: 0 14px 28px rgba(20, 132, 120, 0.12);
}

.choice-card input {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    flex-shrink: 0;
    accent-color: #149f91;
}

.choice-card span {
    color: #1d4044;
    font-size: 0.95rem;
    line-height: 1.4;
}

.history-record-grid {
    align-items: start;
}

.history-record-summary,
.history-answer-grid {
    align-content: start;
    align-items: start;
    grid-auto-flow: row dense;
}

.history-record-summary {
    grid-template-columns: repeat(auto-fit, minmax(185px, 1fr));
}

.history-answer-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.history-summary-item,
.history-answer-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
    height: auto;
    align-self: start;
}

.history-summary-item.compact,
.history-answer-item.compact {
    min-height: 0;
}

.history-summary-item.wide,
.history-answer-item.wide {
    grid-column: 1 / -1;
}

.history-summary-item strong,
.history-answer-item strong {
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
}



/* 2026-03-12 history accordion exports */
.history-record-accordion {
    padding: 0;
    overflow: hidden;
}

.history-record-toggle {
    list-style: none;
    cursor: pointer;
    padding: 20px;
}

.history-record-toggle::-webkit-details-marker,
.history-record-toggle::marker {
    display: none;
}

.history-record-toggle:focus-visible {
    outline: 3px solid rgba(21, 144, 131, 0.22);
    outline-offset: -3px;
}

.history-record-accordion[open] {
    border-color: #b8d9d4;
    box-shadow: 0 22px 46px rgba(13, 89, 81, 0.08);
}

.history-record-accordion .history-record-top {
    margin: 0;
}

.history-toggle-indicator {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border: 1px solid #d8e8e5;
    border-radius: 999px;
    background: #f7fbfb;
    color: #185359;
    font-weight: 700;
    white-space: nowrap;
}

.history-toggle-indicator i {
    transition: transform 0.22s ease;
}

.history-record-accordion[open] .history-toggle-indicator i {
    transform: rotate(180deg);
}

.history-toggle-open {
    display: none;
}

.history-record-accordion[open] .history-toggle-open {
    display: inline;
}

.history-record-accordion[open] .history-toggle-closed {
    display: none;
}

.history-record-body {
    padding: 0 20px 20px;
}

.history-record-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 14px;
    margin-bottom: 18px;
    padding-top: 18px;
    border-top: 1px solid #deece9;
}

.history-export-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.history-export-actions .btn-soft {
    background: #f6fbfb;
}

/* 2026-03-12 dashboard ops upgrade */
.dashboard-ops-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(330px, 0.95fr);
    gap: 16px;
}

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

.dashboard-focus-tile {
    display: grid;
    gap: 10px;
    padding: 16px 18px;
    border-radius: 20px;
    border: 1px solid #d9e8e6;
    background: linear-gradient(180deg, #ffffff 0%, #f7fbfb 100%);
}

.dashboard-focus-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.dashboard-focus-top span {
    color: #688289;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.dashboard-focus-top i {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 14px;
    font-size: 0.96rem;
}

.dashboard-focus-tile strong {
    color: #14373d;
    font-size: 2rem;
    line-height: 1;
}

.dashboard-focus-tile small {
    color: #688188;
    line-height: 1.58;
}

.dashboard-focus-tile.danger {
    background: linear-gradient(180deg, #fff4f2 0%, #fffaf9 100%);
    border-color: #f2d2cb;
}

.dashboard-focus-tile.danger .dashboard-focus-top i {
    color: #cb544d;
    background: #ffe4de;
}

.dashboard-focus-tile.warning {
    background: linear-gradient(180deg, #fff9ec 0%, #fffdf7 100%);
    border-color: #efd9a7;
}

.dashboard-focus-tile.warning .dashboard-focus-top i {
    color: #bb830e;
    background: #fff0c9;
}

.dashboard-focus-tile.info {
    background: linear-gradient(180deg, #eef8fb 0%, #fbfeff 100%);
    border-color: #cfe5ed;
}

.dashboard-focus-tile.info .dashboard-focus-top i {
    color: #0d7e93;
    background: #ddf3fa;
}

.dashboard-focus-tile.accent {
    background: linear-gradient(180deg, #eef7f1 0%, #fbfdfc 100%);
    border-color: #cfe3d6;
}

.dashboard-focus-tile.accent .dashboard-focus-top i {
    color: #1a8a61;
    background: #e1f3e8;
}

.dashboard-focus-brief {
    margin-top: 14px;
    padding: 18px 20px;
    border-radius: 20px;
    border: 1px solid #d6e7e4;
    background: linear-gradient(135deg, #f8fcfc 0%, #eef7f5 100%);
}

.dashboard-focus-brief strong {
    display: block;
    margin-bottom: 6px;
    color: #15383d;
    font-size: 1.02rem;
}

.dashboard-focus-brief p {
    margin: 0;
    color: #658086;
    line-height: 1.68;
}

.dashboard-quality-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(290px, 0.94fr);
    gap: 16px;
    align-items: start;
}

.dashboard-quality-list {
    display: grid;
    gap: 14px;
}

.dashboard-quality-item {
    padding: 14px 16px;
    border-radius: 18px;
    border: 1px solid #d8e8e6;
    background: linear-gradient(180deg, #ffffff 0%, #f9fcfc 100%);
}

.dashboard-quality-meta {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.dashboard-quality-meta span {
    color: #668087;
    font-size: 0.9rem;
    font-weight: 700;
}

.dashboard-quality-meta strong {
    color: #14373d;
    font-size: 1rem;
}

.dashboard-quality-bar {
    height: 10px;
    margin: 10px 0 8px;
    border-radius: 999px;
    background: #e5efed;
    overflow: hidden;
}

.dashboard-quality-bar i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #12978b 0%, #0d7f75 100%);
}

.dashboard-quality-bar i.brand {
    background: linear-gradient(90deg, #12978b 0%, #0d7f75 100%);
}

.dashboard-quality-bar i.info {
    background: linear-gradient(90deg, #2f95ad 0%, #156f87 100%);
}

.dashboard-quality-bar i.warning {
    background: linear-gradient(90deg, #f0c04e 0%, #ca8e10 100%);
}

.dashboard-quality-bar i.success {
    background: linear-gradient(90deg, #2eb57f 0%, #1b8b61 100%);
}

.dashboard-quality-bar i.danger {
    background: linear-gradient(90deg, #e2675d 0%, #c5463e 100%);
}

.dashboard-quality-item small {
    color: #688188;
    line-height: 1.5;
}

.dashboard-intervention-panel {
    display: grid;
    gap: 14px;
    padding: 18px;
    border-radius: 22px;
    border: 1px solid #d8e8e6;
    background: linear-gradient(180deg, #fcfefe 0%, #f4faf9 100%);
}

.dashboard-intervention-panel h3 {
    margin: 0;
    color: #15383d;
    font-size: 1.02rem;
}

.dashboard-intervention-list {
    display: grid;
    gap: 12px;
}

.dashboard-intervention-item {
    display: grid;
    gap: 8px;
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px solid #d9e8e6;
    background: #ffffff;
}

.dashboard-intervention-item-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

.dashboard-intervention-item-head strong {
    display: block;
    color: #14373d;
}

.dashboard-intervention-item-head span {
    color: #688188;
    line-height: 1.5;
}

.dashboard-intervention-item-head b {
    color: #0d7f75;
    font-size: 0.95rem;
}

.dashboard-intervention-bar {
    height: 8px;
    border-radius: 999px;
    background: #e5efed;
    overflow: hidden;
}

.dashboard-intervention-bar i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #12978b 0%, #0d7f75 100%);
}

.dashboard-intervention-empty {
    padding: 16px;
    border-radius: 16px;
    border: 1px dashed #d0e3df;
    background: #ffffff;
    color: #698289;
    line-height: 1.6;
}

.dashboard-intervention-note {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border-radius: 18px;
    background: linear-gradient(135deg, #11373d 0%, #0d5b58 100%);
}

.dashboard-intervention-note strong {
    color: #ffffff;
    font-size: 1.55rem;
    line-height: 1;
}

.dashboard-intervention-note span {
    color: rgba(238, 248, 247, 0.84);
    line-height: 1.55;
}

@media (max-width: 1100px) {
    .dashboard-ops-grid,
    .dashboard-quality-grid {
        grid-template-columns: 1fr;
    }
}

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

    .dashboard-intervention-note {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* 2026-03-12 dashboard command agenda fill */
.dashboard-command-panel {
    display: flex;
    flex-direction: column;
}

.dashboard-command-agenda-foot {
    display: grid;
    gap: 12px;
    margin-top: auto;
    padding-top: 14px;
}

.dashboard-command-agenda-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.dashboard-command-agenda-stat {
    display: grid;
    gap: 6px;
    padding: 14px;
    border-radius: 16px;
    border: 1px solid #d9e8e6;
    background: #ffffff;
}

.dashboard-command-agenda-stat span {
    color: #6a848a;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.dashboard-command-agenda-stat strong {
    color: #14373d;
    font-size: 1.55rem;
    line-height: 1;
}

.dashboard-command-agenda-stat small {
    color: #6c858b;
    line-height: 1.45;
}

.dashboard-command-agenda-stat.accent {
    background: linear-gradient(180deg, #fff8eb 0%, #fffdf8 100%);
    border-color: #ecd7a9;
}

.dashboard-command-agenda-note {
    display: grid;
    gap: 6px;
    padding: 16px;
    border-radius: 18px;
    border: 1px solid #d8e8e6;
    background: linear-gradient(180deg, #ffffff 0%, #f6fbfb 100%);
}

.dashboard-command-agenda-note strong {
    color: #15383d;
    font-size: 0.98rem;
}

.dashboard-command-agenda-note p,
.dashboard-command-agenda-note small {
    margin: 0;
    color: #67848a;
    line-height: 1.58;
}

.dashboard-command-agenda-note small {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

@media (max-width: 760px) {
    .dashboard-command-agenda-stats {
        grid-template-columns: 1fr;
    }
}

/* 2026-03-12 dashboard command compact fix */
.dashboard-admin-grid {
    align-items: start;
}

.dashboard-command-card,
.dashboard-scroll-card {
    min-height: 0;
}

.dashboard-command-grid {
    align-items: start;
}

.dashboard-command-panel,
.dashboard-command-panel.emphasis {
    height: auto;
}

.dashboard-command-panel.emphasis {
    display: flex;
    flex-direction: column;
}

.dashboard-command-agenda-foot {
    margin-top: 14px;
}

/* 2026-03-12 dashboard command right fill */
.dashboard-command-grid {
    align-items: start;
}

.dashboard-command-panel {
    align-self: start;
}

.dashboard-command-panel.emphasis {
    align-self: stretch;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.dashboard-command-side-grid {
    display: grid;
    gap: 10px;
    margin-top: 16px;
}

.dashboard-command-side-item {
    display: grid;
    gap: 6px;
    padding: 14px 16px;
    border-radius: 16px;
    border: 1px solid #d7e7e4;
    background: #ffffff;
}

.dashboard-command-side-item span {
    color: #6b858b;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.dashboard-command-side-item strong {
    color: #14373d;
    font-size: 1.45rem;
    line-height: 1;
}

.dashboard-command-side-item small {
    color: #698389;
    line-height: 1.5;
}

.dashboard-command-side-item.warning {
    background: linear-gradient(180deg, #fff9ec 0%, #fffdf7 100%);
    border-color: #efd9a7;
}

.dashboard-command-side-item.info {
    background: linear-gradient(180deg, #eef8fb 0%, #fbfeff 100%);
    border-color: #cfe5ed;
}

.dashboard-command-side-note {
    margin-top: 14px;
    padding: 16px;
    border-radius: 18px;
    border: 1px solid #d8e8e6;
    background: linear-gradient(180deg, #ffffff 0%, #f6fbfb 100%);
}

.dashboard-command-side-note strong {
    display: block;
    margin-bottom: 6px;
    color: #15383d;
}

.dashboard-command-side-note p {
    margin: 0;
    color: #67848a;
    line-height: 1.58;
}

/* 2026-03-12 dashboard admin row rebalance */
.dashboard-admin-grid {
    align-items: start;
}

.dashboard-admin-grid > .dashboard-scroll-card {
    min-height: 0;
}

.dashboard-admin-grid > .dashboard-command-card {
    grid-column: 1 / -1;
    min-height: 0;
}

@media (max-width: 1100px) {
    .dashboard-admin-grid > .dashboard-command-card {
        grid-column: auto;
    }
}

/* 2026-03-12 dashboard map and internal footer rebalance */
.dashboard-map {
    height: clamp(280px, 31vw, 332px);
    border-radius: 24px;
    border: 1px solid #cfe0dd;
    background: linear-gradient(180deg, #dbe8ea 0%, #eef5f4 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.74), 0 18px 32px rgba(11, 65, 61, 0.08);
}

.dashboard-map .leaflet-control-container {
    font-family: "Poppins", sans-serif;
}

.dashboard-map .leaflet-control-zoom {
    margin: 14px 0 0 14px;
    overflow: hidden;
    border: 0;
    border-radius: 16px;
    box-shadow: 0 14px 24px rgba(12, 54, 57, 0.16);
}

.dashboard-map .leaflet-control-zoom a {
    width: 38px;
    height: 38px;
    line-height: 38px;
    border: 0;
    background: rgba(255, 255, 255, 0.94);
    color: #173a40;
    transition: background 0.2s ease, color 0.2s ease;
}

.dashboard-map .leaflet-control-zoom a:hover {
    background: #ffffff;
    color: #0d7f74;
}

.dashboard-map .leaflet-control-attribution {
    margin: 0;
    padding: 5px 10px;
    border-radius: 12px 0 23px 0;
    background: rgba(255, 255, 255, 0.9);
    color: #577277;
    box-shadow: 0 10px 18px rgba(13, 53, 58, 0.12);
}

.dashboard-map .leaflet-popup-content-wrapper {
    border-radius: 18px;
    box-shadow: 0 18px 32px rgba(15, 54, 58, 0.18);
}

.dashboard-map .leaflet-popup-content {
    margin: 14px 16px;
}

.site-footer-internal {
    width: min(1320px, calc(100% - 24px));
    margin: 22px auto 26px;
    border-radius: 28px;
    box-shadow: 0 24px 46px rgba(7, 35, 42, 0.22);
}

.site-footer-internal .site-footer-shell {
    padding: 24px 26px 18px;
    gap: 18px;
}

.site-footer-internal .site-footer-hero {
    gap: 18px;
    padding-bottom: 18px;
}

.site-footer-internal .site-footer-brand-block {
    gap: 16px;
}

.site-footer-internal .site-footer-brand {
    width: 100px;
    min-height: 100px;
    border-radius: 24px;
}

.site-footer-internal .site-footer-brand img {
    padding: 14px;
}

.site-footer-internal .site-footer-copy {
    gap: 8px;
}

.site-footer-internal .site-footer-copy h4 {
    font-size: 1.48rem;
}

.site-footer-internal .site-footer-copy p {
    max-width: 560px;
    font-size: 0.98rem;
    line-height: 1.65;
}

.site-footer-internal .site-footer-cta {
    min-width: 286px;
    gap: 10px;
    padding: 16px 18px;
    border-radius: 22px;
}

.site-footer-internal .site-footer-cta > span {
    font-size: 0.98rem;
}

.site-footer-internal .btn-soft,
.site-footer-internal .btn-primary {
    min-height: 46px;
    border-radius: 15px;
}

.site-footer-internal .site-footer-grid {
    grid-template-columns: 1.15fr 0.95fr 0.95fr;
    gap: 14px;
}

.site-footer-internal .site-footer-card {
    padding: 20px 20px 18px;
    border-radius: 22px;
}

.site-footer-internal .site-footer-card-copy,
.site-footer-internal .site-footer-link-list {
    margin-top: 14px;
    gap: 9px;
}

.site-footer-internal .site-footer-card-copy p {
    line-height: 1.6;
}

.site-footer-internal .site-footer-contact-link,
.site-footer-internal .site-footer-link-list a {
    min-height: 42px;
    border-radius: 14px;
}

.site-footer-internal .site-footer-bottom {
    gap: 12px 18px;
    padding-top: 4px;
}

.site-footer-internal .site-footer-legal {
    gap: 10px 14px;
    font-size: 0.88rem;
}

@media (max-width: 760px) {
    .dashboard-map {
        height: 276px;
        border-radius: 20px;
    }

    .site-footer-internal {
        width: min(1400px, calc(100% - 16px));
        margin: 18px auto 22px;
        border-radius: 24px;
    }

    .site-footer-internal .site-footer-shell {
        padding: 20px 18px 18px;
    }

    .site-footer-internal .site-footer-brand {
        width: 88px;
        min-height: 88px;
    }
}

/* 2026-03-12 history bulk export cards and internal footer cleanup */
.history-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
}

.history-summary-card {
    display: grid;
    gap: 12px;
    min-height: 128px;
    border-radius: 18px;
    padding: 18px;
}

.history-summary-card h3 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    color: #14373d;
    font-size: 1.02rem;
}

.history-summary-card h3 i {
    display: inline-grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 12px;
    background: #e9f5f3;
    color: #0e7b70;
}

.history-summary-card p {
    margin: 0;
    color: #668086;
    line-height: 1.6;
}

.history-summary-card p strong {
    display: block;
    color: #15383d;
    font-size: 1.8rem;
    line-height: 1.05;
}

.history-export-summary-card {
    background: linear-gradient(135deg, #f8fcfc 0%, #eef7f4 100%);
    border-color: #cfe2de;
}

.history-summary-note {
    font-size: 0.9rem;
}

.history-bulk-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: auto;
}

.history-bulk-btn {
    justify-content: center;
    min-height: 48px;
    border-radius: 14px;
    font-weight: 700;
}

.history-bulk-btn.pdf {
    border-color: #f0c7c3;
    background: #fff7f6;
    color: #b04540;
}

.history-bulk-btn.pdf:hover {
    background: #fff0ee;
}

.site-footer-internal .site-footer-hero {
    grid-template-columns: 1fr;
    align-items: flex-start;
}

.site-footer-internal .site-footer-brand-block {
    max-width: 780px;
}

.site-footer-internal .site-footer-copy p {
    max-width: 720px;
}

.site-footer-internal .site-footer-bottom {
    padding-top: 8px;
}

.site-footer-internal .site-footer-legal-right {
    gap: 8px 12px;
}

@media (max-width: 760px) {
    .history-summary-grid,
    .history-bulk-actions {
        grid-template-columns: 1fr;
    }

    .history-summary-card {
        min-height: 0;
    }
}

/* 2026-03-12 mobile rescue for internal pages */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

@media (max-width: 860px) {
    .topbar,
    .layout-with-sidebar,
    .public-header-shell,
    .auth-header-shell,
    .site-footer,
    .site-footer-internal {
        width: min(1400px, calc(100% - 16px));
    }

    .topbar {
        margin-top: 8px;
        padding: 12px;
        border-radius: 20px;
        grid-template-columns: 1fr;
        grid-template-areas:
            "brand"
            "heading"
            "actions";
        gap: 12px;
    }

    .topbar-brand,
    .topbar-heading,
    .topbar-actions,
    .topbar-tools,
    .topbar-profile {
        width: 100%;
        min-width: 0;
    }

    .brand-badge.brand-badge-logo-only,
    .public-brand {
        max-width: 100%;
        width: 100%;
        min-height: auto;
        padding: 14px 16px;
        border-radius: 22px;
    }

    .brand-badge.brand-badge-logo-only .brand-logo-image,
    .public-brand .public-brand-media img,
    .public-brand img {
        width: min(100%, 190px);
        height: auto;
        max-height: 68px;
    }

    .topbar-actions {
        justify-items: stretch;
    }

    .topbar-tools,
    .topbar-profile {
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: 8px;
    }

    .topbar-clock,
    .ghost-btn,
    .logout-btn {
        width: 100%;
        min-width: 0;
        justify-content: center;
    }

    .notif-dot,
    .user-chip {
        min-height: 46px;
    }

    .layout-with-sidebar {
        grid-template-columns: 1fr;
        gap: 14px;
        margin: 14px auto 22px;
    }

    .sidebar {
        position: static;
        top: auto;
        min-height: auto;
        border-radius: 22px;
    }

    .sidebar-top {
        display: flex;
        flex-wrap: nowrap;
        gap: 8px;
        overflow-x: auto;
        padding: 14px;
        scrollbar-width: thin;
    }

    .sidebar-title {
        width: 100%;
        flex: 0 0 100%;
        margin: 0 0 2px;
    }

    .sidebar-link {
        flex: 0 0 auto;
        min-width: max-content;
        margin-bottom: 0;
        padding: 10px 12px;
        font-size: 0.9rem;
        transform: none !important;
    }

    .sidebar-link.active::before {
        display: none;
    }

    .sidebar-weather {
        display: none;
    }

    .content-area,
    .form-card,
    .table-card,
    .dashboard-card,
    .dashboard-hero-panel,
    .settings-section,
    .question-editor-card,
    .history-record-card,
    .approval-card,
    .mobile-app-card {
        min-width: 0;
    }

    .table-head,
    .history-toolbar,
    .history-record-toolbar,
    .card-head,
    .settings-section-head {
        flex-direction: column;
        align-items: stretch;
    }

    .table-actions,
    .history-actions,
    .history-record-actions,
    .history-export-actions {
        width: 100%;
        justify-content: flex-start;
    }

    .search-inline,
    .search-inline.compact {
        width: 100%;
        min-width: 0;
    }

    .stats-grid,
    .stats-grid.dashboard-stats,
    .dashboard-hero-panel,
    .dashboard-analytics-grid,
    .dashboard-admin-grid,
    .dashboard-command-grid,
    .dashboard-command-metrics,
    .dashboard-focus-grid,
    .dashboard-ops-grid,
    .dashboard-quality-grid,
    .settings-media-grid,
    .settings-slider-grid,
    .settings-copy-grid,
    .history-summary-grid,
    .history-record-grid,
    .history-record-summary,
    .history-answer-grid,
    .nutrition-status-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-map,
    .public-map,
    .risk-map {
        height: 250px;
    }

    .dashboard-command-card,
    .dashboard-scroll-card,
    .dashboard-command-panel,
    .dashboard-command-panel.emphasis {
        min-height: 0;
        height: auto;
    }

    .history-bulk-actions,
    .site-footer-internal .site-footer-grid,
    .site-footer-grid {
        grid-template-columns: 1fr;
    }

    .site-footer-internal,
    .site-footer {
        margin: 18px auto 22px;
        border-radius: 24px;
    }

    .site-footer-shell,
    .site-footer-internal .site-footer-shell {
        padding: 20px 16px 18px;
        gap: 16px;
    }

    .site-footer-hero,
    .site-footer-internal .site-footer-hero,
    .site-footer-brand-block,
    .site-footer-internal .site-footer-brand-block {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .site-footer-brand,
    .site-footer-internal .site-footer-brand {
        width: 88px;
        min-height: 88px;
    }

    .site-footer-cta,
    .site-footer-internal .site-footer-cta {
        min-width: 0;
        width: 100%;
        justify-items: start;
        padding: 16px;
    }

    .site-footer-actions,
    .site-footer-internal .site-footer-actions {
        width: 100%;
        justify-content: flex-start;
    }

    .site-footer .btn-soft,
    .site-footer .btn-primary,
    .site-footer-contact-link,
    .site-footer-link-list a,
    .site-footer-internal .btn-soft,
    .site-footer-internal .btn-primary,
    .site-footer-internal .site-footer-contact-link,
    .site-footer-internal .site-footer-link-list a {
        width: 100%;
    }

    .site-footer-bottom,
    .site-footer-legal,
    .site-footer-legal-right,
    .site-footer-internal .site-footer-bottom,
    .site-footer-internal .site-footer-legal,
    .site-footer-internal .site-footer-legal-right {
        justify-content: flex-start;
        text-align: left;
    }
}

@media (max-width: 560px) {
    .topbar {
        padding: 10px;
        border-radius: 18px;
    }

    .topbar-heading-copy h2,
    .public-brand-title,
    .site-footer-copy h4,
    .site-footer-internal .site-footer-copy h4 {
        font-size: 1.16rem;
    }

    .dashboard-hero-panel,
    .dashboard-card,
    .form-card,
    .table-card,
    .settings-section,
    .site-footer-card,
    .site-footer-internal .site-footer-card {
        padding: 16px;
        border-radius: 18px;
    }

    .history-summary-card,
    .mobile-app-card {
        padding: 16px;
    }

    .dashboard-map,
    .public-map,
    .risk-map {
        height: 220px;
    }
}

/* 2026-03-12 compact public mobile header */
@media (max-width: 760px) {
    .public-header:not(.auth-page-header) {
        padding: 10px 0 4px;
    }

    .public-header:not(.auth-page-header) .public-header-shell {
        grid-template-columns: 1fr;
        grid-template-areas:
            "brand"
            "actions";
        gap: 12px;
        padding: 12px;
        border-radius: 22px;
    }

    .public-header:not(.auth-page-header) .public-brand {
        grid-template-columns: 64px minmax(0, 1fr);
        min-height: 0;
        gap: 12px;
        padding: 14px;
        border-radius: 22px;
        box-shadow: 0 18px 30px rgba(7, 51, 54, 0.18);
    }

    .public-header:not(.auth-page-header) .public-brand-media {
        width: 64px;
        height: 64px;
        border-radius: 18px;
    }

    .public-header:not(.auth-page-header) .public-brand .public-brand-media img {
        padding: 8px;
        transform: scale(calc(var(--header-logo-scale, 1.6) * 0.56));
    }

    .public-header:not(.auth-page-header) .public-brand-copy {
        gap: 4px;
    }

    .public-header:not(.auth-page-header) .public-brand-kicker,
    .public-header:not(.auth-page-header) .public-brand-subtitle,
    .public-header:not(.auth-page-header) .public-nav,
    .public-header:not(.auth-page-header) .public-header-pill,
    .public-header:not(.auth-page-header) .public-header .btn-soft,
    .public-header:not(.auth-page-header) .public-header-actions .btn-soft {
        display: none !important;
    }

    .public-header:not(.auth-page-header) .public-brand-title {
        font-size: 1.28rem;
        letter-spacing: 0.02em;
    }

    .public-header:not(.auth-page-header) .public-header-actions {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        justify-content: stretch;
        gap: 0;
    }

    .public-header:not(.auth-page-header) .public-header-actions .btn-primary {
        width: 100%;
        min-height: 48px;
        border-radius: 16px;
        box-shadow: 0 16px 24px rgba(10, 52, 57, 0.18);
    }

    .public-main {
        padding-top: 6px;
    }
}

@media (max-width: 560px) {
    .public-header:not(.auth-page-header) .public-header-shell {
        width: min(1400px, calc(100% - 12px));
        padding: 10px;
        border-radius: 20px;
    }

    .public-header:not(.auth-page-header) .public-brand {
        grid-template-columns: 56px minmax(0, 1fr);
        gap: 10px;
        padding: 12px;
        border-radius: 20px;
    }

    .public-header:not(.auth-page-header) .public-brand-media {
        width: 56px;
        height: 56px;
        border-radius: 16px;
    }

    .public-header:not(.auth-page-header) .public-brand-title {
        font-size: 1.14rem;
    }
}

/* 2026-03-12 public mobile nav drawer */
.public-nav-toggle {
    display: none;
}

.public-nav-drawer {
    display: contents;
}

@media (max-width: 760px) {
    .public-header:not(.auth-page-header) {
        padding: 10px 0 2px;
    }

    .public-header:not(.auth-page-header) .public-header-shell {
        width: min(1400px, calc(100% - 14px));
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "brand toggle"
            "drawer drawer";
        align-items: start;
        gap: 10px;
        padding: 12px;
        border-radius: 24px;
    }

    .public-header:not(.auth-page-header) .public-brand {
        grid-area: brand;
        grid-template-columns: 52px minmax(0, 1fr);
        min-height: 0;
        gap: 10px;
        padding: 13px 14px;
        border-radius: 22px;
        box-shadow: 0 16px 26px rgba(7, 51, 54, 0.16);
    }

    .public-header:not(.auth-page-header) .public-brand-media {
        width: 52px;
        height: 52px;
        border-radius: 16px;
    }

    .public-header:not(.auth-page-header) .public-brand .public-brand-media img {
        padding: 7px;
        transform: scale(calc(var(--header-logo-scale, 1.6) * 0.52));
    }

    .public-header:not(.auth-page-header) .public-brand-copy {
        gap: 2px;
    }

    .public-header:not(.auth-page-header) .public-brand-kicker {
        display: none !important;
    }

    .public-header:not(.auth-page-header) .public-brand-subtitle {
        display: block;
        font-size: 0.8rem;
        line-height: 1.35;
    }

    .public-header:not(.auth-page-header) .public-brand-title {
        font-size: 1.08rem;
        letter-spacing: 0.02em;
    }

    .public-header:not(.auth-page-header) .public-nav-toggle {
        grid-area: toggle;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        min-height: 52px;
        padding: 0 16px;
        border-radius: 18px;
        border: 1px solid rgba(176, 198, 194, 0.9);
        background: rgba(255, 255, 255, 0.92);
        color: #123c40;
        font-size: 0.95rem;
        font-weight: 700;
        box-shadow: 0 12px 24px rgba(10, 52, 57, 0.12);
    }

    .public-header:not(.auth-page-header).is-nav-open .public-nav-toggle {
        background: linear-gradient(135deg, #11363d 0%, #0d5454 100%);
        color: #ffffff;
    }

    .public-header:not(.auth-page-header) .public-nav-drawer {
        grid-area: drawer;
        display: grid;
        gap: 10px;
        max-height: 0;
        padding: 0;
        overflow: hidden;
        opacity: 0;
        pointer-events: none;
        transform: translateY(-8px);
        transition: max-height 0.28s ease, opacity 0.24s ease, transform 0.24s ease, padding 0.24s ease;
    }

    .public-header:not(.auth-page-header).is-nav-open .public-nav-drawer {
        max-height: 420px;
        padding: 10px;
        border-radius: 20px;
        border: 1px solid rgba(188, 212, 207, 0.95);
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(241, 247, 246, 0.96));
        box-shadow: 0 18px 30px rgba(11, 57, 60, 0.12);
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
    }

    .public-header:not(.auth-page-header) .public-nav {
        display: grid !important;
        gap: 8px;
        overflow: visible;
        justify-content: stretch;
        margin: 0;
    }

    .public-header:not(.auth-page-header) .public-nav-link {
        width: 100%;
        min-height: 46px;
        justify-content: flex-start;
        white-space: normal;
        border-radius: 16px;
        padding: 0 16px;
    }

    .public-header:not(.auth-page-header) .public-header-actions {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .public-header:not(.auth-page-header) .public-header-pill,
    .public-header:not(.auth-page-header) .public-header-actions .btn-soft {
        display: none !important;
    }

    .public-header:not(.auth-page-header) .public-header-actions .btn-primary {
        width: 100%;
        min-height: 48px;
        border-radius: 16px;
        box-shadow: none;
    }

    .public-main {
        padding-top: 4px;
    }
}

@media (max-width: 560px) {
    .public-header:not(.auth-page-header) .public-header-shell {
        width: min(1400px, calc(100% - 12px));
        padding: 10px;
        border-radius: 20px;
    }

    .public-header:not(.auth-page-header) .public-brand {
        grid-template-columns: 48px minmax(0, 1fr);
        gap: 8px;
        padding: 12px;
        border-radius: 18px;
    }

    .public-header:not(.auth-page-header) .public-brand-media {
        width: 48px;
        height: 48px;
        border-radius: 14px;
    }

    .public-header:not(.auth-page-header) .public-brand-title {
        font-size: 1rem;
    }

    .public-header:not(.auth-page-header) .public-nav-toggle {
        min-height: 48px;
        padding: 0 14px;
        border-radius: 16px;
    }
}
/* 2026-03-12 internal mobile sidebar drawer */
.internal-nav-toggle,
.sidebar-drawer-backdrop,
.sidebar-mobile-hero,
.sidebar-close-btn {
    display: none;
}

@media (max-width: 767px) {
    body.is-internal-nav-open {
        overflow: hidden;
    }

    .topbar-brand {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .topbar-brand .brand-badge.brand-badge-logo-only {
        flex: 1 1 auto;
        min-width: 0;
    }

    .internal-nav-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        flex: 0 0 auto;
        min-height: 50px;
        padding: 0 16px;
        border: 1px solid #d4e4e2;
        border-radius: 18px;
        background: linear-gradient(180deg, #ffffff 0%, #f4fbfa 100%);
        color: #174147;
        font-size: 0.92rem;
        font-weight: 700;
        box-shadow: 0 12px 22px rgba(11, 63, 61, 0.08);
    }

    body.is-internal-nav-open .internal-nav-toggle {
        background: linear-gradient(135deg, #16373b 0%, #0f5d57 100%);
        border-color: rgba(15, 93, 87, 0.38);
        color: #ffffff;
    }

    .topbar-tools {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: stretch;
    }

    .topbar-clock {
        grid-column: 1 / -1;
    }

    .notif-dot {
        width: 100%;
        height: 46px;
    }

    .topbar-profile {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }

    .sidebar-drawer-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 119;
        padding: 0;
        border: 0;
        background: rgba(5, 29, 33, 0.48);
        backdrop-filter: blur(4px);
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.24s ease;
    }

    body.is-internal-nav-open .sidebar-drawer-backdrop {
        opacity: 1;
        pointer-events: auto;
    }

    .layout-with-sidebar {
        grid-template-columns: 1fr;
    }

    .sidebar {
        position: fixed !important;
        top: 0;
        left: 0;
        bottom: 0;
        z-index: 120;
        width: min(84vw, 320px);
        height: 100dvh;
        min-height: 100dvh;
        margin: 0;
        border-radius: 0 28px 28px 0;
        transform: translateX(-106%);
        transition: transform 0.28s ease;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        box-shadow: 0 28px 42px rgba(10, 59, 57, 0.24);
    }

    body.is-internal-nav-open .sidebar {
        transform: translateX(0);
    }

    .sidebar-mobile-hero {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 18px 16px 12px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.12);
        background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0));
    }

    .sidebar-mobile-user {
        display: flex;
        align-items: center;
        gap: 12px;
        min-width: 0;
    }

    .sidebar-mobile-user .user-avatar,
    .sidebar-mobile-user .user-photo {
        width: 46px;
        height: 46px;
        border-radius: 14px;
        flex: 0 0 auto;
    }

    .sidebar-mobile-copy {
        display: grid;
        gap: 2px;
        min-width: 0;
    }

    .sidebar-mobile-copy strong {
        color: #ffffff;
        font-size: 0.98rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .sidebar-mobile-copy small {
        color: rgba(236, 248, 245, 0.82);
        font-size: 0.78rem;
    }

    .sidebar-close-btn {
        display: grid;
        place-items: center;
        width: 40px;
        height: 40px;
        flex: 0 0 auto;
        border-radius: 14px;
        border: 1px solid rgba(255, 255, 255, 0.14);
        background: rgba(255, 255, 255, 0.12);
        color: #ffffff;
    }

    .sidebar-top {
        display: block;
        flex: 1 1 auto;
        overflow-y: auto;
        overflow-x: hidden;
        padding: 14px 14px 10px;
    }

    .sidebar-title {
        width: auto;
        flex: none;
        margin: 0 6px 12px;
    }

    .sidebar-link {
        display: flex;
        width: 100%;
        min-width: 0;
        margin-bottom: 8px;
        padding: 12px 14px;
        white-space: normal;
        transform: none !important;
    }

    .sidebar-link.active::before {
        display: block;
        left: 6px;
        top: 8px;
        bottom: 8px;
    }

    .sidebar-weather {
        display: flex;
        margin: 0 14px 16px;
    }
}

@media (max-width: 560px) {
    .sidebar {
        width: min(86vw, 300px);
        border-radius: 0 24px 24px 0;
    }

    .internal-nav-toggle {
        min-height: 46px;
        padding: 0 14px;
        border-radius: 16px;
    }
}
/* 2026-03-12 smartphone auth/internal chrome cleanup */
.internal-nav-floating-toggle {
    display: none;
}

@media (max-width: 767px) {
    .login-body .auth-page-header,
    .login-body .site-footer-auth {
        display: none !important;
    }

    .login-body {
        padding: 12px 12px 18px;
    }

    .login-body .login-shell {
        margin: 0 auto;
        border-radius: 18px;
    }

    .internal-body .topbar,
    .internal-body .site-footer-internal {
        display: none !important;
    }

    .internal-body .layout-with-sidebar {
        width: min(1400px, calc(100% - 16px));
        margin: 12px auto 18px;
    }

    .internal-body .content-area {
        padding-top: 58px;
    }

    .internal-body .internal-nav-toggle {
        display: none !important;
    }

    .internal-nav-floating-toggle {
        position: fixed;
        top: 12px;
        left: 12px;
        z-index: 123;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        min-height: 48px;
        padding: 0 16px;
        border: 1px solid rgba(14, 88, 83, 0.18);
        border-radius: 18px;
        background: linear-gradient(135deg, rgba(16, 56, 60, 0.96), rgba(14, 101, 94, 0.96));
        color: #ffffff;
        font-size: 0.92rem;
        font-weight: 700;
        box-shadow: 0 20px 34px rgba(9, 53, 57, 0.2);
    }

    body.is-internal-nav-open .internal-nav-floating-toggle {
        background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(242, 248, 247, 0.98));
        color: #153f45;
    }
}

@media (min-width: 768px) {
    .internal-nav-floating-toggle {
        display: none !important;
    }
}

/* 2026-03-12 professional input form polish */
.input-form-shell {
    padding: 24px;
    border-radius: 24px;
    background:
        radial-gradient(circle at top right, rgba(20, 143, 130, 0.08), transparent 24%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.99) 0%, rgba(248, 252, 252, 0.98) 100%);
}

.input-form-toolbar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin: 6px 0 4px;
    padding: 18px 20px;
    border: 1px solid #d9e9e6;
    border-radius: 20px;
    background: linear-gradient(180deg, #ffffff 0%, #f5faf9 100%);
}

.input-form-toolbar-copy strong {
    display: block;
    color: #173b40;
    font-size: 1rem;
}

.input-form-toolbar-copy small {
    display: block;
    margin-top: 6px;
    color: #6f888d;
    line-height: 1.6;
}

.input-form-toolbar-main {
    display: grid;
    gap: 12px;
    min-width: 0;
    flex: 1 1 auto;
}

.input-form-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.input-form-toolbar-actions .btn-primary,
.input-form-toolbar-actions .btn-soft {
    min-height: 36px;
    border-radius: 999px;
    box-shadow: none;
}

/* recycle bin page */
.recycle-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.9fr);
    gap: 16px;
    padding: 18px 20px;
    border-radius: 16px;
    background: linear-gradient(135deg, #0f8f82 0%, #0c6f67 100%);
    color: #ffffff;
    box-shadow: 0 16px 28px rgba(10, 88, 83, 0.16);
    margin-bottom: 16px;
}
.recycle-hero h2 {
    margin: 6px 0 8px;
    color: #ffffff;
    font-size: 1.6rem;
}
.recycle-hero .muted {
    color: rgba(255, 255, 255, 0.86);
}
.recycle-hero .badge-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
}
.recycle-hero .status-pill {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.2);
    color: #f4fffd;
}
.recycle-hero-actions {
    display: grid;
    gap: 10px;
    align-content: start;
}
.recycle-hero-actions .btn-primary,
.recycle-hero-actions .btn-soft {
    width: 100%;
    justify-content: center;
}

.filter-panel {
    padding: 18px 20px;
}
.filter-panel .form-card-head {
    margin-bottom: 6px;
}
.filter-panel .input-grid.two-col {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 12px;
}
.filter-panel .btn-ghost {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #0f7b73;
    border-radius: 10px;
    padding: 8px 10px;
    border: 1px solid #cfe4e1;
    background: #f6fbfb;
}
.filter-panel .btn-ghost:hover {
    background: #edf7f6;
}

.responsive-table table {
    width: 100%;
    border-collapse: collapse;
}
.responsive-table thead th {
    background: #f7fbfb;
    color: #35555b;
    font-weight: 700;
    font-size: 0.9rem;
    padding: 10px 10px;
    border-bottom: 1px solid #d5e6e6;
}
.responsive-table tbody td {
    padding: 11px 10px;
    border-bottom: 1px solid #edf3f3;
    font-size: 0.93rem;
    color: #1b3a3f;
}
.responsive-table tbody tr:hover {
    background: #f8fbfb;
}
.table-actions {
    display: flex;
    gap: 8px;
}
.responsive-table tbody tr:nth-child(odd) {
    background: #fcfefe;
}

.recycle-table {
    border: 1px solid #dfeaea;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 8px 18px rgba(16, 68, 70, 0.05);
}
.recycle-table table {
    width: 100%;
}
.recycle-table td:first-child,
.recycle-table th:first-child {
    width: 46px;
    text-align: center;
}
.recycle-table td:last-child,
.recycle-table th:last-child {
    width: 110px;
}
.action-icon.success {
    border-color: #b9e2d8;
    background: #ecf9f5;
    color: #0f7b73;
}
.action-icon.danger {
    border-color: #f2c7c2;
    background: #fff1ee;
    color: #c74c3c;
}
.recycle-table .action-icon {
    display: inline-flex;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    align-items: center;
    justify-content: center;
    border: 1px solid #d3e8e4;
    background: #f5fbf9;
    color: #0f7b73;
    transition: transform 0.12s ease, box-shadow 0.12s ease;
}
.recycle-table .action-icon:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 12px rgba(15, 92, 86, 0.12);
}

@media (max-width: 900px) {
    .recycle-hero {
        grid-template-columns: 1fr;
    }
    .recycle-hero-actions .btn-primary,
    .recycle-hero-actions .btn-soft {
        width: auto;
    }
}

.input-form-toolbar-chips,
.input-question-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.input-toolbar-chip,
.input-question-chip,
.input-draft-badge {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid #d6e6e3;
    background: #ffffff;
    color: #31565a;
    font-size: 0.78rem;
    font-weight: 700;
}

.input-toolbar-chip.ok,
.input-question-chip.mapped {
    background: #ecf8f4;
    border-color: #c8e7de;
    color: #0f786d;
}

.input-toolbar-chip.warning,
.input-question-chip.required {
    background: #fff6dd;
    border-color: #eed7a2;
    color: #8c6c13;
}

.input-toolbar-chip.info,
.input-question-chip.upload,
.input-draft-badge {
    background: #eef6ff;
    border-color: #d6e6ff;
    color: #2f5c8a;
}

.input-form-grid {
    gap: 12px;
}

.input-question-section {
    margin-top: 6px;
    padding: 14px 16px;
    border-radius: 16px;
}

.input-question-card {
    display: grid;
    gap: 10px;
    min-width: 0;
    padding: 14px;
    border-radius: 16px;
    border: 1px solid #d8e8e6;
    background: linear-gradient(180deg, #ffffff 0%, #f8fcfc 100%);
    box-shadow: 0 10px 18px rgba(15, 66, 69, 0.05);
}

.input-question-card-file {
    background: linear-gradient(180deg, #fbfefe 0%, #f2faf8 100%);
}

.input-question-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
}

.input-question-meta {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-width: 0;
}

.input-question-index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 12px;
    background: linear-gradient(135deg, #0f7b73 0%, #16a191 100%);
    color: #ffffff;
    font-size: 0.82rem;
    font-weight: 800;
    flex: 0 0 32px;
    box-shadow: 0 10px 18px rgba(15, 124, 115, 0.16);
}

.input-question-card .question-label {
    margin: 2px 0 0;
    font-size: 0.94rem;
    line-height: 1.45;
    color: #16393e;
}

.input-question-control {
    display: grid;
    gap: 8px;
}

.input-question-card input,
.input-question-card select,
.input-question-card textarea {
    border-radius: 12px;
    border-color: #ccdcde;
    background: #ffffff;
    padding: 11px 12px;
}

.input-question-card input[type="file"] {
    padding: 12px 12px;
    border-style: dashed;
    background: linear-gradient(180deg, #ffffff 0%, #f6fbfb 100%);
}

.input-question-card textarea {
    min-height: 96px;
}

.input-question-card .choice-group,
.input-question-card .checkbox-group {
    margin-top: 2px;
}

.input-file-help {
    display: block;
    margin-top: -2px;
}

.input-location-card {
    margin-top: 10px;
    padding: 20px;
    border-radius: 24px;
    background: linear-gradient(180deg, #f8fcfc 0%, #eef7f6 100%);
}

.input-location-head {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
}

.input-location-head h3 {
    margin: 0;
    font-size: 1.1rem;
    color: #14383d;
}

.input-location-head p {
    margin: 8px 0 0;
    color: #638186;
    line-height: 1.62;
}

.input-location-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 14px;
}

.input-form-actions {
    margin-top: 2px;
    padding-top: 4px;
}

.input-draft-card {
    padding: 22px;
    border-radius: 24px;
}

.input-draft-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.input-draft-card .table-wrap {
    margin-top: 8px;
}

.input-draft-card table th {
    color: #56757b;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    font-size: 0.76rem;
}

.input-draft-card table td {
    vertical-align: middle;
}

@media (max-width: 1180px) {
    .input-form-hero,
    .input-form-stats,
    .input-location-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 860px) {
    .input-form-shell,
    .input-draft-card {
        padding: 18px;
        border-radius: 22px;
    }

    .input-form-toolbar,
    .input-location-head,
    .input-draft-head,
    .input-question-head {
        grid-template-columns: 1fr;
        display: grid;
    }

    .input-form-toolbar-chips,
    .input-question-chips {
        justify-content: flex-start;
    }
}

@media (max-width: 760px) {
    .input-form-hero-copy,
    .input-stat-card,
    .input-question-card,
    .input-location-card {
        border-radius: 20px;
    }

    .input-form-shell .input-form-hero-copy h2 {
        font-size: 1.62rem;
    }

    .input-question-meta {
        gap: 10px;
    }

    .input-question-index {
        width: 34px;
        height: 34px;
        border-radius: 12px;
        font-size: 0.82rem;
        flex-basis: 34px;
    }
}

/* 2026-03-12 input form formal refinement */
.input-form-shell {
    background: linear-gradient(180deg, #f7fbfb 0%, #fdfefe 100%);
}

.input-form-hero {
    gap: 14px;
    margin-bottom: 18px;
}

.input-form-hero-copy {
    border-radius: 22px;
    background: linear-gradient(135deg, #0f5b61 0%, #0d8c81 100%);
    box-shadow: 0 16px 30px rgba(10, 66, 69, 0.14);
    color: #ffffff;
    display: flex;
    flex-direction: column;
}

.input-form-shell .input-form-hero-copy h2 {
    color: #ffffff;
}

.input-form-shell .input-form-hero-copy p {
    color: rgba(255, 255, 255, 0.84);
    line-height: 1.66;
}

.input-form-eyebrow {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.02em;
}

.input-form-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.input-form-tag {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    font-size: 0.76rem;
    font-weight: 700;
}

.input-form-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

.input-form-hero-actions .btn-soft,
.input-form-hero-actions .btn-primary {
    min-height: 38px;
    border-radius: 999px;
    box-shadow: none;
}

.input-form-hero-actions .btn-soft {
    border-color: rgba(255, 255, 255, 0.24);
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
}

.input-form-hero-actions .btn-soft:hover {
    background: rgba(255, 255, 255, 0.18);
    border-color: rgba(255, 255, 255, 0.34);
}

.input-form-section-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.input-form-section-link {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
    font-size: 0.76rem;
    font-weight: 700;
    line-height: 1.3;
    text-decoration: none;
    transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}

.input-form-section-link:hover {
    transform: translateY(-1px);
    background: rgba(255, 255, 255, 0.16);
    border-color: rgba(255, 255, 255, 0.28);
    color: #ffffff;
}

.input-form-section-link.is-operational {
    background: rgba(255, 240, 205, 0.16);
    border-color: rgba(255, 240, 205, 0.3);
}

.input-form-section-link.is-location {
    background: rgba(201, 242, 238, 0.16);
    border-color: rgba(201, 242, 238, 0.28);
}

.input-form-toolbar {
    border-left: 4px solid #11897f;
    border-radius: 18px;
}

.input-question-section {
    padding: 18px 20px 16px;
    border-radius: 18px;
    border: 1px solid #d6e5e7;
    border-top: 5px solid #178d83;
    background: #f7fbfb;
    box-shadow: none;
}

.input-question-section .question-section-badge {
    background: #ebf6f5;
    color: #116d64;
}

.input-question-section h3 {
    margin-top: 12px;
    font-size: 1.08rem;
}

.input-question-section p {
    max-width: 74ch;
}

.input-question-card {
    position: relative;
    gap: 12px;
    padding: 18px 18px 16px;
    border-radius: 18px;
    border: 1px solid #d8e3e5;
    background: #ffffff;
    box-shadow: none;
}

.input-question-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    border-radius: 18px 18px 0 0;
    background: #dbeceb;
}

.input-question-card:hover {
    border-color: #bfd5d4;
}

.input-question-card-file::before {
    background: #cfe6de;
}

.input-question-head {
    gap: 10px;
}

.input-question-meta {
    gap: 10px;
}

.input-question-meta > div {
    display: grid;
    gap: 5px;
}

.input-question-index {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 12px;
    border: 1px solid #d4e3e2;
    background: #edf5f4;
    color: #0f756c;
    box-shadow: none;
}

.input-question-card .question-label {
    font-size: 1rem;
    line-height: 1.45;
}

.input-question-guide {
    margin: 0;
    color: #6a8488;
    font-size: 0.88rem;
    line-height: 1.55;
}

.input-question-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.input-question-chip {
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid #d7e2e4;
    background: #f4f7f7;
    color: #4f6c71;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.input-question-chip.type {
    background: #eff6f6;
    border-color: #d6e3e3;
    color: #55777c;
}

.input-question-chip.required {
    background: #fff7e7;
    border-color: #edd9a7;
    color: #8d6d12;
}

.input-question-control {
    gap: 10px;
}

.input-question-card input,
.input-question-card select,
.input-question-card textarea {
    padding: 13px 14px;
    border: 1px solid #cfdbde;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: inset 0 1px 2px rgba(15, 66, 69, 0.04);
    font-size: 0.96rem;
}

.input-question-card input:focus,
.input-question-card select:focus,
.input-question-card textarea:focus {
    border-color: #159388;
    box-shadow: 0 0 0 3px rgba(21, 147, 136, 0.12);
    outline: none;
}

.input-question-card textarea {
    min-height: 128px;
}

.choice-group,
.input-question-card .checkbox-group {
    grid-template-columns: 1fr;
    gap: 8px;
}

.choice-card,
.checkbox-card {
    min-height: 0;
    padding: 11px 13px;
    border-radius: 12px;
    border: 1px solid #d4dfe2;
    background: #ffffff;
    box-shadow: none;
    transform: none;
}

.choice-card:hover,
.checkbox-card:hover {
    border-color: #b9d0cf;
    background: #fbfdfd;
    box-shadow: none;
    transform: none;
}

.choice-card.selected,
.choice-card:has(input:checked),
.checkbox-card:has(input:checked) {
    border-color: #149083;
    background: #f5fbfa;
    box-shadow: none;
}

.choice-card span,
.checkbox-card span {
    font-size: 0.94rem;
    line-height: 1.5;
}

.input-file-help {
    color: #6f888d;
}

.input-location-card {
    border: 1px solid #d6e5e5;
    background: linear-gradient(180deg, #f9fcfc 0%, #f3f8f7 100%);
}

@media (max-width: 760px) {
    .input-form-hero-copy {
        padding: 18px;
    }

    .input-form-tags {
        gap: 8px;
    }

    .input-question-card,
    .input-location-card,
    .input-question-section {
        border-radius: 16px;
    }

    .input-question-card::before {
        border-radius: 16px 16px 0 0;
    }

    .input-question-head {
        gap: 10px;
    }
}

/* 2026-03-12 input form density refinement */
.input-form-shell {
    padding: 20px;
}

.input-form-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.22fr) minmax(280px, 0.78fr);
    gap: 12px;
    align-items: start;
    margin-bottom: 14px;
}

.input-form-hero-copy {
    padding: 18px 20px;
}

.input-form-eyebrow,
.input-form-tag {
    min-height: 30px;
}

.input-form-shell .input-form-hero-copy h2 {
    margin: 10px 0 8px;
    line-height: 1.06;
}

.input-form-shell .input-form-hero-copy p {
    font-size: 0.95rem;
    line-height: 1.58;
}

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

.input-stat-card {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-height: 112px;
    padding: 14px;
    gap: 6px;
    border: 1px solid #d7e7e8;
    background: linear-gradient(180deg, #ffffff 0%, #f7fbfb 100%);
    box-shadow: none;
}

.input-stat-card small:first-child {
    margin: 0;
    color: #5e797d;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.input-stat-card strong {
    display: block;
    margin: 2px 0 0;
    color: #0e5f61;
    font-size: clamp(1.5rem, 2vw, 1.95rem);
    line-height: 1;
}

.input-stat-card small {
    margin: 0;
    color: #4c6a6e;
    line-height: 1.45;
}

.input-stat-card small:last-child {
    margin-top: auto;
    font-size: 0.84rem;
}

.input-form-toolbar {
    gap: 12px;
    margin: 2px 0 0;
    padding: 14px 16px;
}

.input-form-toolbar-copy small {
    margin-top: 4px;
    line-height: 1.45;
}

.input-form-toolbar-chips,
.input-question-chips {
    gap: 6px;
}

.input-toolbar-chip,
.input-question-chip,
.input-draft-badge {
    min-height: 28px;
    padding: 0 10px;
    font-size: 0.72rem;
}

.input-form-grid {
    gap: 12px;
}

.input-question-section {
    margin-top: 4px;
    padding: 14px 16px 13px;
}

.input-question-section h3 {
    margin: 8px 0 4px;
}

.input-question-section p {
    font-size: 0.88rem;
    line-height: 1.45;
}

.input-question-card {
    gap: 10px;
    padding: 14px 15px 13px;
}

.input-question-head {
    gap: 8px;
}

.input-question-meta {
    gap: 8px;
}

.input-question-meta > div {
    gap: 3px;
}

.input-question-index {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
    font-size: 0.78rem;
}

.input-question-card .question-label {
    margin-top: 0;
    font-size: 0.97rem;
    line-height: 1.38;
}

.input-question-guide {
    font-size: 0.83rem;
    line-height: 1.42;
}

.input-question-control {
    gap: 8px;
}

.input-question-card input,
.input-question-card select,
.input-question-card textarea {
    padding: 11px 12px;
}

.input-question-card textarea {
    min-height: 104px;
}

.choice-group,
.input-question-card .checkbox-group {
    gap: 6px;
}

.choice-card,
.checkbox-card {
    padding: 9px 11px;
}

.nutrition-status-grid {
    gap: 8px;
}

.nutrition-status-card {
    padding: 12px;
}

.nutrition-status-card-body {
    gap: 10px;
}

.nutrition-status-copy small {
    line-height: 1.35;
}

.nutrition-status-legend {
    gap: 8px 12px;
    margin-top: 6px;
}

.input-location-card {
    margin-top: 4px;
    padding: 16px;
}

.input-location-head {
    gap: 12px;
}

.input-location-head p {
    margin-top: 6px;
    line-height: 1.5;
}

.input-location-grid {
    gap: 10px;
    margin-top: 10px;
}

.input-form-actions {
    margin-top: 0;
    padding-top: 0;
}

.input-draft-card {
    margin-top: 12px;
    padding: 18px;
}

.input-draft-head {
    gap: 10px;
}

.input-draft-card .table-wrap {
    margin-top: 4px;
}

@media (max-width: 1180px) {
    .input-form-shell {
        padding: 18px;
    }
}

@media (max-width: 760px) {
    .input-form-shell,
    .input-draft-card {
        padding: 16px;
    }

    .input-form-hero-copy {
        padding: 16px;
    }

    .input-form-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .input-stat-card {
        min-height: 92px;
        padding: 12px;
    }

    .input-question-card,
    .input-location-card,
    .input-question-section {
        padding-left: 13px;
        padding-right: 13px;
    }

    .input-question-chips,
    .input-form-toolbar-chips {
        gap: 5px;
    }
}

/* 2026-03-12 input map device and patient location */
.input-location-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 2px 0 4px;
}

.input-location-summary-card {
    display: grid;
    gap: 6px;
    padding: 13px 14px;
    border: 1px solid #d6e4e6;
    border-radius: 14px;
    background: #ffffff;
}

.input-location-summary-card.highlight {
    background: linear-gradient(180deg, #f7fcfb 0%, #eef8f6 100%);
    border-color: #cde1df;
}

.input-location-summary-card span {
    color: #638086;
    font-size: 0.73rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.input-location-summary-card strong {
    color: #153b40;
    font-size: 0.94rem;
    line-height: 1.4;
    word-break: break-word;
}

.input-location-summary-card small {
    color: #6f888d;
    line-height: 1.42;
}

.input-location-actions-row {
    flex-wrap: wrap;
    align-items: stretch;
    margin-bottom: 8px;
}

.input-location-actions-row .btn-soft {
    min-height: 42px;
}

.input-location-actions-row .btn-soft.is-picking {
    background: #eaf7f4;
    border-color: #9fd3ca;
    color: #0f776c;
}

.input-location-feedback-row {
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px 12px;
}

.input-location-feedback-row .geo-status {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    background: #f5f8f8;
    border: 1px solid #d8e4e5;
}

.geo-status[data-state="info"] {
    color: #4d6d73;
}

.input-location-map-wrap {
    margin-top: 2px;
}

.mini-input-map.is-picking {
    box-shadow: inset 0 0 0 2px rgba(17, 143, 130, 0.28);
    cursor: crosshair;
}

@media (max-width: 980px) {
    .input-location-summary-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .input-location-actions-row {
        display: grid;
        grid-template-columns: 1fr;
    }

    .input-location-feedback-row {
        display: grid;
        grid-template-columns: 1fr;
    }

    .input-location-feedback-row .geo-status {
        width: 100%;
        justify-content: center;
        text-align: center;
    }
}

/* 2026-03-12 input form anti-gap layout */
.input-form-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    align-items: start;
}

.input-form-grid > * {
    align-self: start;
}

.input-question-card,
.input-question-section,
.input-location-card,
.input-form-toolbar,
.input-form-actions {
    align-self: start;
}

.input-question-card {
    align-content: start;
}

.input-question-control {
    align-items: start;
}

.input-question-card input,
.input-question-card select,
.input-question-card textarea,
.input-question-card .choice-group,
.input-question-card .checkbox-group {
    align-self: start;
}

/* 2026-03-12 input form two-column compact layout */
.input-form-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: flex-start;
}

.input-form-grid > * {
    flex: 0 0 calc(50% - 5px);
    min-width: 0;
}

.input-form-grid > .full {
    flex-basis: 100%;
}

.input-question-card,
.input-question-section,
.input-location-card,
.input-form-toolbar,
.input-form-actions {
    width: 100%;
}

@media (max-width: 900px) {
    .input-form-grid > * {
        flex-basis: 100%;
    }
}

/* 2026-03-12 login minimal without public chrome */
.login-page-minimal {
    min-height: 100vh;
}

.login-page-minimal .login-shell {
    padding-top: 40px;
    padding-bottom: 40px;
}

/* 2026-03-12 login page without public header footer */
.login-page-minimal .auth-page-header,
.login-page-minimal .public-footer,
.login-page-minimal .public-footer.premium {
    display: none !important;
}

.login-page-minimal .login-shell {
    min-height: 100vh;
    margin: 0 auto;
    padding-top: 0;
    padding-bottom: 0;
    align-content: center;
}

/* 2026-03-12 stable public header */
.public-header,
.public-header-shell,
.public-header .public-brand,
.auth-header-shell .public-brand,
.public-brand-media,
.public-brand .public-brand-media img,
.public-brand-title,
.public-brand-subtitle {
    transition: none !important;
}

@media (max-width: 960px) {
    .public-header {
        position: static;
        padding: 14px 0 6px;
        background: linear-gradient(180deg, rgba(236, 244, 242, 0.98), rgba(236, 244, 242, 0.92));
    }

    .public-header.is-condensed {
        padding-top: 14px;
    }

    .public-header-shell {
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
}

/* 2026-03-12 login shell without white wrapper */
.login-page-minimal .login-shell {
    width: min(1080px, 100%);
    background: transparent;
    border: none;
    box-shadow: none;
    overflow: visible;
    align-items: start;
    gap: 16px;
}

.login-page-minimal .login-showcase {
    height: 100%;
    border: 1px solid rgba(14, 122, 112, 0.18);
    border-radius: 22px;
    box-shadow: 0 18px 34px rgba(10, 66, 69, 0.12);
}

.login-page-minimal .login-card {
    border: 1px solid #d7e7e4;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 18px 34px rgba(10, 66, 69, 0.1);
}

@media (max-width: 860px) {
    .login-page-minimal .login-shell {
        gap: 12px;
    }
}

/* 2026-03-12 WA Sender auto-target by posyandu area */
.wa-template-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
}

.wa-template-card {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 180px;
    padding: 18px;
    border-radius: 20px;
    border: 1px solid #cfe2df;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbfb 100%);
    color: #12353a;
    text-decoration: none;
    box-shadow: 0 18px 34px rgba(11, 78, 72, 0.08);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.wa-template-card:hover,
.wa-template-card.active {
    transform: translateY(-2px);
    border-color: #0f9384;
    box-shadow: 0 24px 44px rgba(11, 78, 72, 0.16);
}

.wa-template-card-badge {
    display: inline-flex;
    align-self: flex-start;
    min-height: 28px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(13, 143, 130, 0.1);
    color: #0d8277;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.wa-template-card h4 {
    margin: 0;
    font-size: 1.08rem;
    color: #14383d;
}

.wa-template-card p,
.wa-template-card small {
    margin: 0;
    color: #5f7a7f;
}

.wa-template-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    color: #355b60;
    font-size: 0.9rem;
    font-weight: 600;
}

.wa-autofill-grid {
    margin-bottom: 18px;
}

.wa-recipient-table td {
    vertical-align: top;
}

.wa-recipient-table td small {
    display: block;
    margin-top: 4px;
    color: #668287;
}

.wa-status-badge {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 12px;
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 700;
    border: 1px solid transparent;
    white-space: nowrap;
}

.wa-status-badge.ready {
    background: rgba(25, 161, 112, 0.12);
    color: #147753;
    border-color: rgba(25, 161, 112, 0.24);
}

.wa-status-badge.warning {
    background: rgba(232, 161, 32, 0.14);
    color: #946200;
    border-color: rgba(232, 161, 32, 0.28);
}

.wa-status-badge.muted {
    background: rgba(123, 145, 151, 0.14);
    color: #53696e;
    border-color: rgba(123, 145, 151, 0.22);
}

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

    .wa-template-card {
        min-height: auto;
    }
}

/* 2026-03-12 self-service account profile */
.user-chip-link {
    text-decoration: none;
    color: inherit;
}

.user-chip-link:hover {
    border-color: #0f9384;
    box-shadow: 0 12px 24px rgba(10, 119, 109, 0.14);
}

.profile-shell {
    display: grid;
    grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
    gap: 22px;
    align-items: start;
}

.profile-summary-card {
    border-radius: 24px;
    border: 1px solid #d4e6e3;
    background: linear-gradient(180deg, #ffffff 0%, #f6fbfa 100%);
    box-shadow: 0 24px 48px rgba(10, 58, 55, 0.08);
    padding: 24px;
}

.profile-summary-media {
    display: flex;
    justify-content: center;
    margin-bottom: 18px;
}

.profile-summary-photo,
.profile-summary-avatar {
    width: 110px;
    height: 110px;
    border-radius: 28px;
    object-fit: cover;
    background: linear-gradient(180deg, #0f9384 0%, #0b7369 100%);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 2.4rem;
    font-weight: 800;
    box-shadow: 0 20px 36px rgba(10, 119, 109, 0.2);
}

.profile-summary-copy {
    text-align: center;
    margin-bottom: 18px;
}

.profile-summary-copy h3 {
    margin: 0 0 6px;
    color: #12353b;
    font-size: 1.3rem;
}

.profile-summary-copy p,
.profile-summary-copy small {
    display: block;
    margin: 0;
    color: #648085;
}

.profile-summary-meta {
    display: grid;
    gap: 14px;
}

.profile-summary-meta div {
    padding: 14px 16px;
    border-radius: 18px;
    background: #f4f9f8;
    border: 1px solid #d7e8e5;
}

.profile-summary-meta span {
    display: block;
    margin-bottom: 4px;
    color: #6d878b;
    font-size: 0.84rem;
}

.profile-summary-meta strong {
    color: #17373d;
    font-size: 0.98rem;
}

.profile-editor-stack {
    display: grid;
    gap: 22px;
}

.profile-section-card {
    margin: 0;
}

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

/* 2026-03-13 history photo answers */
.history-answer-item-file {
    gap: 10px;
}

.history-answer-media {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 12px;
    border-radius: 18px;
    border: 1px solid #d8e8e5;
    background: linear-gradient(180deg, #f8fbfb 0%, #eef6f5 100%);
    color: inherit;
    text-decoration: none;
}

.history-answer-media:hover {
    border-color: #a8d0ca;
    box-shadow: 0 16px 30px rgba(14, 87, 81, 0.08);
}

.history-answer-media img {
    width: 100%;
    max-height: 260px;
    object-fit: cover;
    border-radius: 14px;
    background: #e8f1ef;
}

.history-answer-media small {
    color: #5f7d81;
    font-weight: 600;
}

/* 2026-03-13 input workflow, history filter, and offline sync */
.app-toast-stack {
    position: fixed;
    top: 22px;
    right: 22px;
    z-index: 2200;
    display: flex;
    flex-direction: column;
    gap: 12px;
    pointer-events: none;
}

.app-toast {
    width: min(360px, calc(100vw - 32px));
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px;
    border-radius: 18px;
    border: 1px solid rgba(17, 78, 74, 0.14);
    background: rgba(255, 255, 255, 0.96);
    color: #15363b;
    box-shadow: 0 22px 40px rgba(11, 70, 66, 0.16);
    backdrop-filter: blur(14px);
    pointer-events: auto;
    opacity: 0;
    transform: translate3d(0, -14px, 0) scale(0.98);
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.app-toast.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
}

.app-toast.is-leaving {
    opacity: 0;
    transform: translate3d(0, -8px, 0) scale(0.98);
}

.app-toast.success {
    border-color: rgba(29, 145, 98, 0.22);
    background: linear-gradient(180deg, rgba(246, 255, 251, 0.98) 0%, rgba(237, 250, 244, 0.98) 100%);
}

.app-toast.error {
    border-color: rgba(212, 83, 79, 0.22);
    background: linear-gradient(180deg, rgba(255, 249, 249, 0.98) 0%, rgba(255, 239, 239, 0.98) 100%);
}

.app-toast.warning,
.app-toast.info {
    border-color: rgba(210, 157, 43, 0.22);
    background: linear-gradient(180deg, rgba(255, 252, 244, 0.98) 0%, rgba(255, 247, 226, 0.98) 100%);
}

.app-toast-copy {
    display: grid;
    gap: 4px;
}

.app-toast-copy strong {
    color: #12353b;
    font-size: 0.96rem;
}

.app-toast-copy span {
    color: #4e6e74;
    font-size: 0.92rem;
    line-height: 1.5;
}

.app-toast-close {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 12px;
    background: rgba(18, 53, 59, 0.08);
    color: #35555a;
    cursor: pointer;
}

.input-inline-alert {
    margin-bottom: 16px;
}

.input-utility-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    align-items: start;
    margin-bottom: 20px;
}

.input-utility-grid > .table-card {
    margin: 0;
    min-height: 100%;
}

.input-draft-card-top .table-wrap {
    max-height: 320px;
    overflow: auto;
}

.input-history-mini-card {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.input-history-name-list {
    display: grid;
    gap: 10px;
    max-height: 276px;
    overflow: auto;
    padding-right: 4px;
}

.input-history-name-item {
    display: flex;
    align-items: center;
    min-height: 52px;
    padding: 0 14px;
    border-radius: 16px;
    border: 1px solid #d8e8e5;
    background: linear-gradient(180deg, #ffffff 0%, #f7fbfb 100%);
    color: #17373d;
    font-weight: 700;
    text-decoration: none;
    transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.input-history-name-item:hover {
    transform: translateY(-1px);
    border-color: #a7cfc9;
    box-shadow: 0 14px 28px rgba(13, 88, 81, 0.08);
}

.input-history-empty {
    min-height: 160px;
    display: grid;
    place-items: center;
}

.input-utility-empty {
    display: grid;
    gap: 10px;
    align-content: center;
    align-items: start;
    justify-items: start;
    text-align: left;
    min-height: 0;
    padding: 0;
}

.input-utility-empty strong {
    color: #12353b;
    font-size: 1rem;
}

.input-utility-empty p {
    margin: 0;
    color: #5d7a7f;
    line-height: 1.6;
}

.input-utility-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.input-form-grid.is-submitting {
    opacity: 0.92;
}

.input-form-grid.is-submitting .btn-primary,
.input-form-grid.is-submitting .btn-soft {
    pointer-events: none;
}

/* 2026-03-24 input section accordion */
.input-section-accordion {
    padding: 0;
    overflow: hidden;
    border-radius: 20px;
    border: 1px solid #d6e5e7;
    background: linear-gradient(180deg, #f8fcfc 0%, #eef7f6 100%);
    box-shadow: 0 10px 24px rgba(13, 89, 81, 0.04);
}

.input-section-accordion[open] {
    border-color: #b9d8d5;
    box-shadow: 0 18px 38px rgba(13, 89, 81, 0.08);
}

.input-section-accordion.input-location-card {
    margin-top: 10px;
    padding: 0;
}

.input-section-summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px 16px;
}

.input-section-summary::-webkit-details-marker,
.input-section-summary::marker {
    display: none;
}

.input-section-summary:focus-visible {
    outline: 3px solid rgba(17, 137, 127, 0.2);
    outline-offset: -3px;
}

.input-section-summary-main {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    min-width: 0;
}

.input-section-summary-copy {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.input-section-summary-copy h3 {
    margin: 0;
    font-size: 1.08rem;
    color: #14383d;
}

.input-section-summary-copy p {
    margin: 0;
    color: #638186;
    line-height: 1.58;
    max-width: 72ch;
}

.input-section-summary-side {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-shrink: 0;
}

.input-section-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 6px 12px;
    border-radius: 999px;
    border: 1px solid #d5e3e4;
    background: #f6faf9;
    color: #4f6c71;
    font-size: 0.75rem;
    font-weight: 700;
    white-space: nowrap;
}

.input-section-chip.required {
    border-color: #cfe3df;
    background: #edf8f6;
    color: #126f65;
}

.input-section-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    padding: 6px 12px;
    border-radius: 999px;
    border: 1px solid #cfe0df;
    background: #ffffff;
    color: #16555b;
    font-size: 0.78rem;
    font-weight: 700;
    white-space: nowrap;
}

.input-section-toggle i {
    transition: transform 0.22s ease;
}

.input-section-accordion[open] .input-section-toggle i {
    transform: rotate(180deg);
}

.input-section-toggle-open {
    display: none;
}

.input-section-accordion[open] .input-section-toggle-open {
    display: inline;
}

.input-section-accordion[open] .input-section-toggle-closed {
    display: none;
}

.input-section-body {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 0 18px 18px;
    border-top: 1px solid #e0eceb;
}

.input-section-body > * {
    flex: 0 0 calc(50% - 5px);
    min-width: 0;
    align-self: start;
}

.input-section-body > .full {
    flex-basis: 100%;
}

.input-section-body .input-question-card {
    margin: 0;
}

.input-section-body-location {
    padding-top: 18px;
}

.input-section-body-location > * {
    flex-basis: 100%;
}

.input-section-accordion .question-section-badge {
    align-self: flex-start;
    margin-top: 2px;
}

@media (max-width: 900px) {
    .input-section-body > * {
        flex-basis: 100%;
    }
}

@media (max-width: 860px) {
    .input-section-summary {
        display: grid;
        grid-template-columns: 1fr;
    }

    .input-section-summary-side {
        justify-content: flex-start;
    }
}

@media (max-width: 760px) {
    .input-section-accordion,
    .input-section-accordion.input-location-card {
        border-radius: 16px;
    }

    .input-section-summary {
        padding: 16px;
    }

    .input-section-body {
        padding: 0 16px 16px;
    }
}

.history-toolbar {
    align-items: flex-end;
    gap: 18px;
}

.history-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
}

.history-actions .search-inline.compact {
    min-width: min(320px, 100%);
}

.history-summary-grid {
    align-items: stretch;
}

.history-summary-card,
.history-export-summary-card {
    min-height: 100%;
}

.history-record-card {
    overflow: hidden;
}

.history-record-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 16px;
}

.history-record-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
    flex-wrap: wrap;
}

.history-export-actions,
.history-record-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.history-record-grid {
    display: grid;
    grid-template-columns: minmax(280px, 0.88fr) minmax(0, 1.12fr);
    gap: 18px;
    align-items: start;
}

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

.history-answer-item.wide,
.history-answer-item-file {
    grid-column: 1 / -1;
}

@media (max-width: 1180px) {
    .input-utility-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .history-record-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .content-area {
        gap: 16px;
        padding: 16px 14px 94px;
    }

    .content-area > .form-card,
    .content-area > .table-card {
        border-radius: 22px;
    }

    .table-head {
        gap: 14px;
    }

    .table-actions {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .table-actions .btn-primary,
    .table-actions .btn-soft,
    .table-actions .search-inline.compact {
        width: 100%;
    }

    .app-toast-stack {
        top: 14px;
        left: 14px;
        right: 14px;
    }

    .app-toast {
        width: 100%;
    }

    .input-utility-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .input-draft-head {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .input-draft-card-top .table-wrap,
    .input-history-name-list {
        max-height: none;
    }

    .history-toolbar,
    .history-actions,
    .history-record-toolbar,
    .history-export-actions,
    .history-record-actions {
        width: 100%;
    }

    .history-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .history-actions .search-inline.compact,
    .history-actions .btn-primary,
    .history-actions .btn-soft {
        width: 100%;
    }

    .history-record-meta {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .history-answer-grid {
        grid-template-columns: 1fr;
    }
}

/* 2026-03-14 dependent inputs and ordered history table */
.input-question-dependent {
    position: relative;
    border-style: dashed;
    border-color: #b8d9d5;
    background: linear-gradient(180deg, rgba(243, 250, 249, 0.98) 0%, rgba(236, 247, 245, 0.98) 100%);
}

.input-question-dependent::before {
    background: linear-gradient(90deg, #0d8f82 0%, #6dc9bb 100%);
    opacity: 0.72;
}

.input-question-dependent .input-question-index {
    background: #e6f6f3;
    color: #0f6e65;
}

.input-question-dependent.is-hidden {
    display: none;
}

.input-question-dependent .input-question-guide {
    color: #4f7473;
}

.history-record-summary {
    align-content: start;
}

.history-summary-item.highlight {
    border-color: #97d9ca;
    background: linear-gradient(180deg, #eefaf7 0%, #ddf4ef 100%);
}

.history-summary-item.highlight strong {
    color: #0d5f57;
}

.history-answer-panel {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}

.history-answer-panel-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    border: 1px solid #d8e8e5;
    border-radius: 18px;
    background: linear-gradient(180deg, #fbfdfd 0%, #f2f8f7 100%);
}

.history-answer-panel-head h4 {
    margin: 0 0 4px;
    font-size: 1rem;
    color: #13383a;
}

.history-answer-panel-head p {
    margin: 0;
    color: #6a8285;
    font-size: 0.88rem;
    line-height: 1.55;
}

.history-answer-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 86px;
    padding: 8px 12px;
    border-radius: 999px;
    background: #e8f6f3;
    color: #0e6b63;
    font-weight: 700;
    font-size: 0.8rem;
    white-space: nowrap;
}

.history-answer-table-wrap {
    overflow: hidden;
    border: 1px solid #d6e5e2;
    border-radius: 20px;
    background: #ffffff;
}

.history-answer-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.history-answer-table th,
.history-answer-table td {
    padding: 12px 14px;
    border-bottom: 1px solid #e2efec;
    vertical-align: top;
    text-align: left;
}

.history-answer-table thead th {
    background: #eff7f5;
    color: #163c3e;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.01em;
}

.history-answer-table tbody tr:last-child td {
    border-bottom: none;
}

.history-answer-table .col-no {
    width: 64px;
    text-align: center;
    white-space: nowrap;
    color: #265456;
    font-weight: 700;
}

.history-answer-table .col-question {
    width: 38%;
    color: #17393b;
    font-weight: 600;
}

.history-answer-table .col-answer {
    color: #284346;
}

.history-answer-text {
    white-space: pre-line;
    line-height: 1.65;
}

.history-answer-media-inline {
    max-width: 320px;
}

.history-answer-media-inline img {
    max-height: 220px;
    object-fit: contain;
    background: #f4f9f8;
}

@media (max-width: 1180px) {
    .history-answer-panel-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .history-answer-count {
        min-width: 0;
    }
}

@media (max-width: 760px) {
    .history-answer-panel-head {
        padding: 14px;
    }

    .history-answer-table-wrap {
        border-radius: 18px;
    }

    .history-answer-table,
    .history-answer-table thead,
    .history-answer-table tbody,
    .history-answer-table tr,
    .history-answer-table th,
    .history-answer-table td {
        display: block;
        width: 100%;
    }

    .history-answer-table thead {
        display: none;
    }

    .history-answer-table tbody {
        display: flex;
        flex-direction: column;
    }

    .history-answer-table tr {
        padding: 14px;
        border-bottom: 1px solid #e2efec;
    }

    .history-answer-table tbody tr:last-child {
        border-bottom: none;
    }

    .history-answer-table td {
        padding: 0;
        border: none;
    }

    .history-answer-table td + td {
        margin-top: 10px;
    }

    .history-answer-table td::before {
        content: attr(data-label);
        display: block;
        margin-bottom: 4px;
        color: #648082;
        font-size: 0.74rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    .history-answer-table .col-no {
        text-align: left;
        width: 100%;
    }

    .history-answer-table .col-question,
    .history-answer-table .col-answer {
        width: 100%;
    }

    .history-answer-media-inline {
        max-width: 100%;
    }
}

/* 2026-03-14 global responsive polish */
:root {
    --sigap-shell-max: 1380px;
    --sigap-shell-max-public: 1320px;
    --sigap-shell-gap: clamp(12px, 2vw, 24px);
    --sigap-card-radius: clamp(18px, 2vw, 24px);
}

.topbar,
.layout-with-sidebar,
.site-footer-internal,
.site-footer,
.public-header-shell,
.public-main,
.login-shell,
.page-shell {
    width: min(var(--sigap-shell-max), calc(100% - (var(--sigap-shell-gap) * 2)));
}

.public-header-shell,
.public-main,
.page-shell,
.site-footer {
    width: min(var(--sigap-shell-max-public), calc(100% - (var(--sigap-shell-gap) * 2)));
}

.topbar,
.layout-with-sidebar,
.public-hero-grid,
.public-map-grid,
.public-schedule-grid,
.public-feature-grid,
.public-kpi-grid,
.input-form-hero,
.input-utility-grid,
.history-record-grid,
.history-summary-grid,
.dashboard-analytics-grid,
.dashboard-admin-grid,
.dashboard-command-grid,
.dashboard-ops-grid,
.dashboard-focus-grid,
.dashboard-quality-grid,
.site-footer-grid,
.site-footer-internal .site-footer-grid {
    align-items: start;
}

.topbar > *,
.layout-with-sidebar > *,
.public-hero-grid > *,
.public-map-grid > *,
.public-schedule-grid > *,
.public-feature-grid > *,
.public-kpi-grid > *,
.input-form-hero > *,
.input-utility-grid > *,
.history-record-grid > *,
.history-summary-grid > *,
.dashboard-analytics-grid > *,
.dashboard-admin-grid > *,
.dashboard-command-grid > *,
.dashboard-ops-grid > *,
.dashboard-focus-grid > *,
.dashboard-quality-grid > *,
.site-footer-grid > *,
.site-footer-internal .site-footer-grid > * {
    min-width: 0;
}

.topbar {
    margin: 14px auto 0;
    padding: clamp(14px, 1.6vw, 20px);
    gap: clamp(14px, 1.8vw, 22px);
    grid-template-columns: minmax(240px, 300px) minmax(0, 1fr) auto;
    border-radius: 24px;
}

.topbar-actions {
    justify-self: end;
    min-width: 0;
}

.topbar-tools,
.topbar-profile {
    flex-wrap: wrap;
}

.topbar-tools {
    justify-content: flex-end;
}

.topbar-profile {
    justify-content: flex-end;
}

.internal-body .topbar {
    background: linear-gradient(180deg, #e4fff0 0%, #f6fffb 100%);
    border: 1px solid #c9eedf;
    box-shadow: 0 10px 24px rgba(13, 143, 130, 0.08);
    border-radius: 14px;
    padding: 12px 16px;
}
.internal-body .topbar-main {
    gap: 12px;
    align-items: center;
}
.internal-body .topbar-heading-copy h2 {
    color: #174235;
    font-size: 1.22rem;
}
.internal-body .topbar-heading-copy p {
    color: #37725e;
}
.internal-body .topbar-profile,
.internal-body .topbar-tools {
    background: #ffffff;
    border: 1px solid #d8f1e6;
    border-radius: 12px;
    padding: 6px 10px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);
}
.internal-body .topbar-profile .user-chip {
    border: none;
    background: transparent;
}
.layout-with-sidebar {
    width: min(var(--sigap-shell-max), calc(100% - (var(--sigap-shell-gap) * 2)));
    grid-template-columns: 280px minmax(0, 1fr);
    gap: clamp(16px, 2vw, 24px);
    margin: clamp(14px, 2vw, 22px) auto;
}

.sidebar {
    align-self: start;
    min-width: 0;
}

.content-area {
    min-width: 0;
    gap: clamp(16px, 2vw, 22px);
    padding: 0;
}

.form-card,
.table-card,
.mobile-app-card,
.dashboard-card,
.history-record-card {
    border-radius: var(--sigap-card-radius);
    overflow: hidden;
}

.form-card,
.table-card,
.mobile-app-card {
    padding: clamp(18px, 2vw, 24px);
}

.table-wrap {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}

.table-wrap table {
    min-width: 720px;
}

.history-card-list,
.admin-feed-list,
.input-history-name-list,
.input-draft-card-top .table-wrap,
.dashboard-scroll-card .admin-feed-list {
    scrollbar-width: thin;
}

.public-main {
    margin: 0 auto 28px;
    padding-top: 10px;
}

.public-hero-grid {
    grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
    gap: clamp(18px, 2vw, 26px);
}

.public-map-grid {
    grid-template-columns: minmax(0, 1.2fr) minmax(300px, 0.8fr);
    gap: clamp(18px, 2vw, 24px);
}

.public-kpi-grid,
.public-feature-grid {
    gap: clamp(14px, 1.6vw, 18px);
}

.public-schedule-card,
.public-feature-card,
.public-map-aside-card,
.public-kpi-card {
    border-radius: 22px;
}

.login-shell {
    margin: 20px auto 32px;
    min-height: auto;
    align-items: stretch;
    gap: 20px;
}

.login-showcase,
.login-card {
    min-width: 0;
}

.site-footer-shell,
.site-footer-internal .site-footer-shell {
    gap: 18px;
}

.site-footer-grid,
.site-footer-internal .site-footer-grid {
    gap: 16px;
}

@media (max-width: 1199px) {
    .topbar {
        grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
        grid-template-areas:
            "brand actions"
            "heading heading";
    }

    .topbar-brand {
        grid-area: brand;
    }

    .topbar-heading {
        grid-area: heading;
    }

    .topbar-actions {
        grid-area: actions;
        justify-self: end;
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .layout-with-sidebar {
        grid-template-columns: 252px minmax(0, 1fr);
    }

    .public-hero-grid,
    .public-map-grid,
    .dashboard-analytics-grid,
    .dashboard-admin-grid,
    .dashboard-ops-grid,
    .dashboard-focus-grid,
    .dashboard-quality-grid {
        grid-template-columns: 1fr;
    }

    .input-utility-grid,
    .history-summary-grid,
    .public-feature-grid,
    .public-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991px) and (min-width: 768px) {
    .topbar {
        grid-template-columns: 1fr;
        grid-template-areas:
            "brand"
            "heading"
            "actions";
    }

    .topbar-actions {
        justify-self: stretch;
    }

    .topbar-tools,
    .topbar-profile {
        justify-content: flex-start;
    }

    .layout-with-sidebar {
        grid-template-columns: 1fr;
    }

    .sidebar {
        position: static;
        top: auto;
    }

    .sidebar-top {
        display: flex;
        flex-wrap: nowrap;
        gap: 8px;
        overflow-x: auto;
        padding: 14px;
    }

    .sidebar-title {
        flex: 0 0 100%;
        width: 100%;
    }

    .sidebar-link {
        flex: 0 0 auto;
        min-width: max-content;
    }

    .site-footer-grid,
    .site-footer-internal .site-footer-grid,
    .input-utility-grid,
    .history-summary-grid,
    .public-kpi-grid,
    .public-feature-grid {
        grid-template-columns: 1fr;
    }

    .login-shell {
        width: min(var(--sigap-shell-max-public), calc(100% - 24px));
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .public-main,
    .login-shell,
    .page-shell,
    .public-header-shell,
    .site-footer {
        width: min(var(--sigap-shell-max-public), calc(100% - 16px));
    }

    .content-area {
        padding: 0 0 96px;
        gap: 14px;
    }

    .form-card,
    .table-card,
    .mobile-app-card,
    .dashboard-card,
    .input-form-shell {
        padding: 16px;
        border-radius: 20px;
    }

    .input-form-hero,
    .history-record-grid,
    .public-hero-grid,
    .public-map-grid,
    .public-schedule-grid,
    .dashboard-analytics-grid,
    .dashboard-admin-grid,
    .dashboard-command-grid,
    .dashboard-ops-grid,
    .dashboard-focus-grid,
    .dashboard-quality-grid {
        grid-template-columns: 1fr;
    }

    .hero-search,
    .search-inline,
    .history-actions .search-inline.compact {
        width: 100%;
        min-width: 0;
    }

    .history-record-toolbar,
    .history-export-actions,
    .history-record-actions,
    .input-form-actions,
    .table-actions {
        width: 100%;
    }

    .history-export-actions > *,
    .history-record-actions > *,
    .input-form-actions > *,
    .table-actions > *,
    .site-footer-actions > *,
    .site-footer-internal .site-footer-actions > * {
        width: 100%;
    }

    .public-schedule-card,
    .public-feature-card,
    .public-map-aside-card,
    .public-kpi-card,
    .site-footer-card,
    .site-footer-internal .site-footer-card {
        border-radius: 18px;
    }

    .table-wrap table {
        min-width: 640px;
    }
}

/* 2026-03-14 targeted cleanup for input page */
.input-page-content .input-form-shell {
    padding: 20px;
}

.input-page-content .input-form-hero {
    grid-template-columns: minmax(0, 1.32fr) minmax(340px, 0.88fr);
    gap: 16px;
    margin-bottom: 18px;
}

.input-page-content .input-form-hero-copy {
    padding: 22px 24px;
    min-height: 100%;
}

.input-page-content .input-form-shell .input-form-hero-copy h2 {
    font-size: clamp(1.9rem, 2.7vw, 2.5rem);
}

.input-page-content .input-form-shell .input-form-hero-copy p {
    max-width: 760px;
}

.input-page-content .input-form-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    align-content: start;
}

.input-page-content .input-stat-card {
    min-height: 118px;
    padding: 18px;
}

.input-page-content .input-utility-grid {
    grid-template-columns: minmax(0, 1.24fr) minmax(320px, 0.76fr);
    gap: 16px;
    margin-bottom: 18px;
}

.input-page-content .input-utility-grid > .table-card {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.input-page-content .input-draft-head {
    gap: 12px;
}

.input-page-content .input-draft-head h2 {
    margin: 0;
    font-size: 1.05rem;
}

.input-page-content .input-draft-head p {
    margin: 8px 0 0;
    font-size: 0.92rem;
    line-height: 1.55;
}

.input-page-content .input-draft-card-top .table-wrap {
    flex: 1 1 auto;
    max-height: 360px;
}

.input-page-content .input-draft-card-top .table-wrap table {
    width: 100%;
    min-width: 100%;
    table-layout: fixed;
}

.input-page-content .input-draft-card-top table th,
.input-page-content .input-draft-card-top table td {
    padding: 10px 12px;
    font-size: 0.86rem;
    vertical-align: middle;
}

.input-page-content .input-draft-card-top table th:nth-child(1),
.input-page-content .input-draft-card-top table td:nth-child(1) {
    width: 88px;
}

.input-page-content .input-draft-card-top table th:nth-child(3),
.input-page-content .input-draft-card-top table td:nth-child(3) {
    width: 124px;
}

.input-page-content .input-draft-card-top table th:nth-child(4),
.input-page-content .input-draft-card-top table td:nth-child(4) {
    width: 146px;
}

.input-page-content .input-draft-card-top table td:last-child .btn-mini {
    margin: 2px 6px 2px 0;
}

.input-page-content .input-history-mini-card {
    justify-content: flex-start;
}

.input-page-content .input-history-name-list {
    max-height: 318px;
    gap: 8px;
}

.input-page-content .input-history-name-item {
    min-height: 48px;
    padding: 0 14px;
}

.input-page-content .input-history-name-item span {
    display: block;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.input-page-content .input-utility-empty {
    min-height: 180px;
}

.input-page-content .input-utility-actions {
    margin-top: auto;
}

.input-page-content .input-form-toolbar {
    margin: 0 0 4px;
}

.input-page-content .input-location-card {
    margin-top: 8px;
    padding: 18px;
    border: 1px solid #d6e5e5;
    background: linear-gradient(180deg, #f9fcfc 0%, #f2f8f7 100%);
}

.input-page-content .input-location-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 14px;
}

.input-page-content .input-location-head-copy {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.input-page-content .input-location-head-copy .question-section-badge {
    margin: 0 0 2px;
    align-self: flex-start;
}

.input-page-content .input-location-head-copy h3 {
    margin: 0;
    font-size: 1.08rem;
}

.input-page-content .input-location-head-copy p {
    margin: 0;
    max-width: 76ch;
}

.input-page-content .input-location-head-chips {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    flex-shrink: 0;
}

.input-page-content .input-location-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1.18fr) minmax(320px, 0.82fr);
    gap: 16px;
    align-items: start;
    margin-top: 10px;
}

.input-page-content .input-location-map-panel,
.input-page-content .input-location-form-panel {
    display: grid;
    gap: 12px;
    padding: 16px;
    border: 1px solid #d7e5e6;
    border-radius: 18px;
    background: #ffffff;
    min-width: 0;
}

.input-page-content .input-location-form-panel {
    background: linear-gradient(180deg, #ffffff 0%, #f7fbfa 100%);
}

.input-page-content .input-location-form-head {
    display: grid;
    gap: 6px;
}

.input-page-content .input-location-form-head strong {
    color: #14383d;
    font-size: 1rem;
}

.input-page-content .input-location-form-head small {
    color: #648086;
    line-height: 1.56;
}

.input-page-content .input-location-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 0;
}

.input-page-content .input-location-grid > .full {
    grid-column: 1 / -1;
}

.input-page-content .input-location-grid label {
    display: block;
    margin-bottom: 6px;
}

.input-page-content .input-location-field-help {
    display: block;
    margin-top: 6px;
    color: #6f888d;
    line-height: 1.45;
}

.input-page-content .input-location-actions-row {
    margin-bottom: 0;
}

.input-page-content .input-location-actions-row .btn-soft {
    min-height: 44px;
}

.input-page-content .input-location-feedback-row {
    margin-bottom: 0;
}

.input-page-content .input-location-map-wrap {
    margin-top: 0;
}

.input-page-content .mini-input-map {
    min-height: 260px;
    height: 260px;
}

@media (max-width: 1240px) {
    .input-page-content .input-form-hero {
        grid-template-columns: 1fr;
    }

    .input-page-content .input-utility-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .input-page-content .input-utility-card-primary {
        grid-column: auto;
    }

    .input-page-content .input-location-workspace {
        grid-template-columns: 1fr;
    }

    .input-page-content .input-location-head-chips {
        justify-content: flex-start;
    }
}

@media (max-width: 760px) {
    .input-page-content .input-location-card {
        padding: 16px;
    }

    .input-page-content .input-location-head {
        display: grid;
        grid-template-columns: 1fr;
    }

    .input-page-content .input-location-workspace {
        gap: 12px;
        margin-top: 8px;
    }

    .input-page-content .input-location-map-panel,
    .input-page-content .input-location-form-panel {
        padding: 14px;
        border-radius: 16px;
    }

    .input-page-content .input-location-grid {
        grid-template-columns: 1fr;
    }

    .input-page-content .mini-input-map {
        min-height: 220px;
        height: 220px;
    }
}

@media (max-width: 767px) {
    .input-page-content .input-form-shell {
        padding: 16px;
    }

    .input-page-content .input-form-hero {
        gap: 14px;
        margin-bottom: 16px;
    }

    .input-page-content .input-form-hero-copy {
        padding: 18px;
        border-radius: 20px;
    }

    .input-page-content .input-form-shell .input-form-hero-copy h2 {
        font-size: 1.8rem;
        line-height: 1.08;
    }

    .input-page-content .input-form-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .input-page-content .input-stat-card {
        min-height: 0;
        padding: 14px;
        border-radius: 18px;
    }

    .input-page-content .input-utility-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .input-page-content .input-draft-card-top .table-wrap {
        max-height: none;
    }

    .input-page-content .input-draft-card-top .table-wrap table {
        min-width: 560px;
    }
}

@media (max-width: 560px) {
    .input-page-content .input-form-stats {
        grid-template-columns: 1fr;
    }
}

/* 2026-03-14 public portal redesign refinement */
.public-main {
    gap: 18px;
    padding-top: 12px;
    padding-bottom: 30px;
}

.public-hero,
.public-schedule-section,
.public-map-section {
    border-radius: 28px;
    box-shadow: 0 18px 34px rgba(14, 78, 73, 0.08);
}

.public-hero-grid {
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
    gap: 24px;
    padding: 26px;
    align-items: stretch;
}

.public-hero-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.public-hero-copy h2 {
    margin: 14px 0 12px;
    max-width: 720px;
    font-size: clamp(2rem, 3.2vw, 3.35rem);
    line-height: 1.02;
    letter-spacing: -0.03em;
}

.public-hero-lead {
    margin-bottom: 10px;
    font-size: clamp(1.04rem, 1.6vw, 1.28rem);
}

.public-hero-subtext {
    max-width: 640px;
    font-size: 0.98rem;
    line-height: 1.72;
}

.public-hero-actions {
    gap: 10px;
    margin-top: 22px;
}

.public-trust-row {
    gap: 10px;
    margin-top: 14px;
}

.public-trust-row span {
    min-height: 44px;
    padding: 10px 14px;
    border-radius: 14px;
    font-size: 0.9rem;
}

.public-hero-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 18px;
}

.public-hero-meta-card {
    display: grid;
    gap: 6px;
    padding: 14px 16px;
    border-radius: 18px;
    border: 1px solid #d6e8e4;
    background: linear-gradient(180deg, #ffffff 0%, #f6fbfb 100%);
}

.public-hero-meta-card span {
    color: #648184;
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.public-hero-meta-card strong {
    color: #12383d;
    font-size: 1rem;
    line-height: 1.2;
}

.public-hero-meta-card small {
    color: #698488;
    font-size: 0.84rem;
    line-height: 1.5;
}

.public-slider-card {
    padding: 14px;
    border-radius: 24px;
    box-shadow: 0 18px 30px rgba(11, 74, 69, 0.1);
}

.public-slider {
    min-height: 320px;
    border-radius: 20px;
}

.public-slider-caption {
    padding: 12px 4px 2px;
}

.public-kpi-grid {
    gap: 14px;
}

.public-kpi-card {
    padding: 18px;
    border-radius: 20px;
}

.public-kpi-card i {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    font-size: 1.1rem;
}

.public-kpi-card strong {
    font-size: clamp(1.4rem, 1.8vw, 1.8rem);
}

.public-feature-grid {
    gap: 14px;
}

.public-feature-card {
    padding: 20px 18px;
    border-radius: 20px;
}

.public-feature-card i {
    width: 48px;
    height: 48px;
    margin-bottom: 14px;
    border-radius: 16px;
    font-size: 1.18rem;
}

.public-feature-card h3 {
    font-size: 1.08rem;
}

.public-feature-card p {
    font-size: 0.92rem;
    line-height: 1.65;
}

.public-schedule-section,
.public-map-section {
    padding: 24px;
}

.public-body .section-head {
    margin-bottom: 16px;
}

.public-body .section-head h3 {
    font-size: clamp(1.4rem, 2vw, 1.9rem);
}

.public-body .section-head p {
    max-width: 420px;
    font-size: 0.9rem;
}

.public-schedule-layout {
    display: grid;
    grid-template-columns: minmax(280px, 0.86fr) minmax(0, 1.14fr);
    gap: 16px;
    align-items: stretch;
}

.public-schedule-featured {
    display: grid;
    align-content: start;
    gap: 14px;
    padding: 22px;
    border-radius: 24px;
    background: linear-gradient(135deg, #114249 0%, #0a7b72 100%);
    box-shadow: 0 24px 40px rgba(8, 80, 73, 0.2);
    color: #ffffff;
}

.public-schedule-featured-kicker {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 32px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    color: #f1e6b0;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.public-schedule-featured h4 {
    margin: 0;
    font-size: 1.4rem;
    line-height: 1.18;
}

.public-schedule-featured-meta {
    display: grid;
    gap: 10px;
}

.public-schedule-featured-meta span {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: rgba(240, 248, 248, 0.94);
    line-height: 1.55;
}

.public-schedule-featured p {
    margin: 0;
    color: rgba(238, 247, 247, 0.88);
    line-height: 1.7;
}

.public-schedule-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px;
    align-content: start;
}

.public-schedule-card {
    padding: 18px 16px;
    min-height: 100%;
}

.public-schedule-card h4 {
    font-size: 1rem;
    line-height: 1.3;
}

.public-schedule-card p {
    font-size: 0.88rem;
    line-height: 1.58;
}

.public-map-grid {
    grid-template-columns: minmax(0, 1.18fr) minmax(280px, 0.82fr);
    gap: 16px;
}

.public-map-wrap {
    min-height: 430px;
    border-radius: 22px;
}

.public-map {
    min-height: 430px;
}

.public-map-aside {
    gap: 14px;
}

.public-map-aside-card {
    padding: 18px;
    border-radius: 20px;
}

.public-map-aside-card p {
    font-size: 0.9rem;
    line-height: 1.65;
}

.public-map-aside-card.accent .btn-primary {
    min-height: 48px;
    margin-top: 14px;
}

.map-legend {
    left: 14px;
    bottom: 14px;
    padding: 12px 14px;
    border-radius: 16px;
}

.site-footer {
    border-radius: 28px;
    margin-top: 2px;
    margin-bottom: 24px;
}

.site-footer-shell {
    padding: 22px 24px 18px;
}

.site-footer-hero {
    gap: 16px;
    padding-bottom: 16px;
}

.site-footer-brand {
    width: 88px;
    min-height: 88px;
    border-radius: 22px;
}

.site-footer-copy h4 {
    font-size: 1.42rem;
}

.site-footer-copy p {
    max-width: 620px;
    font-size: 0.94rem;
    line-height: 1.58;
}

.site-footer-cta {
    min-width: 320px;
    padding: 16px;
    border-radius: 20px;
}

.site-footer-grid {
    grid-template-columns: minmax(0, 1.1fr) minmax(220px, 0.9fr) minmax(220px, 0.9fr);
    gap: 14px;
}

.site-footer-card {
    padding: 18px;
    border-radius: 20px;
}

.site-footer-bottom {
    padding-top: 2px;
}

@media (max-width: 1180px) {
    .public-hero-grid,
    .public-map-grid,
    .public-schedule-layout,
    .site-footer-hero,
    .site-footer-grid {
        grid-template-columns: 1fr;
    }

    .public-hero-meta,
    .public-kpi-grid,
    .public-feature-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

@media (max-width: 760px) {
    .public-main {
        gap: 14px;
        padding-top: 8px;
    }

    .public-hero,
    .public-schedule-section,
    .public-map-section,
    .site-footer {
        border-radius: 22px;
    }

    .public-hero-grid {
        gap: 16px;
        padding: 18px;
    }

    .public-hero-copy h2 {
        font-size: 1.9rem;
    }

    .public-hero-actions,
    .public-hero-actions > *,
    .public-hero-meta,
    .public-kpi-grid,
    .public-feature-grid,
    .public-schedule-grid,
    .site-footer-grid {
        grid-template-columns: 1fr;
    }

    .public-slider {
        min-height: 220px;
    }

    .public-schedule-section,
    .public-map-section {
        padding: 18px;
    }

    .public-map-wrap,
    .public-map {
        min-height: 300px;
    }

    .site-footer-shell {
        padding: 18px 16px 16px;
    }

    .site-footer-cta,
    .site-footer-actions,
    .site-footer-actions > * {
        width: 100%;
        min-width: 0;
    }

    .site-footer-brand {
        width: 74px;
        min-height: 74px;
    }
}

/* 2026-03-14 public portal final cleanup */
body.public-body {
    background:
        radial-gradient(circle at top left, rgba(16, 148, 134, 0.08), transparent 28%),
        linear-gradient(180deg, #f6fbfb 0%, #eef7f6 100%);
}

body.public-body .public-header {
    position: static;
    padding: 22px 0 10px;
    background: transparent;
    backdrop-filter: none;
    border: 0;
    box-shadow: none;
}

body.public-body .public-header-shell,
body.public-body .public-main {
    width: min(1320px, calc(100vw - 48px));
}

body.public-body .public-header-shell {
    display: grid;
    grid-template-columns: minmax(360px, 420px) minmax(0, 1fr);
    align-items: center;
    gap: 18px;
    padding: 14px 18px;
    border: 1px solid #d7ebe6;
    border-radius: 26px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 18px 32px rgba(10, 73, 67, 0.08);
}

body.public-body .public-brand {
    gap: 18px;
    min-height: 96px;
    padding: 16px 20px;
    border-radius: 20px;
    background: linear-gradient(135deg, #0f6e67 0%, #159588 100%);
    box-shadow: none;
}

body.public-body .public-brand-media {
    width: 82px;
    min-height: 82px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.16);
}

body.public-body .public-brand .public-brand-media img {
    width: calc(60px * var(--header-logo-scale, 1));
    max-width: 100%;
    max-height: 100%;
}

body.public-body .public-brand-copy {
    justify-content: center;
    gap: 6px;
}

body.public-body .public-brand-title {
    font-size: 1.34rem;
}

body.public-body .public-brand-subtitle {
    font-size: 0.84rem;
    line-height: 1.35;
    color: rgba(234, 248, 245, 0.82);
}

body.public-body .public-nav-drawer {
    display: flex;
    align-self: center;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    min-width: 0;
    width: 100%;
    min-height: 96px;
    justify-self: stretch;
}

body.public-body .public-nav {
    display: flex;
    flex-wrap: nowrap;
    flex: 0 1 auto;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    min-width: 0;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
}

body.public-body .public-nav::-webkit-scrollbar {
    display: none;
}

body.public-body .public-nav-link {
    min-height: 44px;
    padding: 0 16px;
    border-radius: 999px;
    border: 1px solid #d7e8e3;
    background: #ffffff;
    color: #234249;
    font-size: 0.9rem;
    font-weight: 600;
}

body.public-body .public-nav-link.active,
body.public-body .public-nav-link:hover {
    border-color: #0f8e81;
    background: #eaf8f6;
    color: #0f6d65;
}

body.public-body .public-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0;
    flex: 0 0 auto;
}

body.public-body .public-header-pill {
    display: none;
}

body.public-body .public-header .btn-soft,
body.public-body .public-header .btn-primary,
body.public-body .public-header-actions .btn-soft,
body.public-body .public-header-actions .btn-primary {
    min-height: 44px;
    padding: 0 20px;
    border-radius: 14px;
    font-size: 0.88rem;
    box-shadow: none;
}

body.public-body .public-main {
    display: grid;
    gap: 16px;
    padding-top: 6px;
    padding-bottom: 28px;
}

body.public-body .public-hero,
body.public-body .public-kpi-grid,
body.public-body .public-feature-grid,
body.public-body .public-schedule-section,
body.public-body .public-map-section,
body.public-body .site-footer.site-footer-public {
    border: 1px solid #d8ebe6;
    box-shadow: 0 18px 34px rgba(11, 76, 70, 0.08);
}

body.public-body .public-hero {
    overflow: hidden;
    border-radius: 28px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(245, 251, 250, 0.98) 100%);
}

body.public-body .public-hero-grid {
    grid-template-columns: minmax(0, 1.12fr) minmax(320px, 0.88fr);
    gap: 20px;
    padding: 22px;
    align-items: stretch;
}

body.public-body .public-hero-copy h2 {
    max-width: 640px;
    margin: 10px 0 10px;
    color: #123740;
    font-size: clamp(2.1rem, 3vw, 3.15rem);
    line-height: 1.02;
}

body.public-body .public-hero-lead {
    margin-bottom: 8px;
    color: #0b7c73;
    font-size: 1.1rem;
    font-weight: 700;
}

body.public-body .public-hero-subtext {
    max-width: 620px;
    color: #547075;
    font-size: 0.96rem;
    line-height: 1.75;
}

body.public-body .public-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

body.public-body .public-hero-actions > * {
    flex: 0 0 auto;
}

body.public-body .public-trust-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}

body.public-body .public-trust-row span {
    min-height: 40px;
    padding: 10px 14px;
    border-radius: 12px;
    border: 1px solid #d9ebe7;
    background: #f9fcfc;
    color: #547277;
    font-size: 0.85rem;
}

body.public-body .public-hero-meta {
    margin-top: 16px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

body.public-body .public-hero-meta-card {
    padding: 12px 14px;
    border-radius: 16px;
    background: #ffffff;
}

body.public-body .public-slider-card {
    display: grid;
    align-content: start;
    padding: 12px;
    border: 1px solid #d7ebe6;
    border-radius: 24px;
    background: #f9fcfc;
    box-shadow: none;
}

body.public-body .public-slider {
    min-height: 290px;
    border-radius: 18px;
}

body.public-body .public-slider-caption {
    padding: 10px 4px 0;
}

body.public-body .public-slider-caption strong {
    color: #173741;
    font-size: 0.96rem;
}

body.public-body .public-slider-caption span {
    color: #678186;
    font-size: 0.84rem;
}

body.public-body .public-kpi-grid,
body.public-body .public-feature-grid {
    display: grid;
    gap: 14px;
}

body.public-body .public-kpi-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

body.public-body .public-kpi-card,
body.public-body .public-feature-card {
    min-height: 100%;
    padding: 18px;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.96);
}

body.public-body .public-kpi-card strong {
    color: #163740;
}

body.public-body .public-feature-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.public-body .public-feature-card p {
    color: #647d82;
}

body.public-body .public-schedule-section,
body.public-body .public-map-section {
    border-radius: 26px;
    background: rgba(255, 255, 255, 0.96);
    padding: 22px;
}

body.public-body .section-head {
    display: grid;
    gap: 6px;
    align-items: start;
    justify-content: start;
    margin-bottom: 14px;
}

body.public-body .section-head h3 {
    margin: 0;
    color: #163741;
    font-size: 1.85rem;
}

body.public-body .section-head p {
    margin: 0;
    max-width: 720px;
    color: #758b90;
    font-size: 0.92rem;
    line-height: 1.6;
}

body.public-body .public-schedule-layout {
    display: grid;
    grid-template-columns: minmax(320px, 0.95fr) minmax(0, 1.05fr);
    gap: 16px;
    align-items: stretch;
}

body.public-body .public-schedule-layout.is-single {
    grid-template-columns: minmax(0, 1fr) minmax(260px, 0.55fr);
}

body.public-body .public-schedule-featured {
    gap: 12px;
    padding: 22px;
    border-radius: 24px;
    background: linear-gradient(135deg, #11434b 0%, #138778 100%);
}

body.public-body .public-schedule-featured h4 {
    font-size: 1.5rem;
}

body.public-body .public-schedule-featured p {
    max-width: 55ch;
}

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

body.public-body .public-schedule-card,
body.public-body .public-schedule-compact-card {
    padding: 18px;
    border: 1px solid #d8ebe6;
    border-radius: 20px;
    background: #fbfdfd;
}

body.public-body .public-schedule-card h4 {
    margin-bottom: 10px;
    color: #173741;
}

body.public-body .public-schedule-card p {
    margin: 0 0 7px;
    color: #647d82;
}

body.public-body .public-schedule-compact {
    display: grid;
    gap: 14px;
    align-content: start;
}

body.public-body .public-schedule-compact-label {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    background: #eaf7f5;
    color: #0e7b72;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

body.public-body .public-schedule-compact-card strong {
    display: block;
    margin: 10px 0 6px;
    color: #173741;
    font-size: 1.05rem;
    line-height: 1.35;
}

body.public-body .public-schedule-compact-card small {
    display: block;
    color: #71878c;
    font-size: 0.86rem;
    line-height: 1.55;
}

body.public-body .public-map-grid {
    grid-template-columns: minmax(0, 1.04fr) minmax(320px, 0.96fr);
    gap: 16px;
}

body.public-body .section-head.section-head-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    align-items: end;
}

body.public-body .public-map-head-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

body.public-body .public-map-head-badges span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid #d9ebe7;
    background: #ffffff;
    color: #355d63;
    font-size: 0.84rem;
    font-weight: 600;
}

body.public-body .public-map-stage {
    display: grid;
    gap: 14px;
    min-width: 0;
}

body.public-body .public-map-wrap,
body.public-body .public-map {
    min-height: 360px;
    border-radius: 22px;
}

body.public-body .public-map-wrap {
    position: relative;
    padding: 14px;
    border: 1px solid #d7ebe6;
    background:
        radial-gradient(circle at top right, rgba(19, 147, 136, 0.08), transparent 30%),
        linear-gradient(180deg, #f9fcfc 0%, #f2f9f8 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

body.public-body .public-map-topline {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

body.public-body .public-map-topline-kicker,
body.public-body .public-map-card-kicker {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    background: #eaf7f5;
    color: #0e7b72;
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

body.public-body .public-map-topline-note {
    color: #6d858a;
    font-size: 0.82rem;
    text-align: right;
}

body.public-body .public-map {
    min-height: 392px;
    border: 1px solid #d4e7e2;
    box-shadow: 0 16px 30px rgba(11, 76, 70, 0.08);
}

body.public-body .public-map-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

body.public-body .public-map-summary-card {
    display: grid;
    gap: 6px;
    padding: 16px 16px 14px;
    border: 1px solid #d8ebe6;
    border-radius: 18px;
    background: #ffffff;
}

body.public-body .public-map-summary-card span {
    color: #688187;
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

body.public-body .public-map-summary-card strong {
    color: #163741;
    font-size: 1.22rem;
    line-height: 1.15;
}

body.public-body .public-map-summary-card small {
    color: #6b8288;
    line-height: 1.55;
}

body.public-body .public-map-summary-card.accent {
    background: linear-gradient(135deg, #0f6d66 0%, #14897b 100%);
    border-color: transparent;
}

body.public-body .public-map-summary-card.accent span,
body.public-body .public-map-summary-card.accent strong,
body.public-body .public-map-summary-card.accent small {
    color: #ffffff;
}

body.public-body .public-map-aside {
    display: grid;
    gap: 14px;
}

body.public-body .public-map-aside-card {
    display: grid;
    gap: 8px;
    padding: 18px;
    border: 1px solid #d8ebe6;
    border-radius: 20px;
    background: #fbfdfd;
}

body.public-body .public-map-aside-card h4 {
    margin: 0;
    color: #173741;
}

body.public-body .public-map-aside-card p {
    margin: 0;
    color: #698086;
    line-height: 1.65;
}

body.public-body .public-map-aside-card.accent {
    background: linear-gradient(135deg, #0f6d66 0%, #14897b 100%);
    border-color: transparent;
}

body.public-body .public-map-aside-card.accent h4,
body.public-body .public-map-aside-card.accent p {
    color: #ffffff;
}

body.public-body .public-map-aside-card.accent .btn-primary {
    min-height: 46px;
    background: #ffffff;
    color: #11424a;
}

body.public-body .site-footer.site-footer-public {
    margin-top: 6px;
    border-radius: 24px;
    background: linear-gradient(180deg, rgba(247, 252, 252, 0.98) 0%, rgba(238, 248, 246, 0.98) 100%);
    color: #173741;
    box-shadow: 0 18px 34px rgba(11, 69, 63, 0.08);
}

body.public-body .site-footer.site-footer-public .site-footer-shell {
    padding: 16px 18px 10px;
}

body.public-body .site-footer.site-footer-public .site-footer-hero {
    display: none;
}

body.public-body .site-footer.site-footer-public .site-footer-copy h4,
body.public-body .site-footer.site-footer-public .site-footer-copy p,
body.public-body .site-footer.site-footer-public .site-footer-copy .site-footer-kicker,
body.public-body .site-footer.site-footer-public .site-footer-card,
body.public-body .site-footer.site-footer-public .site-footer-card p,
body.public-body .site-footer.site-footer-public .site-footer-card span,
body.public-body .site-footer.site-footer-public .site-footer-link-list a,
body.public-body .site-footer.site-footer-public .site-footer-meta,
body.public-body .site-footer.site-footer-public .site-footer-bottom,
body.public-body .site-footer.site-footer-public .site-footer-legal {
    color: inherit;
}

body.public-body .site-footer.site-footer-public .site-footer-copy p,
body.public-body .site-footer.site-footer-public .site-footer-card-copy p,
body.public-body .site-footer.site-footer-public .site-footer-meta,
body.public-body .site-footer.site-footer-public .site-footer-bottom {
    color: #667d82;
}

body.public-body .site-footer.site-footer-public .site-footer-grid {
    margin-top: 0;
    grid-template-columns: minmax(0, 1.04fr) minmax(220px, 0.86fr) minmax(240px, 0.9fr);
    gap: 10px;
}

body.public-body .site-footer.site-footer-public .site-footer-card {
    min-height: 100%;
    padding: 14px 14px 12px;
    border: 1px solid #d7e8e3;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.88);
    box-shadow: none;
}

body.public-body .site-footer.site-footer-public .site-footer-card-label {
    margin-bottom: 8px;
    font-size: 0.72rem;
    letter-spacing: 0.14em;
}

body.public-body .site-footer.site-footer-public .site-footer-card-copy {
    gap: 6px;
}

body.public-body .site-footer.site-footer-public .site-footer-card-copy p,
body.public-body .site-footer.site-footer-public .site-footer-meta {
    font-size: 0.88rem;
    line-height: 1.5;
}

body.public-body .site-footer.site-footer-public .site-footer-link-list a {
    border-color: #d8ebe6;
    background: #ffffff;
    min-height: 38px;
    border-radius: 12px;
    font-size: 0.92rem;
}

body.public-body .site-footer.site-footer-public .site-footer-contact-link {
    border-color: #d8ebe6;
    background: #ffffff;
    color: #173741;
    min-height: 38px;
    border-radius: 12px;
    font-size: 0.92rem;
}

body.public-body .site-footer.site-footer-public .site-footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px 14px;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid #d8ebe6;
    font-size: 0.8rem;
}

body.public-body .site-footer.site-footer-public .site-footer-legal {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    color: #6a8085;
}

body.public-body .site-footer.site-footer-public .site-footer-legal-right {
    justify-content: flex-end;
    text-align: right;
}

@media (max-width: 1180px) {
    body.public-body .public-header-shell,
    body.public-body .public-schedule-layout,
    body.public-body .public-map-grid,
    body.public-body .site-footer.site-footer-public .site-footer-grid {
        grid-template-columns: 1fr;
    }

    body.public-body .public-nav-drawer {
        display: grid;
        gap: 14px;
    }

    body.public-body .public-kpi-grid,
    body.public-body .public-feature-grid,
    body.public-body .public-hero-meta,
    body.public-body .public-schedule-grid,
    body.public-body .public-map-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.public-body .section-head.section-head-split {
        grid-template-columns: 1fr;
    }

    body.public-body .public-map-head-badges {
        justify-content: flex-start;
    }
}

@media (max-width: 760px) {
    body.public-body .public-header {
        padding: 14px 0 8px;
    }

    body.public-body .public-header-shell,
    body.public-body .public-main {
        width: min(100vw - 24px, 100%);
    }

    body.public-body .public-header-shell {
        grid-template-columns: 1fr auto;
        padding: 12px;
        border-radius: 22px;
    }

    body.public-body .public-brand {
        min-height: 84px;
        padding: 12px 14px;
    }

    body.public-body .public-brand-media {
        width: 62px;
        min-height: 62px;
    }

    body.public-body .public-hero-grid,
    body.public-body .public-kpi-grid,
    body.public-body .public-feature-grid,
    body.public-body .public-schedule-grid,
    body.public-body .public-hero-meta,
    body.public-body .public-map-summary,
    body.public-body .site-footer.site-footer-public .site-footer-grid {
        grid-template-columns: 1fr;
    }

    body.public-body .public-hero-grid,
    body.public-body .public-schedule-section,
    body.public-body .public-map-section {
        padding: 16px;
    }

    body.public-body .public-hero-copy h2 {
        font-size: 1.9rem;
    }

    body.public-body .public-slider {
        min-height: 210px;
    }

    body.public-body .public-map-wrap,
    body.public-body .public-map {
        min-height: 280px;
    }

    body.public-body .public-map-topline {
        align-items: flex-start;
        flex-direction: column;
    }

    body.public-body .public-map-topline-note {
        text-align: left;
    }

    body.public-body .site-footer.site-footer-public .site-footer-shell {
        padding: 18px 16px 16px;
    }

    body.public-body .site-footer.site-footer-public .site-footer-brand-block,
    body.public-body .site-footer.site-footer-public .site-footer-bottom {
        grid-template-columns: 1fr;
        display: grid;
    }
}

/* 2026-03-14 internal dashboard cleanup */
.internal-body .topbar,
.internal-body .layout-with-sidebar,
.internal-body .site-footer-internal {
    width: min(1680px, calc(100vw - 28px));
}

.internal-body .topbar {
    margin: 12px auto 0;
    padding: 12px 14px;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
    border-radius: 22px;
}

.internal-body .topbar-main {
    display: grid;
    grid-template-columns: minmax(180px, 230px) minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    min-width: 0;
}

.internal-body .topbar-actions {
    justify-self: end;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    width: fit-content;
    max-width: 100%;
    padding-left: 0;
    border-left: 0;
}

.internal-body .brand-badge.brand-badge-logo-only {
    max-width: 220px;
    min-height: 82px;
    padding: 10px 14px;
    border-radius: 22px;
    justify-content: center;
    background:
        radial-gradient(circle at 78% 24%, rgba(255, 255, 255, 0.14), transparent 18%),
        linear-gradient(135deg, #17433f 0%, #1d5851 60%, #22685f 100%);
    box-shadow: 0 14px 28px rgba(12, 85, 78, 0.16);
}

.internal-body .brand-badge.brand-badge-logo-only::after {
    display: none;
}

.internal-body .brand-badge.brand-badge-logo-only::before {
    right: 10px;
    top: 10px;
    width: 78px;
    height: 56px;
    opacity: 0.16;
}

.internal-body .brand-badge.brand-badge-logo-only .brand-logo-image {
    width: min(100%, 176px);
    height: 64px;
    object-fit: contain;
    object-position: center center;
    transform: scale(calc(var(--header-logo-scale, 1.6) * 0.56));
    transform-origin: center center;
    filter: drop-shadow(0 8px 18px rgba(3, 32, 29, 0.18));
}

.internal-body .topbar-heading-copy h2 {
    font-size: 1.12rem;
}

.internal-body .topbar-heading-copy p {
    font-size: 0.84rem;
    line-height: 1.45;
}

.internal-body .topbar-tools,
.internal-body .topbar-profile {
    gap: 8px;
}

.internal-body .topbar-clock {
    min-width: 0;
    padding: 0 14px;
}

@media (max-width: 920px) {
    .internal-body .brand-badge.brand-badge-logo-only {
        max-width: 184px;
        min-height: 74px;
        padding: 8px 12px;
    }

    .internal-body .brand-badge.brand-badge-logo-only .brand-logo-image {
        width: min(100%, 148px);
        height: 56px;
        transform: scale(calc(var(--header-logo-scale, 1.6) * 0.5));
    }
}

@media (max-width: 640px) {
    .internal-body .brand-badge.brand-badge-logo-only {
        max-width: 160px;
        min-height: 66px;
        padding: 8px 10px;
    }

    .internal-body .brand-badge.brand-badge-logo-only .brand-logo-image {
        width: min(100%, 132px);
        height: 50px;
        transform: scale(calc(var(--header-logo-scale, 1.6) * 0.46));
    }
}

.internal-body .layout-with-sidebar {
    grid-template-columns: 228px minmax(0, 1fr);
    gap: 14px;
    margin: 14px auto 18px;
}

.internal-body .sidebar {
    min-height: auto;
    align-self: start;
    padding: 14px 12px;
    border-radius: 22px;
}

.internal-body .sidebar-top {
    gap: 8px;
}

.internal-body .sidebar-title {
    margin-bottom: 6px;
    font-size: 0.78rem;
}

.internal-body .sidebar-link {
    min-height: 42px;
    padding: 0 12px;
    border-radius: 14px;
    font-size: 0.92rem;
}

.internal-body .sidebar-weather {
    margin-top: 14px;
    min-height: 40px;
    border-radius: 14px;
    font-size: 0.8rem;
}

.dashboard-content-area {
    gap: 16px;
}

.dashboard-layout .dashboard-hero-panel {
    padding: 20px;
    gap: 16px;
    grid-template-columns: minmax(0, 1.18fr) minmax(280px, 0.82fr);
}

.dashboard-layout .dashboard-hero-copy h2 {
    font-size: clamp(1.9rem, 2.5vw, 2.7rem);
}

.dashboard-layout .dashboard-hero-copy p {
    max-width: 760px;
    font-size: 0.95rem;
    line-height: 1.65;
}

.dashboard-layout .dashboard-hero-tags {
    gap: 10px;
}

.dashboard-layout .dashboard-hero-tags span {
    min-height: 40px;
    padding: 9px 12px;
    border-radius: 13px;
    font-size: 0.84rem;
}

.dashboard-layout .hero-insight-card {
    padding: 16px;
    border-radius: 18px;
}

.dashboard-layout .stats-grid.dashboard-stats {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.dashboard-layout .stats-card {
    min-height: 0;
    padding: 16px;
    border-radius: 18px;
}

.dashboard-layout .stats-card h3 {
    font-size: 1.8rem;
}

.dashboard-layout .dashboard-ops-grid {
    grid-template-columns: minmax(0, 1.12fr) minmax(320px, 0.88fr);
    gap: 16px;
}

.dashboard-layout.dashboard-staff-view .dashboard-ops-grid {
    grid-template-columns: minmax(0, 1.06fr) minmax(320px, 0.94fr);
}

.dashboard-layout .dashboard-ops-column {
    display: grid;
    align-content: start;
    gap: 16px;
    min-width: 0;
}

.dashboard-layout .dashboard-ops-column-side {
    align-content: start;
}

.dashboard-layout .dashboard-card {
    padding: 18px;
    border-radius: 22px;
}

.dashboard-layout .dashboard-card .card-head {
    gap: 10px;
    margin-bottom: 14px;
}

.dashboard-layout .dashboard-card h2 {
    font-size: 1.08rem;
}

.dashboard-layout .dashboard-card .card-head p {
    font-size: 0.84rem;
    line-height: 1.55;
}

.dashboard-layout .dashboard-focus-grid {
    gap: 10px;
}

.dashboard-layout .dashboard-focus-tile {
    padding: 14px;
    border-radius: 16px;
}

.dashboard-layout .dashboard-focus-tile strong {
    font-size: 1.65rem;
}

.dashboard-layout .dashboard-admin-brief-card {
    display: grid;
    align-content: start;
    gap: 14px;
}

.dashboard-layout .dashboard-admin-brief-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.dashboard-layout .dashboard-admin-brief-item {
    display: grid;
    gap: 6px;
    padding: 14px;
    border: 1px solid #d7e8e4;
    border-radius: 16px;
    background: #fbfdfd;
}

.dashboard-layout .dashboard-admin-brief-item span {
    color: #688188;
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.dashboard-layout .dashboard-admin-brief-item strong {
    color: #163740;
    font-size: 1.45rem;
    line-height: 1;
}

.dashboard-layout .dashboard-admin-brief-item small {
    color: #71878d;
    line-height: 1.45;
}

.dashboard-layout .dashboard-admin-brief-item.warning {
    background: linear-gradient(180deg, #fff8ee 0%, #fffdfa 100%);
    border-color: #efdbaf;
}

.dashboard-layout .dashboard-admin-brief-item.info {
    background: linear-gradient(180deg, #eef8fb 0%, #fbfefe 100%);
    border-color: #d3e5ee;
}

.dashboard-layout .dashboard-admin-brief-note {
    padding: 14px 16px;
    border: 1px solid #d9e9e6;
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f6fbfb 100%);
}

.dashboard-layout .dashboard-admin-brief-note strong {
    display: block;
    margin-bottom: 6px;
    color: #173740;
}

.dashboard-layout .dashboard-admin-brief-note p {
    margin: 0;
    color: #6a8389;
    line-height: 1.58;
}

.dashboard-layout .dashboard-field-card {
    display: grid;
    align-content: start;
    gap: 14px;
}

.dashboard-layout .dashboard-field-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.dashboard-layout .dashboard-field-metric {
    display: grid;
    gap: 6px;
    padding: 14px;
    border: 1px solid #d7e8e4;
    border-radius: 16px;
    background: #fbfdfd;
}

.dashboard-layout .dashboard-field-metric span {
    color: #688188;
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.dashboard-layout .dashboard-field-metric strong {
    color: #163740;
    font-size: 1.45rem;
    line-height: 1;
}

.dashboard-layout .dashboard-field-metric small {
    color: #71878d;
    line-height: 1.45;
}

.dashboard-layout .dashboard-field-metric.warning {
    background: linear-gradient(180deg, #fff8ee 0%, #fffdfa 100%);
    border-color: #efdbaf;
}

.dashboard-layout .dashboard-field-metric.danger {
    background: linear-gradient(180deg, #fff5f4 0%, #fffdfc 100%);
    border-color: #f0d1cb;
}

.dashboard-layout .dashboard-field-metric.info {
    background: linear-gradient(180deg, #eef8fb 0%, #fbfefe 100%);
    border-color: #d3e5ee;
}

.dashboard-layout .dashboard-field-note {
    padding: 14px 16px;
    border: 1px solid #d9e9e6;
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f6fbfb 100%);
}

.dashboard-layout .dashboard-field-note strong {
    display: block;
    margin-bottom: 6px;
    color: #173740;
}

.dashboard-layout .dashboard-field-note p {
    margin: 0;
    color: #6a8389;
    line-height: 1.58;
}

.dashboard-layout .dashboard-field-schedule {
    display: grid;
    gap: 10px;
}

.dashboard-layout .dashboard-field-schedule h3 {
    margin: 0;
    color: #173740;
    font-size: 1rem;
}

.dashboard-layout .dashboard-field-list {
    display: grid;
    gap: 10px;
}

.dashboard-layout .dashboard-field-item,
.dashboard-layout .dashboard-field-empty {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
    padding: 12px 14px;
    border: 1px solid #d8e8e5;
    border-radius: 14px;
    background: #ffffff;
}

.dashboard-layout .dashboard-field-item strong {
    display: block;
    margin-bottom: 4px;
    color: #153741;
}

.dashboard-layout .dashboard-field-item span,
.dashboard-layout .dashboard-field-item small,
.dashboard-layout .dashboard-field-empty {
    color: #6f858b;
    line-height: 1.5;
}

.dashboard-layout .dashboard-field-item small {
    flex: 0 0 auto;
    font-weight: 700;
    color: #0f7a71;
}

.dashboard-layout .dashboard-field-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.dashboard-layout .dashboard-field-actions .btn-soft {
    justify-content: center;
}

.dashboard-layout .dashboard-field-footer {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
    color: #668087;
    font-size: 0.84rem;
}

.dashboard-layout .dashboard-field-footer span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.dashboard-layout .dashboard-staff-brief-card {
    display: grid;
    align-content: start;
    gap: 14px;
}

.dashboard-layout .dashboard-staff-brief-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.dashboard-layout .dashboard-staff-brief-item {
    display: grid;
    gap: 6px;
    padding: 14px;
    border: 1px solid #d7e8e4;
    border-radius: 16px;
    background: #fbfdfd;
}

.dashboard-layout .dashboard-staff-brief-item span {
    color: #688188;
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.dashboard-layout .dashboard-staff-brief-item strong {
    color: #163740;
    font-size: 1.4rem;
    line-height: 1;
}

.dashboard-layout .dashboard-staff-brief-item small {
    color: #71878d;
    line-height: 1.45;
}

.dashboard-layout .dashboard-staff-brief-item.warning {
    background: linear-gradient(180deg, #fff8ee 0%, #fffdfa 100%);
    border-color: #efdbaf;
}

.dashboard-layout .dashboard-staff-brief-item.info {
    background: linear-gradient(180deg, #eef8fb 0%, #fbfefe 100%);
    border-color: #d3e5ee;
}

.dashboard-layout .dashboard-staff-brief-item.success {
    background: linear-gradient(180deg, #f3fbf7 0%, #fcfffe 100%);
    border-color: #cfe7dc;
}

.dashboard-layout .dashboard-staff-brief-note {
    padding: 14px 16px;
    border: 1px solid #d9e9e6;
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f6fbfb 100%);
}

.dashboard-layout .dashboard-staff-brief-note strong {
    display: block;
    margin-bottom: 6px;
    color: #173740;
}

.dashboard-layout .dashboard-staff-brief-note p {
    margin: 0;
    color: #6a8389;
    line-height: 1.58;
}

@media (min-width: 1101px) {
    .dashboard-layout.dashboard-admin-view .dashboard-content-area,
    .dashboard-layout.dashboard-staff-view .dashboard-content-area {
        display: grid;
        grid-template-columns: 1fr;
        gap: 16px;
        align-items: start;
    }

    .dashboard-layout .dashboard-shell-grid {
        display: grid;
        grid-template-columns: minmax(0, 1.08fr) minmax(340px, 0.92fr);
        gap: 16px;
        align-items: start;
    }

    .dashboard-layout .dashboard-shell-column {
        display: grid;
        align-content: start;
        gap: 16px;
        min-width: 0;
    }

    .dashboard-layout .dashboard-shell-column > .dashboard-card {
        min-height: 0;
        height: auto;
    }
}

.dashboard-layout .dashboard-quality-grid {
    grid-template-columns: minmax(0, 1fr) minmax(250px, 0.92fr);
    gap: 12px;
}

.dashboard-layout .dashboard-intervention-panel {
    padding: 14px;
    border-radius: 18px;
}

.dashboard-layout .dashboard-intervention-item,
.dashboard-layout .dashboard-quality-item {
    padding: 12px 14px;
    border-radius: 14px;
}

.dashboard-layout .dashboard-admin-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.14fr) minmax(360px, 0.86fr);
    gap: 16px;
    align-items: start;
}

.dashboard-layout .dashboard-admin-column {
    display: grid;
    align-content: start;
    gap: 16px;
    min-width: 0;
}

.dashboard-layout .dashboard-scroll-card {
    min-height: 0;
}

.dashboard-layout .dashboard-command-card {
    min-height: 0;
}

.dashboard-layout .dashboard-admin-side-card {
    display: grid;
    align-content: start;
    gap: 14px;
}

.dashboard-layout .dashboard-admin-side-grid {
    display: grid;
    gap: 10px;
}

.dashboard-layout .dashboard-admin-side-item {
    display: grid;
    gap: 6px;
    padding: 14px;
    border: 1px solid #d7e8e4;
    border-radius: 16px;
    background: #fbfdfd;
}

.dashboard-layout .dashboard-admin-side-item span {
    color: #688188;
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.dashboard-layout .dashboard-admin-side-item strong {
    color: #163740;
    font-size: 1.4rem;
    line-height: 1;
}

.dashboard-layout .dashboard-admin-side-item small {
    color: #71878d;
    line-height: 1.45;
}

.dashboard-layout .dashboard-admin-side-item.warning {
    background: linear-gradient(180deg, #fff8ee 0%, #fffdfa 100%);
    border-color: #efdbaf;
}

.dashboard-layout .dashboard-admin-side-item.info {
    background: linear-gradient(180deg, #eef8fb 0%, #fbfefe 100%);
    border-color: #d3e5ee;
}

.dashboard-layout .dashboard-admin-side-note {
    padding: 14px 16px;
    border: 1px solid #d9e9e6;
    border-radius: 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f6fbfb 100%);
}

.dashboard-layout .dashboard-admin-side-note strong {
    display: block;
    margin-bottom: 6px;
    color: #173740;
}

.dashboard-layout .dashboard-admin-side-note p {
    margin: 0;
    color: #6a8389;
    line-height: 1.58;
}

.dashboard-layout .dashboard-command-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.dashboard-layout .dashboard-command-metric {
    min-height: 0;
    padding: 14px;
    border-radius: 16px;
}

.dashboard-layout .dashboard-command-grid {
    grid-template-columns: minmax(0, 1.06fr) minmax(320px, 0.94fr);
    gap: 14px;
    align-items: start;
}

.dashboard-layout .dashboard-command-panel {
    padding: 16px;
    border-radius: 18px;
}

.dashboard-layout .dashboard-command-panel.emphasis {
    display: grid;
    align-content: start;
    gap: 14px;
    height: auto;
}

.dashboard-layout .dashboard-command-panel h3 {
    margin-bottom: 10px;
}

.dashboard-layout .dashboard-command-list {
    gap: 10px;
}

.dashboard-layout .dashboard-command-item {
    padding: 12px 14px;
    border-radius: 14px;
}

.dashboard-layout .dashboard-command-agenda-foot {
    gap: 12px;
    margin-top: 12px;
}

.dashboard-layout .dashboard-command-agenda-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.dashboard-layout .dashboard-command-agenda-stat {
    min-height: 0;
    padding: 12px;
    border-radius: 14px;
}

.dashboard-layout .dashboard-command-links {
    margin-top: 0;
    gap: 8px;
}

.dashboard-layout .dashboard-command-link {
    min-height: 44px;
    padding: 0 14px;
    border-radius: 14px;
    font-size: 0.9rem;
}

.dashboard-layout .dashboard-command-side-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 0;
}

.dashboard-layout .dashboard-command-side-item {
    padding: 12px;
    border-radius: 14px;
}

.dashboard-layout .dashboard-command-side-item strong {
    font-size: 1.2rem;
}

.dashboard-layout .dashboard-command-side-note {
    margin-top: 0;
    padding: 14px;
    border-radius: 16px;
}

.dashboard-layout .dashboard-analytics-grid {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 0.92fr);
    gap: 16px;
}

.dashboard-layout .chart-wrap {
    min-height: 0;
}

.dashboard-layout .dashboard-map {
    height: 300px;
}

.dashboard-layout .dashboard-map-footer {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
    margin-top: 12px;
    color: #678187;
    font-size: 0.83rem;
}

.dashboard-layout .dashboard-map-footer span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.dashboard-layout .priority-item {
    padding: 12px 14px;
    border-radius: 14px;
}

.site-footer-internal {
    margin: 16px auto 22px;
    border-radius: 24px;
    box-shadow: 0 18px 34px rgba(10, 50, 57, 0.18);
}

.site-footer-internal .site-footer-hero {
    display: none;
}

.site-footer-internal .site-footer-shell {
    padding: 16px 18px 14px;
    gap: 14px;
}

.site-footer-internal .site-footer-grid {
    grid-template-columns: 1.2fr 0.9fr 0.9fr;
    gap: 12px;
}

.site-footer-internal .site-footer-card {
    padding: 14px 16px;
    border-radius: 18px;
}

.site-footer-internal .site-footer-card-copy,
.site-footer-internal .site-footer-link-list {
    margin-top: 10px;
    gap: 8px;
}

.site-footer-internal .site-footer-card-copy p,
.site-footer-internal .site-footer-meta,
.site-footer-internal .site-footer-legal {
    font-size: 0.84rem;
    line-height: 1.55;
}

.site-footer-internal .site-footer-contact-link,
.site-footer-internal .site-footer-link-list a {
    min-height: 38px;
    border-radius: 12px;
}

.site-footer-internal .site-footer-bottom {
    padding-top: 10px;
    border-top: 1px solid rgba(214, 234, 229, 0.16);
}

@media (max-width: 1220px) {
    .internal-body .topbar,
    .internal-body .layout-with-sidebar,
    .internal-body .site-footer-internal {
        width: min(1680px, calc(100vw - 20px));
    }

    .internal-body .topbar {
        grid-template-columns: 1fr;
        grid-template-areas:
            "main"
            "actions";
    }

    .internal-body .topbar-main {
        grid-area: main;
    }

    .internal-body .topbar-actions {
        grid-area: actions;
        grid-template-columns: 1fr;
        justify-items: end;
        justify-self: end;
        padding-left: 0;
        border-left: 0;
    }

    .dashboard-layout .stats-grid.dashboard-stats,
    .dashboard-layout .dashboard-hero-panel,
    .dashboard-layout .dashboard-shell-grid,
    .dashboard-layout .dashboard-ops-grid,
    .dashboard-layout .dashboard-quality-grid,
    .dashboard-layout .dashboard-analytics-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-layout .dashboard-command-grid {
        grid-template-columns: 1fr;
    }

    .dashboard-layout .dashboard-command-side-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 860px) {
    .dashboard-layout .dashboard-shell-column,
    .dashboard-layout .dashboard-admin-grid,
    .dashboard-layout .dashboard-admin-brief-grid,
    .dashboard-layout .dashboard-command-side-grid,
    .dashboard-layout .dashboard-command-agenda-stats,
    .dashboard-layout .stats-grid.dashboard-stats,
    .dashboard-layout .dashboard-staff-brief-grid,
    .dashboard-layout .dashboard-field-metrics,
    .dashboard-layout .dashboard-field-actions {
        grid-template-columns: 1fr;
    }

    .internal-body .topbar-main {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .internal-body .topbar-actions {
        width: 100%;
        justify-self: stretch;
        justify-content: flex-start;
    }
}

/* Measurement identity cards */
/* Measurement identity list (compact, label: value) */
.measurement-identity-card {
    padding: 16px 18px 12px;
}
.measurement-head h2 {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 18px;
    margin: 0;
    color: #0d8f82;
}
.measurement-head h2 i {
    color: #27ae7a;
}
.identity-list {
    margin-top: 10px;
    display: grid;
    gap: 6px;
}
.identity-list-row {
    display: grid;
    grid-template-columns: 135px 12px 1fr;
    align-items: baseline;
    font-size: 14px;
    color: #2f3a32;
}
.identity-list-label {
    color: #5d7066;
    font-weight: 600;
}
.identity-list-sep {
    color: #7a8a80;
}
.identity-list-value {
    color: #2f3a32;
    font-weight: 500;
}
.identity-list-value.strong {
    font-weight: 700;
}
@media (max-width: 640px) {
    .identity-list-row {
        grid-template-columns: 110px 10px 1fr;
        font-size: 13px;
    }
}

/* 2026-03-24 portal luxe refresh */
body.public-body-luxe {
    --portal-ink: #192726;
    --portal-muted: #6b7873;
    --portal-gold: #bc9150;
    --portal-shadow: 0 28px 80px rgba(20, 37, 35, 0.12);
    font-family: "Manrope", sans-serif;
    color: var(--portal-ink);
    background:
        radial-gradient(circle at 0% 0%, rgba(188, 145, 80, 0.18), transparent 24%),
        radial-gradient(circle at 100% 12%, rgba(18, 73, 67, 0.16), transparent 24%),
        linear-gradient(180deg, #f7f1e8 0%, #eef3ed 42%, #f8fbf6 100%);
}

body.public-body-luxe::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(125deg, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0) 45%);
    opacity: 0.8;
}

body.public-body-luxe .public-header {
    position: sticky;
    top: 0;
    z-index: 40;
    padding: 18px 0 12px;
    background: linear-gradient(180deg, rgba(247, 241, 232, 0.94) 0%, rgba(247, 241, 232, 0.78) 58%, rgba(247, 241, 232, 0) 100%);
    backdrop-filter: blur(18px);
}

body.public-body-luxe .public-header-shell,
body.public-body-luxe .public-main {
    width: min(1360px, calc(100vw - 56px));
}

body.public-body-luxe .public-header-shell {
    display: grid;
    grid-template-columns: minmax(320px, 420px) minmax(0, 1fr);
    align-items: center;
    gap: 18px;
    padding: 16px 18px;
    border: 1px solid rgba(22, 45, 41, 0.08);
    border-radius: 30px;
    background: rgba(255, 252, 247, 0.72);
    box-shadow: 0 20px 60px rgba(17, 39, 36, 0.08);
    backdrop-filter: blur(22px);
}

body.public-body-luxe .public-brand::before,
body.public-body-luxe .public-brand::after {
    display: none;
}

body.public-body-luxe .public-brand {
    gap: 18px;
    min-height: 104px;
    padding: 16px 20px;
    border-radius: 24px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background:
        radial-gradient(circle at top right, rgba(234, 216, 182, 0.18), transparent 32%),
        linear-gradient(135deg, #0e2d2b 0%, #184841 54%, #1e675f 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

body.public-body-luxe .public-brand-media {
    width: 88px;
    min-height: 88px;
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

body.public-body-luxe .public-brand .public-brand-media img {
    width: calc(60px * var(--header-logo-scale, 1));
    max-width: 100%;
    max-height: 100%;
}

body.public-body-luxe .public-brand-copy {
    gap: 6px;
}

body.public-body-luxe .public-brand-kicker {
    color: rgba(234, 216, 182, 0.96);
    letter-spacing: 0.16em;
}

body.public-body-luxe .public-brand-title {
    color: #fbf7f0;
    font-size: 1.42rem;
    letter-spacing: -0.01em;
}

body.public-body-luxe .public-brand-subtitle {
    color: rgba(236, 246, 243, 0.74);
    font-size: 0.86rem;
    line-height: 1.45;
}

body.public-body-luxe .public-nav-drawer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
    min-height: 100px;
    width: 100%;
}

body.public-body-luxe .public-nav {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
}

body.public-body-luxe .public-nav::-webkit-scrollbar {
    display: none;
}

body.public-body-luxe .public-nav-link {
    min-height: 44px;
    padding: 0 16px;
    border-radius: 999px;
    border: 1px solid rgba(23, 46, 43, 0.08);
    background: rgba(255, 255, 255, 0.64);
    color: #324542;
    font-size: 0.9rem;
    font-weight: 600;
    backdrop-filter: blur(12px);
}

body.public-body-luxe .public-nav-link.active,
body.public-body-luxe .public-nav-link:hover {
    border-color: rgba(188, 145, 80, 0.34);
    background: rgba(255, 248, 238, 0.9);
    color: #8a6130;
}

body.public-body-luxe .public-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0;
}

body.public-body-luxe .public-nav-toggle {
    border-radius: 16px;
    border: 1px solid rgba(22, 45, 41, 0.08);
    background: rgba(255, 255, 255, 0.78);
    color: #213a37;
    box-shadow: 0 10px 24px rgba(17, 39, 36, 0.06);
}

body.public-body-luxe .public-header .btn-primary,
body.public-body-luxe .public-header-actions .btn-primary,
body.public-body-luxe .public-main .btn-primary {
    min-height: 48px;
    padding: 0 20px;
    border-radius: 999px;
    border: 0;
    background: linear-gradient(135deg, #113632 0%, #1e5c55 100%);
    color: #fbf7f0;
    box-shadow: 0 18px 30px rgba(21, 61, 56, 0.14);
}

body.public-body-luxe .public-header .btn-soft,
body.public-body-luxe .public-header-actions .btn-soft,
body.public-body-luxe .public-main .btn-soft {
    min-height: 48px;
    padding: 0 20px;
    border-radius: 999px;
    border: 1px solid rgba(188, 145, 80, 0.22);
    background: rgba(255, 250, 244, 0.76);
    color: #7d5b2e;
    box-shadow: none;
}

body.public-body-luxe .public-main {
    display: grid;
    gap: 24px;
    padding-top: 8px;
    padding-bottom: 42px;
}

body.public-body-luxe .public-hero,
body.public-body-luxe .public-schedule-section,
body.public-body-luxe .public-map-section,
body.public-body-luxe .site-footer.site-footer-public {
    border: 1px solid rgba(21, 43, 40, 0.08);
    box-shadow: var(--portal-shadow);
}

body.public-body-luxe .public-kpi-grid,
body.public-body-luxe .public-feature-grid {
    border: 0;
    box-shadow: none;
    background: transparent;
}

body.public-body-luxe .public-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    padding: 0 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(234, 216, 182, 0.22);
    color: #f3ddbb;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

body.public-body-luxe .public-hero {
    position: relative;
    overflow: hidden;
    border-radius: 36px;
    background:
        radial-gradient(circle at top right, rgba(234, 216, 182, 0.18), transparent 28%),
        linear-gradient(135deg, #0f2828 0%, #163f3b 52%, #1e665f 100%);
}

body.public-body-luxe .public-hero::before {
    content: "";
    position: absolute;
    inset: auto -6% -32% 44%;
    height: 70%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(234, 216, 182, 0.2) 0%, rgba(234, 216, 182, 0) 70%);
    pointer-events: none;
}

body.public-body-luxe .public-hero-grid {
    grid-template-columns: minmax(0, 1.08fr) minmax(340px, 0.92fr);
    gap: 32px;
    padding: clamp(30px, 4vw, 52px);
    align-items: stretch;
}

body.public-body-luxe .public-hero-copy {
    position: relative;
    z-index: 1;
}

body.public-body-luxe .public-hero-copy h2,
body.public-body-luxe .section-head h3,
body.public-body-luxe .public-schedule-featured h4 {
    font-family: "Cormorant Garamond", serif;
    letter-spacing: -0.03em;
}

body.public-body-luxe .public-hero-copy h2 {
    max-width: 10ch;
    margin: 18px 0 18px;
    color: #fcf7ef;
    font-size: clamp(3.3rem, 6vw, 5.8rem);
    line-height: 0.9;
}

body.public-body-luxe .public-hero-lead {
    margin-bottom: 10px;
    color: #efddb9;
    font-size: 1.06rem;
    font-weight: 700;
    letter-spacing: 0.01em;
}

body.public-body-luxe .public-hero-subtext {
    max-width: 620px;
    color: rgba(239, 246, 243, 0.78);
    font-size: 0.97rem;
    line-height: 1.78;
}

body.public-body-luxe .public-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 22px;
}

body.public-body-luxe .public-hero-actions .btn-primary {
    background: #fbf6ee;
    color: #173935;
}

body.public-body-luxe .public-hero-actions .btn-soft {
    border-color: rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.08);
    color: #fcf7ef;
}

body.public-body-luxe .public-trust-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

body.public-body-luxe .public-trust-row span {
    min-height: 42px;
    padding: 10px 14px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.08);
    color: rgba(243, 247, 242, 0.86);
    font-size: 0.84rem;
}

body.public-body-luxe .public-hero-meta {
    margin-top: 26px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

body.public-body-luxe .public-hero-meta-card {
    padding: 16px 18px;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(10px);
}

body.public-body-luxe .public-hero-meta-card span {
    color: rgba(234, 216, 182, 0.82);
    font-size: 0.74rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

body.public-body-luxe .public-hero-meta-card strong {
    display: block;
    margin: 10px 0 6px;
    color: #fcf7ef;
    font-size: 1.2rem;
}

body.public-body-luxe .public-hero-meta-card small {
    color: rgba(240, 246, 243, 0.68);
    line-height: 1.55;
}

body.public-body-luxe .public-slider-card {
    display: grid;
    align-content: start;
    padding: 14px;
    border-radius: 28px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: linear-gradient(180deg, rgba(255, 251, 245, 0.94) 0%, rgba(247, 240, 229, 0.88) 100%);
    box-shadow: 0 20px 44px rgba(14, 32, 31, 0.16);
}

body.public-body-luxe .public-slider {
    min-height: 440px;
    border-radius: 24px;
    overflow: hidden;
}

body.public-body-luxe .public-slide img {
    filter: saturate(0.92) contrast(1.03);
}

body.public-body-luxe .slide-btn {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    border: 1px solid rgba(17, 39, 36, 0.08);
    background: rgba(255, 252, 247, 0.84);
    color: #173935;
    box-shadow: 0 12px 22px rgba(20, 37, 35, 0.12);
}

body.public-body-luxe .slide-dot {
    background: rgba(23, 57, 53, 0.22);
}

body.public-body-luxe .slide-dot.active {
    background: #bc9150;
}

body.public-body-luxe .public-slider-caption {
    display: grid;
    gap: 6px;
    padding: 14px 6px 2px;
}

body.public-body-luxe .public-slider-caption strong {
    color: #173935;
    font-size: 1rem;
}

body.public-body-luxe .public-slider-caption span {
    color: #6c7671;
    font-size: 0.86rem;
    line-height: 1.55;
}

body.public-body-luxe .public-kpi-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

body.public-body-luxe .public-kpi-card {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 14px;
    align-items: center;
    min-height: 124px;
    padding: 20px 22px;
    border-radius: 24px;
    border: 1px solid rgba(20, 44, 41, 0.08);
    background: rgba(255, 252, 247, 0.74);
    backdrop-filter: blur(14px);
    box-shadow: 0 18px 40px rgba(20, 37, 35, 0.06);
}

body.public-body-luxe .public-kpi-card i {
    width: 54px;
    height: 54px;
    display: inline-grid;
    place-items: center;
    border-radius: 18px;
    background: #173a37;
    color: #f5e2bf;
    font-size: 1.12rem;
}

body.public-body-luxe .public-kpi-card.warn i {
    background: #7a3f25;
}

body.public-body-luxe .public-kpi-card.soft i {
    background: #35595f;
}

body.public-body-luxe .public-kpi-card strong {
    display: block;
    color: #173935;
    font-size: 1.5rem;
    line-height: 1;
}

body.public-body-luxe .public-kpi-card span {
    display: block;
    margin-top: 8px;
    color: #6f7b77;
    line-height: 1.55;
}

body.public-body-luxe .public-feature-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

body.public-body-luxe .public-feature-card {
    display: grid;
    gap: 16px;
    min-height: 100%;
    padding: 22px 22px 20px;
    border-radius: 24px;
    border: 1px solid rgba(20, 44, 41, 0.08);
    background: rgba(255, 252, 247, 0.64);
    backdrop-filter: blur(14px);
    box-shadow: 0 18px 36px rgba(20, 37, 35, 0.05);
}

body.public-body-luxe .public-feature-card i {
    width: 52px;
    height: 52px;
    display: inline-grid;
    place-items: center;
    border-radius: 16px;
    background: rgba(188, 145, 80, 0.14);
    color: #8a6130;
    font-size: 1.1rem;
}

body.public-body-luxe .public-feature-card h3 {
    margin: 0;
    color: #183734;
    font-size: 1.14rem;
}

body.public-body-luxe .public-feature-card p {
    margin: 0;
    color: #6b7873;
    line-height: 1.75;
}

body.public-body-luxe .public-schedule-section,
body.public-body-luxe .public-map-section {
    border-radius: 32px;
    background: rgba(255, 252, 247, 0.74);
    backdrop-filter: blur(14px);
    padding: clamp(26px, 3.2vw, 40px);
}

body.public-body-luxe .section-head {
    display: grid;
    gap: 8px;
    margin-bottom: 22px;
}

body.public-body-luxe .section-head h3 {
    margin: 0;
    color: #1a3533;
    font-size: clamp(2.5rem, 4vw, 3.4rem);
    line-height: 0.96;
}

body.public-body-luxe .section-head p {
    margin: 0;
    max-width: 760px;
    color: #6d7975;
    font-size: 0.96rem;
    line-height: 1.75;
}

body.public-body-luxe .public-schedule-layout {
    grid-template-columns: minmax(320px, 0.96fr) minmax(0, 1.04fr);
    gap: 18px;
}

body.public-body-luxe .public-schedule-featured {
    gap: 14px;
    padding: 28px;
    border-radius: 28px;
    background:
        radial-gradient(circle at top right, rgba(234, 216, 182, 0.18), transparent 26%),
        linear-gradient(135deg, #112b2d 0%, #184740 54%, #1b6258 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

body.public-body-luxe .public-schedule-featured-kicker {
    color: #f0dcb8;
    letter-spacing: 0.16em;
}

body.public-body-luxe .public-schedule-featured h4 {
    margin: 0;
    color: #fbf7ef;
    font-size: 2.3rem;
    line-height: 0.95;
}

body.public-body-luxe .public-schedule-featured-meta span,
body.public-body-luxe .public-schedule-featured p {
    color: rgba(242, 248, 244, 0.82);
}

body.public-body-luxe .public-schedule-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

body.public-body-luxe .public-schedule-card,
body.public-body-luxe .public-schedule-compact-card {
    padding: 20px;
    border: 1px solid rgba(20, 44, 41, 0.08);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.78);
}

body.public-body-luxe .public-schedule-card h4 {
    margin: 0 0 12px;
    color: #193633;
    font-size: 1.08rem;
}

body.public-body-luxe .public-schedule-card p {
    margin: 0 0 8px;
    color: #6b7873;
    line-height: 1.65;
}

body.public-body-luxe .public-schedule-compact {
    gap: 16px;
}

body.public-body-luxe .public-schedule-compact-label,
body.public-body-luxe .public-map-topline-kicker,
body.public-body-luxe .public-map-card-kicker {
    display: inline-flex;
    width: fit-content;
    min-height: 28px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(188, 145, 80, 0.14);
    color: #8a6130;
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

body.public-body-luxe .public-map-grid {
    grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
    gap: 18px;
}

body.public-body-luxe .section-head.section-head-split {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
}

body.public-body-luxe .public-map-head-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

body.public-body-luxe .public-map-head-badges span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid rgba(20, 44, 41, 0.08);
    background: rgba(255, 255, 255, 0.78);
    color: #46605d;
    font-size: 0.84rem;
    font-weight: 600;
}

body.public-body-luxe .public-map-stage {
    display: grid;
    gap: 16px;
}

body.public-body-luxe .public-map-wrap {
    position: relative;
    padding: 16px;
    border: 1px solid rgba(20, 44, 41, 0.08);
    border-radius: 28px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.88) 0%, rgba(249, 244, 236, 0.88) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

body.public-body-luxe .public-map-topline {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

body.public-body-luxe .public-map-topline-note {
    color: #7a847f;
    font-size: 0.82rem;
}

body.public-body-luxe .public-map {
    min-height: 420px;
    border-radius: 22px;
    border: 1px solid rgba(20, 44, 41, 0.08);
    box-shadow: 0 18px 40px rgba(20, 37, 35, 0.08);
}

body.public-body-luxe .public-map-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

body.public-body-luxe .public-map-summary-card,
body.public-body-luxe .public-map-aside-card {
    display: grid;
    gap: 8px;
    padding: 20px;
    border: 1px solid rgba(20, 44, 41, 0.08);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.78);
}

body.public-body-luxe .public-map-summary-card span {
    color: #71807b;
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

body.public-body-luxe .public-map-summary-card strong {
    color: #193633;
    font-size: 1.3rem;
    line-height: 1.1;
}

body.public-body-luxe .public-map-summary-card small,
body.public-body-luxe .public-map-aside-card p {
    color: #6b7873;
    line-height: 1.7;
}

body.public-body-luxe .public-map-summary-card.accent,
body.public-body-luxe .public-map-aside-card.accent {
    background: linear-gradient(135deg, #112c2d 0%, #1a4a43 56%, #225f57 100%);
    border-color: transparent;
}

body.public-body-luxe .public-map-summary-card.accent span,
body.public-body-luxe .public-map-summary-card.accent strong,
body.public-body-luxe .public-map-summary-card.accent small,
body.public-body-luxe .public-map-aside-card.accent h4,
body.public-body-luxe .public-map-aside-card.accent p {
    color: #fcf7ef;
}

body.public-body-luxe .public-map-aside-card h4 {
    margin: 0;
    color: #193633;
    font-size: 1.1rem;
}

body.public-body-luxe .public-map-aside-card.accent .btn-primary {
    background: #fbf6ee;
    color: #173935;
    box-shadow: none;
}

body.public-body-luxe .site-footer.site-footer-public {
    margin-top: 2px;
    border-radius: 32px;
    background: linear-gradient(180deg, rgba(255, 252, 247, 0.9) 0%, rgba(245, 248, 242, 0.94) 100%);
}

body.public-body-luxe .site-footer.site-footer-public .site-footer-shell {
    padding: 22px 22px 14px;
}

body.public-body-luxe .site-footer.site-footer-public .site-footer-grid {
    gap: 14px;
}

body.public-body-luxe .site-footer.site-footer-public .site-footer-card {
    padding: 16px 16px 14px;
    border: 1px solid rgba(20, 44, 41, 0.08);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.78);
}

body.public-body-luxe .site-footer.site-footer-public .site-footer-card-label {
    color: #876033;
}

body.public-body-luxe .site-footer.site-footer-public .site-footer-bottom {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid rgba(20, 44, 41, 0.08);
}

@media (max-width: 1180px) {
    body.public-body-luxe .public-header-shell,
    body.public-body-luxe .public-schedule-layout,
    body.public-body-luxe .public-map-grid,
    body.public-body-luxe .site-footer.site-footer-public .site-footer-grid {
        grid-template-columns: 1fr;
    }

    body.public-body-luxe .public-nav-drawer {
        min-height: auto;
    }

    body.public-body-luxe .public-kpi-grid,
    body.public-body-luxe .public-feature-grid,
    body.public-body-luxe .public-hero-meta,
    body.public-body-luxe .public-schedule-grid,
    body.public-body-luxe .public-map-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.public-body-luxe .section-head.section-head-split {
        grid-template-columns: 1fr;
    }

    body.public-body-luxe .public-map-head-badges {
        justify-content: flex-start;
    }
}

@media (max-width: 760px) {
    body.public-body-luxe .public-header {
        padding: 14px 0 10px;
    }

    body.public-body-luxe .public-header-shell,
    body.public-body-luxe .public-main {
        width: min(100vw - 24px, 100%);
    }

    body.public-body-luxe .public-header-shell {
        grid-template-columns: 1fr auto;
        padding: 12px;
        border-radius: 22px;
    }

    body.public-body-luxe .public-brand {
        min-height: 88px;
        padding: 12px 14px;
        border-radius: 20px;
    }

    body.public-body-luxe .public-brand-media {
        width: 64px;
        min-height: 64px;
        border-radius: 18px;
    }

    body.public-body-luxe .public-hero-grid,
    body.public-body-luxe .public-kpi-grid,
    body.public-body-luxe .public-feature-grid,
    body.public-body-luxe .public-schedule-grid,
    body.public-body-luxe .public-hero-meta,
    body.public-body-luxe .public-map-summary,
    body.public-body-luxe .site-footer.site-footer-public .site-footer-grid {
        grid-template-columns: 1fr;
    }

    body.public-body-luxe .public-hero,
    body.public-body-luxe .public-schedule-section,
    body.public-body-luxe .public-map-section,
    body.public-body-luxe .site-footer.site-footer-public {
        border-radius: 24px;
    }

    body.public-body-luxe .public-hero-grid,
    body.public-body-luxe .public-schedule-section,
    body.public-body-luxe .public-map-section {
        padding: 18px;
    }

    body.public-body-luxe .public-hero-copy h2 {
        font-size: 2.7rem;
        max-width: none;
    }

    body.public-body-luxe .public-slider {
        min-height: 280px;
    }

    body.public-body-luxe .public-map {
        min-height: 300px;
    }

    body.public-body-luxe .public-map-topline {
        flex-direction: column;
        align-items: flex-start;
    }

    body.public-body-luxe .public-map-topline-note {
        text-align: left;
    }
}

/* 2026-03-24 portal refinement */
body.public-body-luxe {
    --portal-line-soft: rgba(20, 44, 41, 0.08);
    --portal-surface-soft: rgba(255, 252, 247, 0.82);
    --portal-surface-plain: rgba(255, 255, 255, 0.82);
    --portal-shadow-soft: 0 18px 42px rgba(19, 42, 39, 0.08);
    background:
        radial-gradient(circle at top left, rgba(188, 145, 80, 0.1), transparent 26%),
        linear-gradient(180deg, #f6f1e8 0%, #eff4ee 44%, #f8fbf7 100%);
}

body.public-body-luxe::before {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.16) 0%, rgba(255, 255, 255, 0) 36%);
    opacity: 0.55;
}

body.public-body-luxe .public-header {
    padding: 14px 0 10px;
    background: linear-gradient(180deg, rgba(246, 241, 232, 0.92) 0%, rgba(246, 241, 232, 0.72) 65%, rgba(246, 241, 232, 0) 100%);
}

body.public-body-luxe .public-header-shell,
body.public-body-luxe .public-main {
    width: min(1240px, calc(100vw - 44px));
}

body.public-body-luxe .public-header-shell {
    grid-template-columns: minmax(260px, 372px) minmax(0, 1fr);
    gap: 14px;
    padding: 12px 14px;
    border-radius: 24px;
    border-color: var(--portal-line-soft);
    background: rgba(255, 252, 247, 0.82);
    box-shadow: 0 16px 40px rgba(19, 42, 39, 0.08);
}

body.public-body-luxe .public-brand {
    min-height: 82px;
    gap: 14px;
    padding: 12px 16px;
    border-radius: 20px;
    background: linear-gradient(135deg, #173734 0%, #1f5049 54%, #265d55 100%);
}

body.public-body-luxe .public-brand-media {
    width: 66px;
    min-height: 66px;
    border-radius: 18px;
}

body.public-body-luxe .public-brand.public-brand-logo-focus {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    min-height: 96px;
    padding: 10px 18px;
}

body.public-body-luxe .public-brand.public-brand-logo-focus .public-brand-media {
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(100%, 340px);
    min-height: 92px;
    height: 92px;
    border-radius: 16px;
    background: transparent;
    border: 0;
    box-shadow: none;
    margin: 0 auto;
    overflow: hidden;
}

body.public-body-luxe .public-brand.public-brand-logo-focus .public-brand-media img {
    display: block;
    width: auto;
    height: auto;
    max-width: 96%;
    max-height: 96%;
    padding: 0;
    object-fit: contain;
    object-position: center center;
    transform: translate(10px, 12px) scale(2.3);
    transform-origin: center center;
    filter: drop-shadow(0 8px 18px rgba(2, 28, 34, 0.16));
    margin: auto;
}

body.public-body-luxe .public-brand-copy {
    gap: 4px;
}

body.public-body-luxe .public-brand-kicker {
    font-size: 0.68rem;
    letter-spacing: 0.18em;
}

body.public-body-luxe .public-brand-title {
    font-size: 1.18rem;
}

body.public-body-luxe .public-brand-subtitle {
    font-size: 0.8rem;
}

body.public-body-luxe .public-nav-drawer {
    min-height: auto;
    gap: 12px;
}

body.public-body-luxe .public-nav {
    gap: 8px;
}

body.public-body-luxe .public-nav-link,
body.public-body-luxe .public-header .btn-primary,
body.public-body-luxe .public-header-actions .btn-primary {
    min-height: 42px;
}

body.public-body-luxe .public-nav-link {
    padding: 0 15px;
    font-size: 0.88rem;
    background: rgba(255, 255, 255, 0.74);
}

body.public-body-luxe .public-header .btn-primary,
body.public-body-luxe .public-header-actions .btn-primary,
body.public-body-luxe .public-main .btn-primary,
body.public-body-luxe .public-header .btn-soft,
body.public-body-luxe .public-header-actions .btn-soft,
body.public-body-luxe .public-main .btn-soft {
    min-height: 44px;
    padding: 0 18px;
}

body.public-body-luxe .public-main {
    gap: 18px;
    padding-top: 6px;
}

body.public-body-luxe .public-hero,
body.public-body-luxe .public-schedule-section,
body.public-body-luxe .public-map-section,
body.public-body-luxe .site-footer.site-footer-public {
    border-color: var(--portal-line-soft);
    box-shadow: var(--portal-shadow-soft);
}

body.public-body-luxe .public-hero {
    background-image: none;
}

body.public-body-luxe .public-schedule-section::before,
body.public-body-luxe .public-map-section::before {
    display: none;
}

body.public-body-luxe .public-hero {
    border-radius: 30px;
    background:
        radial-gradient(circle at top right, rgba(234, 216, 182, 0.12), transparent 24%),
        linear-gradient(135deg, #153632 0%, #1f4e48 54%, #255e55 100%);
}

body.public-body-luxe .public-hero::before {
    inset: auto -10% -36% 58%;
    height: 74%;
    opacity: 0.72;
}

body.public-body-luxe .public-hero-grid {
    grid-template-columns: minmax(0, 1.02fr) minmax(330px, 0.98fr);
    gap: 24px;
    padding: clamp(28px, 3vw, 38px);
    align-items: center;
}

body.public-body-luxe .public-chip {
    min-height: 30px;
    padding: 0 12px;
    font-size: 0.7rem;
    letter-spacing: 0.16em;
}

body.public-body-luxe .public-hero-copy h2,
body.public-body-luxe .section-head h3,
body.public-body-luxe .public-schedule-featured h4 {
    font-family: "Manrope", sans-serif;
}

body.public-body-luxe .public-hero-copy h2 {
    max-width: 12ch;
    margin: 14px 0 12px;
    font-size: clamp(2.65rem, 4.8vw, 4.5rem);
    font-weight: 800;
    line-height: 0.96;
    letter-spacing: -0.06em;
}

body.public-body-luxe .public-hero-lead {
    max-width: 34rem;
    margin-bottom: 10px;
    font-size: 1.02rem;
    color: #f2e2c3;
}

body.public-body-luxe .public-hero-subtext {
    max-width: 34rem;
    font-size: 0.94rem;
    line-height: 1.72;
    color: rgba(241, 246, 242, 0.8);
}

body.public-body-luxe .public-hero-actions {
    gap: 10px;
    margin-top: 18px;
}

body.public-body-luxe .public-trust-row {
    gap: 8px;
    margin-top: 14px;
}

body.public-body-luxe .public-trust-row span {
    min-height: 38px;
    padding: 8px 12px;
    font-size: 0.8rem;
    border-radius: 999px;
}

body.public-body-luxe .public-hero-meta {
    margin-top: 18px;
    gap: 10px;
}

body.public-body-luxe .public-hero-meta-card {
    padding: 12px 14px;
    border-radius: 16px;
}

body.public-body-luxe .public-hero-meta-card strong {
    margin: 8px 0 4px;
    font-size: 1.02rem;
}

body.public-body-luxe .public-hero-meta-card small {
    font-size: 0.8rem;
    line-height: 1.5;
}

body.public-body-luxe .public-slider-card {
    gap: 10px;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

body.public-body-luxe .public-slider {
    min-height: 402px;
    border-radius: 26px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(220, 234, 231, 0.88);
    box-shadow: 0 18px 34px rgba(13, 29, 28, 0.18);
}

body.public-body-luxe .slide-btn {
    width: 42px;
    height: 42px;
    box-shadow: 0 10px 22px rgba(19, 42, 39, 0.14);
}

body.public-body-luxe .public-slider-caption {
    padding: 0 4px;
}

body.public-body-luxe .public-slider-caption strong {
    color: #fbf7ef;
}

body.public-body-luxe .public-slider-caption span {
    color: rgba(241, 246, 242, 0.72);
}

body.public-body-luxe .public-kpi-grid {
    gap: 12px;
}

body.public-body-luxe .public-kpi-card {
    min-height: 94px;
    padding: 16px 18px;
    border-radius: 18px;
    background: var(--portal-surface-soft);
    box-shadow: 0 12px 28px rgba(19, 42, 39, 0.05);
}

body.public-body-luxe .public-kpi-card i {
    width: 48px;
    height: 48px;
    border-radius: 15px;
    font-size: 1rem;
}

body.public-body-luxe .public-kpi-card strong {
    font-size: 1.32rem;
}

body.public-body-luxe .public-kpi-card span {
    margin-top: 5px;
    font-size: 0.88rem;
    line-height: 1.5;
}

body.public-body-luxe .public-feature-grid {
    gap: 14px;
}

body.public-body-luxe .public-feature-card {
    gap: 14px;
    padding: 18px 20px;
    border-radius: 20px;
    background: rgba(255, 252, 247, 0.72);
    box-shadow: 0 12px 28px rgba(19, 42, 39, 0.04);
}

body.public-body-luxe .public-feature-card i {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    font-size: 1rem;
}

body.public-body-luxe .public-feature-card h3 {
    font-size: 1.02rem;
}

body.public-body-luxe .public-feature-card p {
    font-size: 0.9rem;
    line-height: 1.7;
}

body.public-body-luxe .public-schedule-section,
body.public-body-luxe .public-map-section {
    padding: 26px 28px;
    border-radius: 28px;
    background: var(--portal-surface-soft);
}

body.public-body-luxe .section-head {
    gap: 6px;
    margin-bottom: 18px;
}

body.public-body-luxe .section-head h3 {
    font-size: clamp(1.8rem, 3vw, 2.4rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.04em;
}

body.public-body-luxe .section-head p {
    max-width: 640px;
    font-size: 0.92rem;
    line-height: 1.68;
}

body.public-body-luxe .public-schedule-layout {
    gap: 14px;
}

body.public-body-luxe .public-schedule-featured {
    padding: 22px;
    border-radius: 22px;
    background: linear-gradient(135deg, #163834 0%, #1e5049 58%, #255c53 100%);
}

body.public-body-luxe .public-schedule-featured h4 {
    font-size: 1.62rem;
    line-height: 1.04;
    letter-spacing: -0.04em;
}

body.public-body-luxe .public-schedule-grid {
    gap: 14px;
}

body.public-body-luxe .public-schedule-card,
body.public-body-luxe .public-schedule-compact-card {
    padding: 18px;
    border-radius: 18px;
    background: var(--portal-surface-plain);
}

body.public-body-luxe .public-schedule-card h4 {
    font-size: 1rem;
}

body.public-body-luxe .public-map-grid {
    gap: 14px;
}

body.public-body-luxe .public-map-head-badges {
    gap: 8px;
}

body.public-body-luxe .public-map-head-badges span {
    min-height: 34px;
    padding: 0 12px;
    font-size: 0.78rem;
}

body.public-body-luxe .public-map-wrap {
    padding: 14px;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.86);
    box-shadow: none;
}

body.public-body-luxe .public-map-topline {
    margin-bottom: 10px;
}

body.public-body-luxe .public-map {
    min-height: 376px;
    border-radius: 18px;
    border-color: var(--portal-line-soft);
    box-shadow: none;
}

body.public-body-luxe .public-map-summary {
    gap: 12px;
}

body.public-body-luxe .public-map-summary-card,
body.public-body-luxe .public-map-aside-card {
    padding: 18px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.84);
}

body.public-body-luxe .public-map-summary-card strong {
    font-size: 1.18rem;
}

body.public-body-luxe .public-map-summary-card.accent,
body.public-body-luxe .public-map-aside-card.accent {
    background: linear-gradient(135deg, #173935 0%, #1f4f48 60%, #275d55 100%);
}

body.public-body-luxe .site-footer.site-footer-public {
    border-radius: 28px;
    background: rgba(255, 252, 247, 0.86);
}

body.public-body-luxe .site-footer.site-footer-public .site-footer-shell {
    padding: 18px 18px 14px;
}

body.public-body-luxe .site-footer.site-footer-public .site-footer-card {
    padding: 14px 15px 13px;
    border-radius: 16px;
}

@media (max-width: 1180px) {
    body.public-body-luxe .public-header-shell {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    body.public-body-luxe .public-nav-drawer {
        justify-content: space-between;
    }

    body.public-body-luxe .public-hero-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    body.public-body-luxe .public-header-shell,
    body.public-body-luxe .public-main {
        width: min(100vw - 20px, 100%);
    }

    body.public-body-luxe .public-header-shell {
        padding: 10px;
        border-radius: 20px;
    }

    body.public-body-luxe .public-brand {
        min-height: 74px;
        padding: 10px 12px;
    }

    body.public-body-luxe .public-brand-media {
        width: 54px;
        min-height: 54px;
        border-radius: 15px;
    }

    body.public-body-luxe .public-brand.public-brand-logo-focus {
        min-height: 82px;
        padding: 8px 10px;
    }

    body.public-body-luxe .public-brand.public-brand-logo-focus .public-brand-media {
        width: min(100%, 260px);
        min-height: 72px;
        height: 72px;
    }

    body.public-body-luxe .public-brand.public-brand-logo-focus .public-brand-media img {
        transform: translate(8px, 10px) scale(2.05);
    }

    body.public-body-luxe .public-nav-drawer {
        align-items: stretch;
        gap: 10px;
    }

    body.public-body-luxe .public-hero,
    body.public-body-luxe .public-schedule-section,
    body.public-body-luxe .public-map-section,
    body.public-body-luxe .site-footer.site-footer-public {
        border-radius: 22px;
    }

    body.public-body-luxe .public-hero-grid,
    body.public-body-luxe .public-schedule-section,
    body.public-body-luxe .public-map-section {
        padding: 18px;
    }

    body.public-body-luxe .public-hero-copy h2 {
        max-width: none;
        font-size: 2.35rem;
    }

    body.public-body-luxe .public-slider {
        min-height: 260px;
    }

    body.public-body-luxe .public-map {
        min-height: 288px;
    }
}

/* 2026-03-24 align saved header logos with settings preview */
.auth-header-shell .public-brand .public-brand-media,
.login-body .public-brand .public-brand-media {
    display: grid;
    place-items: center;
    overflow: hidden;
}

.auth-header-shell .public-brand .public-brand-media img,
.login-body .public-brand .public-brand-media img {
    width: auto;
    height: auto;
    max-width: min(100%, calc(70px * var(--header-logo-scale, 1)));
    max-height: min(100%, calc(70px * var(--header-logo-scale, 1)));
    padding: 0;
    object-fit: contain;
    object-position: center center;
    transform: none;
    filter: drop-shadow(0 8px 18px rgba(2, 28, 34, 0.16));
}

body.public-body-luxe .public-brand.public-brand-logo-focus {
    justify-content: center;
    min-height: 96px;
    padding: 10px 18px;
}

body.public-body-luxe .public-brand.public-brand-logo-focus .public-brand-media {
    display: grid;
    place-items: center;
    width: min(100%, 320px);
    min-height: 92px;
    height: 92px;
    padding: 0 10px;
    border-radius: 16px;
    background: transparent;
    border: 0;
    box-shadow: none;
    margin: 0 auto;
    overflow: hidden;
}

body.public-body-luxe .public-brand.public-brand-logo-focus .public-brand-media img {
    display: block;
    width: auto;
    height: auto;
    max-width: min(100%, calc(300px * var(--header-logo-scale, 1)));
    max-height: min(84px, calc(76px * var(--header-logo-scale, 1)));
    padding: 0;
    object-fit: contain;
    object-position: center center;
    transform: none;
    transform-origin: center center;
    filter: drop-shadow(0 8px 18px rgba(2, 28, 34, 0.16));
    margin: 0 auto;
}

.internal-body .topbar-brand .brand-badge.brand-badge-logo-only {
    max-width: 220px;
    min-height: 88px;
    padding: 10px 16px;
    border-radius: 24px;
}

.internal-body .topbar-brand .brand-badge.brand-badge-logo-only .brand-logo-image {
    display: block;
    width: auto;
    height: auto;
    max-width: min(100%, calc(136px * var(--header-logo-scale, 1)));
    max-height: min(74px, calc(56px * var(--header-logo-scale, 1)));
    padding: 0;
    object-fit: contain;
    object-position: center center;
    transform: none;
    filter: drop-shadow(0 8px 18px rgba(3, 32, 29, 0.18));
    margin: 0 auto;
}

@media (max-width: 920px) {
    body.public-body-luxe .public-brand.public-brand-logo-focus .public-brand-media {
        width: min(100%, 280px);
        min-height: 80px;
        height: 80px;
    }

    body.public-body-luxe .public-brand.public-brand-logo-focus .public-brand-media img {
        max-width: min(100%, calc(252px * var(--header-logo-scale, 1)));
        max-height: min(72px, calc(64px * var(--header-logo-scale, 1)));
    }

    .internal-body .topbar-brand .brand-badge.brand-badge-logo-only {
        max-width: 188px;
        min-height: 76px;
        padding: 8px 12px;
    }

    .internal-body .topbar-brand .brand-badge.brand-badge-logo-only .brand-logo-image {
        max-width: min(100%, calc(120px * var(--header-logo-scale, 1)));
        max-height: min(64px, calc(50px * var(--header-logo-scale, 1)));
    }
}

@media (max-width: 760px) {
    body.public-body-luxe .public-brand.public-brand-logo-focus .public-brand-media {
        width: min(100%, 260px);
        min-height: 72px;
        height: 72px;
    }

    body.public-body-luxe .public-brand.public-brand-logo-focus .public-brand-media img {
        max-width: min(100%, calc(228px * var(--header-logo-scale, 1)));
        max-height: min(64px, calc(56px * var(--header-logo-scale, 1)));
    }
}

@media (max-width: 640px) {
    .internal-body .topbar-brand .brand-badge.brand-badge-logo-only {
        max-width: 164px;
        min-height: 68px;
        padding: 8px 10px;
    }

    .internal-body .topbar-brand .brand-badge.brand-badge-logo-only .brand-logo-image {
        max-width: min(100%, calc(100px * var(--header-logo-scale, 1)));
        max-height: min(56px, calc(44px * var(--header-logo-scale, 1)));
    }
}

/* 2026-03-24 question builder refinement */
.question-workspace-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr);
    gap: 18px;
    margin-bottom: 20px;
    padding: 22px;
    border: 1px solid #d8e8e5;
    border-radius: 24px;
    background:
        radial-gradient(circle at top right, rgba(255, 255, 255, 0.84), transparent 30%),
        linear-gradient(180deg, #ffffff 0%, #f6fbfb 100%);
    box-shadow: 0 18px 36px rgba(14, 73, 68, 0.07);
}

.question-workspace-copy h2 {
    margin: 8px 0 10px;
    color: #12353a;
}

.question-workspace-copy p {
    margin: 0;
    max-width: 64ch;
    color: #638085;
    line-height: 1.68;
}

.question-workspace-kicker {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(16, 138, 126, 0.08);
    color: #0b7b71;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.question-workspace-notes {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}

.question-workspace-notes span,
.question-result-pill {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid #d5e5e2;
    background: #ffffff;
    color: #31555a;
    font-size: 0.84rem;
    font-weight: 700;
}

.question-result-pill.muted {
    background: #f8fcfb;
    color: #56767b;
}

.question-workspace-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.question-mini-stat {
    padding: 16px 18px;
    border-radius: 20px;
    border: 1px solid #d7e7e4;
    background: linear-gradient(180deg, #ffffff 0%, #f8fcfc 100%);
}

.question-mini-stat span {
    display: block;
    color: #6d878b;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.question-mini-stat strong {
    display: block;
    margin: 10px 0 4px;
    color: #10353a;
    font-size: 1.6rem;
}

.question-mini-stat small {
    color: #698489;
    line-height: 1.55;
}

.question-builder-form {
    gap: 18px;
}

.question-ops-bar {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 18px;
}

.question-ops-main {
    display: grid;
    grid-template-columns: minmax(280px, 1.25fr) minmax(210px, 0.75fr);
    gap: 14px;
    width: min(760px, 100%);
}

.question-search-wrap,
.question-filter-wrap {
    display: grid;
    gap: 8px;
}

.question-search-wrap label,
.question-filter-wrap label {
    font-weight: 700;
    color: #17383d;
}

.question-search-input {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 52px;
    padding: 0 14px;
    border: 1px solid #d5e6e3;
    border-radius: 16px;
    background: #ffffff;
}

.question-search-input i {
    color: #638085;
}

.question-search-input input {
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    box-shadow: none;
    padding: 0;
}

.question-search-input input:focus {
    border: 0;
    box-shadow: none;
}

.question-filter-wrap select {
    min-height: 52px;
}

.question-ops-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.question-card-list-refined {
    gap: 14px;
}

.question-editor-card-refined {
    padding: 18px;
    border-radius: 20px;
    background: linear-gradient(180deg, #ffffff 0%, #fbfdfd 100%);
}

.question-editor-head-refined {
    align-items: center;
    gap: 14px;
}

.question-editor-ident {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    min-width: 0;
    flex: 1 1 auto;
}

.question-editor-title-block {
    min-width: 0;
}

.question-editor-title-block h3 {
    margin: 0 0 4px;
    font-size: 1.08rem;
}

.question-editor-title-block p {
    margin: 0;
    color: #698287;
}

.question-card-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

.question-card-chip {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 12px;
    border-radius: 999px;
    background: #f2f8f7;
    border: 1px solid #d8e7e4;
    color: #31575c;
    font-size: 0.77rem;
    font-weight: 800;
}

.question-card-chip.type {
    background: #edf7f5;
    color: #0f746a;
}

.question-card-chip.mapped {
    background: #f8fbfc;
    color: #5b7a80;
}

.question-card-chip.required {
    background: #fff4df;
    border-color: #f1d6a0;
    color: #9b6b12;
}

.question-card-chip.active {
    background: #eaf8f3;
    border-color: #bfe5d4;
    color: #0f7a52;
}

.question-card-chip.muted {
    background: #f4f7f8;
    border-color: #dce7e9;
    color: #6f878d;
}

.question-editor-flags-refined {
    align-items: center;
}

.question-switch {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid #d8e7e4;
    background: #fff;
    color: #34545a;
    font-weight: 700;
}

.question-switch input {
    accent-color: #0d8f82;
}

.question-editor-details {
    margin-top: 16px;
    border-top: 1px dashed #d7e6e4;
    padding-top: 14px;
}

.question-editor-details summary {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: center;
    cursor: pointer;
    list-style: none;
    font-weight: 700;
    color: #17383d;
}

.question-editor-details summary::-webkit-details-marker {
    display: none;
}

.question-editor-details summary small {
    color: #698388;
    font-weight: 500;
}

.question-editor-grid-refined {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 16px;
    margin-top: 16px;
}

.question-editor-grid-refined .span-2,
.question-editor-grid-refined .span-3,
.question-editor-grid-refined .span-4 {
    grid-column: 1 / -1;
}

.question-editor-grid-refined label {
    display: block;
    margin-bottom: 8px;
    font-weight: 700;
    color: #17383d;
}

.question-editor-grid-refined input,
.question-editor-grid-refined select,
.question-editor-grid-refined textarea {
    width: 100%;
}

.question-new-box.premium-add-question {
    padding: 22px;
    border-radius: 22px;
    border: 1px solid #d9e8e5;
    background: linear-gradient(180deg, #ffffff 0%, #f7fbfb 100%);
}

.question-new-hints {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.question-editor-checks-refined {
    margin-top: 18px;
}

@media (max-width: 1200px) {
    .question-workspace-toolbar {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 980px) {
    .question-ops-bar,
    .question-ops-main {
        grid-template-columns: 1fr;
        width: 100%;
    }

    .question-ops-bar {
        display: grid;
    }

    .question-ops-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 860px) {
    .question-workspace-stats {
        grid-template-columns: 1fr 1fr;
    }

    .question-editor-head-refined {
        align-items: flex-start;
    }

    .question-editor-ident,
    .question-editor-head-refined,
    .question-editor-flags-refined {
        flex-direction: column;
    }

    .question-editor-grid-refined {
        grid-template-columns: 1fr;
    }

    .question-switch,
    .question-ops-actions > *,
    .sticky-form-actions > * {
        width: 100%;
        justify-content: center;
    }

    .sticky-form-actions {
        align-items: stretch;
    }
}

@media (max-width: 640px) {
    .question-workspace-toolbar,
    .question-new-box.premium-add-question,
    .question-editor-card-refined {
        padding: 16px;
    }

    .question-workspace-stats {
        grid-template-columns: 1fr;
    }

    .question-editor-index {
        width: 44px;
        height: 44px;
        border-radius: 14px;
    }

    .question-editor-details summary {
        flex-direction: column;
        align-items: flex-start;
    }
}

.question-new-inline-tools,
.question-preset-groups {
    display: grid;
    gap: 14px;
    margin-top: 16px;
}

.question-new-inline-tools {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.question-preset-groups {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.question-preset-block {
    display: grid;
    gap: 8px;
}

.question-preset-block strong {
    color: #17383d;
    font-size: 0.86rem;
}

.question-preset-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.question-preset-row.compact {
    gap: 6px;
}

.question-preset-chip {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid #cfe3df;
    background: #eef8f6;
    color: #0f776d;
    font-size: 0.82rem;
    font-weight: 700;
    cursor: pointer;
    transition: transform 0.18s ease, background 0.18s ease, border-color 0.18s ease;
}

.question-preset-chip:hover {
    transform: translateY(-1px);
    background: #e4f4f0;
    border-color: #b8d9d1;
}

.question-preset-chip.subtle {
    background: #ffffff;
    color: #41656a;
}

.question-new-grid-primary {
    margin-top: 18px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.question-new-grid-primary .span-2 {
    grid-column: span 2;
}

.question-new-advanced {
    margin-top: 16px;
    border-top: 1px dashed #d5e6e3;
    padding-top: 14px;
}

.question-new-advanced summary {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    cursor: pointer;
    list-style: none;
    color: #17383d;
    font-weight: 700;
}

.question-new-advanced summary::-webkit-details-marker {
    display: none;
}

.question-new-advanced summary small {
    color: #698388;
    font-weight: 500;
}

.question-new-grid-secondary {
    margin-top: 14px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.question-new-grid-secondary .span-2 {
    grid-column: span 2;
}

.question-new-grid-secondary .span-3 {
    grid-column: span 3;
}

.question-new-grid-secondary .span-4 {
    grid-column: 1 / -1;
}

.question-section-composer {
    display: grid;
    gap: 16px;
    margin-top: 18px;
    padding: 18px;
    border-radius: 20px;
    border: 1px solid #d7e7e4;
    background: linear-gradient(180deg, #fcfefe 0%, #f4faf9 100%);
}

.question-section-composer-copy {
    display: grid;
    gap: 6px;
}

.question-section-composer-copy strong {
    color: #16383d;
    font-size: 1rem;
}

.question-section-composer-copy p {
    margin: 0;
    color: #698388;
    line-height: 1.62;
}

.question-section-composer-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(260px, 0.9fr);
    gap: 16px;
    align-items: start;
}

.question-section-picker {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-content: flex-start;
}

.question-section-fields {
    display: grid;
    gap: 12px;
}

.question-section-preview {
    display: grid;
    gap: 8px;
    min-height: 100%;
    padding: 16px;
    border-radius: 18px;
    border: 1px solid #d2e4e0;
    background: linear-gradient(180deg, #ffffff 0%, #f7fbfb 100%);
}

.question-section-preview span {
    color: #6e878c;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.question-section-preview strong {
    color: #10353a;
    font-size: 1rem;
    line-height: 1.3;
}

.question-section-preview small {
    color: #6b858a;
    line-height: 1.6;
}

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

.question-lane {
    display: grid;
    gap: 12px;
    padding: 18px;
    border: 1px solid #d7e7e4;
    border-radius: 22px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fcfc 100%);
}

.question-lane-head {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: flex-start;
}

.question-lane-tools {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.question-lane-head h3 {
    margin: 0 0 4px;
    color: #15383d;
}

.question-lane-head p {
    margin: 0;
    color: #698388;
    line-height: 1.55;
}

.question-lane-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    height: 42px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px solid #cfe2de;
    background: #eef8f6;
    color: #0f776d;
    font-weight: 800;
}

.question-lane-list {
    display: grid;
    gap: 14px;
    min-height: 180px;
    padding: 8px;
    border: 1px dashed #d4e6e2;
    border-radius: 18px;
    background: #f7fbfb;
    transition: border-color 0.18s ease, background 0.18s ease;
}

.question-lane-list:empty::after {
    content: "Tarik pertanyaan ke sini";
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 84px;
    border-radius: 14px;
    color: #7a9397;
    font-weight: 700;
    background: rgba(255, 255, 255, 0.68);
}

.question-lane-list.is-drag-over {
    border-color: #7ab8ae;
    background: #eef8f6;
}

.question-lane-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid #d3e4e1;
    background: #ffffff;
    color: #36585d;
    font-size: 0.84rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

.question-lane-toggle:hover {
    background: #f4faf9;
    border-color: #c1ddd7;
    color: #17383d;
}

.question-lane.is-collapsed {
    gap: 0;
}

.question-lane.is-collapsed .question-lane-head {
    margin-bottom: 0;
}

.question-card-staging {
    display: none !important;
}

.question-editor-card-refined {
    cursor: grab;
}

.question-editor-card-refined.is-dragging {
    opacity: 0.6;
    transform: scale(0.985);
}

.question-drag-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 0 12px;
    border-radius: 999px;
    border: 1px dashed #bdd7d1;
    color: #4a6b70;
    background: #f8fcfc;
    font-size: 0.82rem;
    font-weight: 700;
    cursor: grab;
}

.question-editor-flags-refined {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}

.question-section-panel {
    display: grid;
    gap: 4px;
    margin-top: 12px;
    padding: 12px 14px;
    border-radius: 16px;
    border: 1px solid #d8e7e4;
    background: linear-gradient(180deg, #f9fcfc 0%, #f1f7f6 100%);
}

.question-section-panel-kicker {
    color: #6d868b;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.question-section-panel strong {
    color: #13363b;
    font-size: 0.98rem;
    line-height: 1.3;
}

.question-section-panel small {
    color: #6b8489;
    line-height: 1.55;
}

@media (max-width: 1080px) {
    .question-new-grid-primary,
    .question-new-grid-secondary,
    .question-board,
    .question-new-inline-tools,
    .question-preset-groups,
    .question-section-composer-grid {
        grid-template-columns: 1fr;
    }

    .question-new-grid-primary .span-2,
    .question-new-grid-secondary .span-2,
    .question-new-grid-secondary .span-3,
    .question-new-grid-secondary .span-4 {
        grid-column: 1 / -1;
    }
}

@media (max-width: 860px) {
    .question-lane {
        padding: 14px;
    }

    .question-lane-head,
    .question-lane-tools {
        flex-direction: column;
        align-items: flex-start;
    }

    .question-lane-list {
        min-height: 120px;
    }

    .question-preset-row {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 4px;
    }

    .question-preset-chip {
        white-space: nowrap;
    }

.question-new-advanced summary {
        flex-direction: column;
        align-items: flex-start;
    }

    .question-section-composer {
        padding: 14px;
    }
}

.settings-showcase-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.settings-media-preview-card {
    position: relative;
    overflow: hidden;
    border-radius: 22px;
    border: 1px solid #d8e7e4;
    background: #eef6f5;
}

.settings-media-preview-card .slide-preview {
    width: 100%;
    height: 230px;
    object-fit: cover;
    display: block;
}

.settings-media-preview-copy {
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 14px;
    display: grid;
    gap: 6px;
    padding: 14px 16px;
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(16, 36, 35, 0.28) 0%, rgba(12, 30, 28, 0.86) 100%);
    color: #fff;
    backdrop-filter: blur(10px);
}

.settings-media-preview-copy span {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    color: #f4dfbb;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.settings-media-preview-copy strong {
    color: #ffffff;
    font-size: 1.04rem;
    line-height: 1.3;
}

.settings-media-preview-copy small {
    color: rgba(240, 248, 246, 0.88);
    font-size: 0.84rem;
    line-height: 1.55;
}

.settings-copy-grid.compact {
    margin-top: 14px;
    grid-template-columns: 1fr 1fr;
    gap: 12px 14px;
}

.settings-copy-grid.compact .span-2 {
    grid-column: 1 / -1;
}

body.public-body-luxe .public-hero-grid.public-hero-grid-media {
    grid-template-columns: 1fr;
    gap: 22px;
    padding: clamp(24px, 3vw, 34px);
}

body.public-body-luxe .public-showcase-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
}

body.public-body-luxe .public-showcase-copy {
    display: grid;
    gap: 10px;
    max-width: 760px;
}

body.public-body-luxe .public-showcase-copy h2 {
    margin: 0;
    color: #fcf7ef;
    font-family: "Manrope", sans-serif;
    font-size: clamp(2rem, 3.8vw, 3rem);
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1.04;
}

body.public-body-luxe .public-showcase-copy p {
    margin: 0;
    color: rgba(239, 246, 243, 0.8);
    font-size: 0.98rem;
    line-height: 1.7;
}

body.public-body-luxe .public-showcase-actions {
    margin-top: 0;
    justify-content: flex-end;
    align-items: center;
}

body.public-body-luxe .public-slider-card.public-slider-card-showcase {
    gap: 16px;
    padding: 18px;
}

body.public-body-luxe .public-slider-card-showcase .public-slider {
    min-height: 520px;
    height: clamp(300px, 45vw, 520px);
}

body.public-body-luxe .public-slide-overlay {
    position: absolute;
    left: 18px;
    right: 18px;
    bottom: 18px;
    display: grid;
    gap: 8px;
    max-width: min(620px, calc(100% - 36px));
    padding: 18px 20px;
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(15, 31, 29, 0.16) 0%, rgba(12, 28, 27, 0.88) 100%);
    color: #fff;
    backdrop-filter: blur(10px);
}

body.public-body-luxe .public-slide-badge {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    min-height: 30px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    color: #f3ddbb;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

body.public-body-luxe .public-slide-overlay strong {
    color: #ffffff;
    font-size: clamp(1.2rem, 2vw, 1.6rem);
    line-height: 1.2;
}

body.public-body-luxe .public-slide-overlay p {
    margin: 0;
    color: rgba(239, 246, 243, 0.88);
    line-height: 1.65;
}

body.public-body-luxe .public-slider-caption.public-slider-caption-showcase {
    gap: 12px;
    padding: 0;
}

body.public-body-luxe .public-showcase-trust {
    margin-top: 0;
}

body.public-body-luxe .public-showcase-meta {
    margin-top: 0;
}

@media (max-width: 1100px) {
    .settings-showcase-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {
    body.public-body-luxe .public-showcase-head {
        flex-direction: column;
        align-items: flex-start;
    }

    body.public-body-luxe .public-showcase-actions {
        width: 100%;
        justify-content: flex-start;
    }

    body.public-body-luxe .public-showcase-actions > * {
        flex: 1 1 220px;
    }
}

@media (max-width: 760px) {
    .settings-copy-grid.compact {
        grid-template-columns: 1fr;
    }

    body.public-body-luxe .public-slider-card-showcase .public-slider {
        min-height: 320px;
    }

    body.public-body-luxe .public-slide-overlay {
        left: 12px;
        right: 12px;
        bottom: 12px;
        padding: 14px 15px;
    }
}

@media (max-width: 640px) {
    body.public-body-luxe .public-showcase-copy h2 {
        font-size: 1.6rem;
    }

    body.public-body-luxe .public-showcase-copy p {
        font-size: 0.9rem;
        line-height: 1.55;
    }

    body.public-body-luxe .public-showcase-actions {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }

    body.public-body-luxe .public-showcase-actions > * {
        width: 100%;
    }
}

/* 2026-03-24 make saved logo zoom visible */
.auth-header-shell .public-brand .public-brand-media,
.login-body .public-brand .public-brand-media,
body.public-body-luxe .public-brand.public-brand-logo-focus .public-brand-media,
.internal-body .topbar-brand .brand-badge.brand-badge-logo-only {
    overflow: hidden;
}

.auth-header-shell .public-brand .public-brand-media img,
.login-body .public-brand .public-brand-media img {
    width: auto !important;
    height: 44px !important;
    max-width: none !important;
    max-height: none !important;
    padding: 0 !important;
    object-fit: contain;
    object-position: center center;
    transform: scale(var(--header-logo-scale, 1)) !important;
    transform-origin: center center;
    filter: drop-shadow(0 8px 18px rgba(2, 28, 34, 0.16));
}

body.public-body-luxe .public-brand.public-brand-logo-focus .public-brand-media {
    width: min(100%, 320px);
    height: 92px;
    padding: 0;
}

body.public-body-luxe .public-brand.public-brand-logo-focus .public-brand-media img {
    width: auto !important;
    height: 40px !important;
    max-width: none !important;
    max-height: none !important;
    padding: 0 !important;
    object-fit: contain;
    object-position: center center;
    transform: scale(var(--header-logo-scale, 1)) !important;
    transform-origin: center center;
    filter: drop-shadow(0 8px 18px rgba(2, 28, 34, 0.16));
}

.internal-body .topbar-brand .brand-badge.brand-badge-logo-only {
    min-height: 84px;
    padding: 8px 14px;
}

.internal-body .topbar-brand .brand-badge.brand-badge-logo-only .brand-logo-image {
    width: 68px !important;
    height: 68px !important;
    max-width: none !important;
    max-height: none !important;
    padding: 0 !important;
    object-fit: contain;
    object-position: center center;
    transform: scale(var(--header-logo-scale, 1)) !important;
    transform-origin: center center;
    filter: drop-shadow(0 8px 18px rgba(3, 32, 29, 0.18));
}

@media (max-width: 760px) {
    body.public-body-luxe .public-brand.public-brand-logo-focus .public-brand-media {
        width: min(100%, 260px);
        height: 72px;
    }

    body.public-body-luxe .public-brand.public-brand-logo-focus .public-brand-media img {
        height: 34px !important;
    }
}

@media (max-width: 640px) {
    .auth-header-shell .public-brand .public-brand-media img,
    .login-body .public-brand .public-brand-media img {
        height: 38px !important;
    }

    .internal-body .topbar-brand .brand-badge.brand-badge-logo-only {
        min-height: 72px;
        padding: 8px 10px;
    }

    .internal-body .topbar-brand .brand-badge.brand-badge-logo-only .brand-logo-image {
        width: 56px !important;
        height: 56px !important;
    }
}

/* 2026-03-24 hero refinement */
body.public-body-luxe .public-hero {
    border-radius: 32px;
}

body.public-body-luxe .public-hero-grid {
    grid-template-columns: minmax(0, 0.96fr) minmax(400px, 1.04fr);
    gap: 26px;
    padding: clamp(28px, 3.4vw, 44px);
    align-items: center;
}

body.public-body-luxe .public-hero-copy {
    max-width: 560px;
}

body.public-body-luxe .public-hero-copy h2,
body.public-body-luxe .section-head h3,
body.public-body-luxe .public-schedule-featured h4 {
    font-family: "Manrope", sans-serif;
    letter-spacing: -0.06em;
}

body.public-body-luxe .public-hero-copy h2 {
    max-width: 11.5ch;
    margin: 16px 0 14px;
    font-size: clamp(2.95rem, 4.75vw, 4.85rem);
    line-height: 0.94;
}

body.public-body-luxe .public-hero-lead {
    max-width: 30ch;
    margin-bottom: 12px;
    font-size: 1.04rem;
    line-height: 1.45;
}

body.public-body-luxe .public-hero-subtext {
    max-width: 58ch;
    font-size: 0.95rem;
    line-height: 1.72;
}

body.public-body-luxe .public-hero-actions {
    margin-top: 20px;
}

body.public-body-luxe .public-trust-row {
    gap: 8px;
    margin-top: 16px;
}

body.public-body-luxe .public-trust-row span {
    min-height: 40px;
    padding: 9px 13px;
    font-size: 0.8rem;
}

body.public-body-luxe .public-hero-meta {
    margin-top: 22px;
    gap: 10px;
}

body.public-body-luxe .public-hero-meta-card {
    min-height: 126px;
    padding: 15px 16px;
    border-radius: 18px;
}

body.public-body-luxe .public-hero-meta-card strong {
    margin: 8px 0 5px;
    font-size: 1.08rem;
}

body.public-body-luxe .public-slider-card {
    padding: 12px;
    border-radius: 26px;
}

body.public-body-luxe .public-slider {
    min-height: clamp(340px, 31vw, 420px);
    aspect-ratio: 16 / 10;
    border-radius: 22px;
    background: linear-gradient(180deg, #d8ebe9 0%, #c6dddd 100%);
}

body.public-body-luxe .public-slide img {
    object-position: center center;
    filter: saturate(0.96) contrast(1.01);
}

body.public-body-luxe .public-slider-caption {
    gap: 4px;
    padding: 14px 8px 4px;
}

body.public-body-luxe .public-slider-caption strong {
    font-size: 0.98rem;
}

body.public-body-luxe .public-slider-caption span {
    font-size: 0.84rem;
    line-height: 1.5;
}

@media (max-width: 1360px) {
    body.public-body-luxe .public-hero-grid {
        grid-template-columns: minmax(0, 0.98fr) minmax(360px, 1.02fr);
    }

    body.public-body-luxe .public-hero-copy h2 {
        font-size: clamp(2.8rem, 4.2vw, 4.35rem);
    }
}

@media (max-width: 1180px) {
    body.public-body-luxe .public-hero-grid {
        grid-template-columns: 1fr;
    }

    body.public-body-luxe .public-hero-copy {
        max-width: none;
    }

    body.public-body-luxe .public-hero-copy h2 {
        max-width: 12ch;
    }

    body.public-body-luxe .public-slider-card {
        max-width: 760px;
    }
}

@media (max-width: 760px) {
    body.public-body-luxe .public-hero-copy h2 {
        font-size: 2.6rem;
        line-height: 0.98;
    }

    body.public-body-luxe .public-slider {
        min-height: 240px;
    }

    body.public-body-luxe .public-hero-meta {
        grid-template-columns: 1fr;
    }
}

/* 2026-03-24 compact public hero */
body.public-body-luxe .public-hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(360px, 0.94fr);
    gap: 22px;
    padding: clamp(22px, 3vw, 34px);
}

body.public-body-luxe .public-hero-copy h2 {
    max-width: 13.2ch;
    margin: 14px 0 12px;
    font-size: clamp(2.45rem, 4vw, 4.15rem);
    line-height: 0.96;
}

body.public-body-luxe .public-hero-lead {
    max-width: 34ch;
    margin-bottom: 10px;
    font-size: 1rem;
}

body.public-body-luxe .public-hero-subtext {
    max-width: 54ch;
    font-size: 0.92rem;
    line-height: 1.62;
}

body.public-body-luxe .public-hero-actions {
    margin-top: 16px;
    gap: 10px;
}

body.public-body-luxe .public-trust-row {
    gap: 8px;
    margin-top: 14px;
}

body.public-body-luxe .public-trust-row span {
    min-height: 36px;
    padding: 8px 12px;
    font-size: 0.76rem;
}

body.public-body-luxe .public-hero-meta {
    margin-top: 16px;
    gap: 8px;
}

body.public-body-luxe .public-hero-meta-card {
    min-height: 96px;
    padding: 12px 14px;
}

body.public-body-luxe .public-hero-meta-card span {
    font-size: 0.68rem;
}

body.public-body-luxe .public-hero-meta-card strong {
    margin: 6px 0 4px;
    font-size: 1rem;
}

body.public-body-luxe .public-hero-meta-card small {
    line-height: 1.45;
    font-size: 0.8rem;
}

body.public-body-luxe .public-slider-card {
    padding: 10px;
}

body.public-body-luxe .public-slider {
    min-height: clamp(280px, 26vw, 350px);
    aspect-ratio: 16 / 9.4;
}

body.public-body-luxe .public-slider-caption {
    padding: 10px 6px 2px;
}

body.public-body-luxe .public-slider-caption strong {
    font-size: 0.94rem;
}

body.public-body-luxe .public-slider-caption span {
    font-size: 0.82rem;
}

@media (max-width: 1180px) {
    body.public-body-luxe .public-hero-grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    body.public-body-luxe .public-slider-card {
        max-width: 720px;
    }
}

@media (max-width: 760px) {
    body.public-body-luxe .public-hero {
        border-radius: 24px;
    }

    body.public-body-luxe .public-hero-grid {
        padding: 16px;
        gap: 16px;
    }

    body.public-body-luxe .public-hero-copy h2 {
        max-width: 10.8ch;
        font-size: 2rem;
        line-height: 1;
    }

    body.public-body-luxe .public-hero-lead {
        max-width: none;
        font-size: 0.94rem;
    }

    body.public-body-luxe .public-hero-subtext,
    body.public-body-luxe .public-trust-row,
    body.public-body-luxe .public-hero-meta {
        display: none;
    }

    body.public-body-luxe .public-hero-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
    }

    body.public-body-luxe .public-hero-actions > * {
        width: 100%;
        justify-content: center;
    }

    body.public-body-luxe .public-slider {
        min-height: 220px;
        aspect-ratio: 16 / 10;
    }

    body.public-body-luxe .public-slider-caption {
        padding: 8px 4px 0;
    }

    body.public-body-luxe .public-slider-caption span {
        display: none;
    }
}

/* 2026-03-31 smartphone refinement */
@media (max-width: 767px) {
    .internal-body {
        overflow-x: hidden;
    }

    .internal-body .topbar {
        display: grid !important;
        position: sticky;
        top: 10px;
        z-index: 121;
        width: min(var(--sigap-shell-max), calc(100% - 16px));
        margin: 10px auto 12px;
        padding: 12px;
        gap: 12px;
        grid-template-columns: 1fr;
        border-radius: 20px;
        box-shadow: 0 18px 30px rgba(8, 59, 53, 0.14);
    }

    .internal-body .topbar-main {
        display: grid;
        gap: 10px;
        min-width: 0;
    }

    .internal-body .topbar-brand {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        width: 100%;
        min-width: 0;
    }

    .internal-body .topbar-brand .brand-badge.brand-badge-logo-only {
        flex: 0 1 auto;
        max-width: 150px;
        min-height: 60px;
        padding: 8px 10px;
        border-radius: 18px;
    }

    .internal-body .topbar-brand .brand-badge.brand-badge-logo-only .brand-logo-image {
        display: block;
        width: auto !important;
        height: auto !important;
        max-width: min(100%, calc(92px * var(--header-logo-scale, 1)));
        max-height: min(48px, calc(36px * var(--header-logo-scale, 1)));
        transform: none !important;
        margin: 0 auto;
    }

    .internal-body .internal-nav-toggle {
        display: inline-flex !important;
        flex: 0 0 auto;
        min-height: 46px;
        padding: 0 14px;
        border-radius: 16px;
    }

    .internal-body .topbar-heading {
        gap: 6px;
    }

    .internal-body .topbar-heading-kicker {
        min-height: 28px;
        padding: 0 10px;
        font-size: 0.68rem;
    }

    .internal-body .topbar-heading-copy h2 {
        font-size: 1rem;
        line-height: 1.15;
    }

    .internal-body .topbar-heading-copy p {
        display: none;
    }

    .internal-body .topbar-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
        width: 100%;
        justify-self: stretch;
    }

    .internal-body .topbar-tools,
    .internal-body .topbar-profile {
        width: 100%;
        min-width: 0;
        background: #ffffff;
        border-radius: 16px;
        padding: 8px;
    }

    .internal-body .topbar-tools {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: stretch;
        gap: 8px;
    }

    .internal-body .topbar-tools .ghost-btn {
        display: none;
    }

    .internal-body .topbar-clock {
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 44px;
        width: 100%;
        padding: 0 12px;
    }

    .internal-body .notif-dot {
        width: 44px;
        height: 44px;
        justify-self: end;
    }

    .internal-body .topbar-profile {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 8px;
    }

    .internal-body .topbar-profile .user-chip {
        width: 100%;
        min-width: 0;
        padding-right: 8px;
    }

    .internal-body .topbar-profile .user-meta {
        min-width: 0;
    }

    .internal-body .topbar-profile .user-meta strong,
    .internal-body .topbar-profile .user-meta small {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .internal-body .logout-btn {
        min-height: 44px;
        padding: 0 14px;
    }

    .internal-body .logout-btn span,
    .internal-nav-floating-toggle {
        display: none !important;
    }

    .internal-body .layout-with-sidebar {
        width: min(var(--sigap-shell-max), calc(100% - 16px));
        margin: 12px auto 20px;
        gap: 12px;
    }

    .internal-body .content-area {
        padding-top: 0;
        padding-bottom: 84px;
        gap: 12px;
    }

    .internal-body .sidebar {
        width: min(86vw, 320px);
        max-width: 320px;
        border-radius: 0 24px 24px 0;
    }

    .internal-body .sidebar-mobile-hero {
        padding: 16px 14px 10px;
    }

    .internal-body .sidebar-top {
        padding: 12px 12px 8px;
    }

    .internal-body .sidebar-link,
    .internal-body .sidebar-sublink {
        font-size: 0.92rem;
    }

    .question-workspace-toolbar,
    .measurement-toolbar,
    .question-workspace-stats,
    .dashboard-summary-grid,
    .dashboard-main-grid,
    .dashboard-trend-grid,
    .input-utility-grid,
    .settings-status-grid,
    .question-summary-grid,
    .history-summary-grid,
    .approvals-summary-grid,
    .wa-summary-grid,
    .settings-media-grid,
    .settings-slider-grid,
    .settings-copy-grid,
    .settings-showcase-grid,
    .question-board,
    .intervention-summary-grid {
        grid-template-columns: 1fr !important;
    }

    .settings-workspace-toolbar,
    .settings-section-head,
    .settings-form-actions,
    .settings-workspace-actions,
    .settings-section-actions,
    .question-lane-head,
    .question-lane-tools,
    .input-form-toolbar,
    .input-form-toolbar-actions,
    .input-form-toolbar-chips,
    .input-location-head,
    .history-record-toolbar,
    .history-record-actions,
    .history-export-actions,
    .table-head,
    .table-actions,
    .approval-priority-banner,
    .measurement-actions,
    .balita-export-actions,
    .balita-filter-actions,
    .approval-card-actions {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .settings-workspace-status,
    .dashboard-summary-head,
    .dashboard-list-title-row,
    .dashboard-inline-badge-stack,
    .approval-card-data-meta {
        flex-wrap: wrap;
        align-items: flex-start;
    }

    .dashboard-summary-card,
    .dashboard-panel-card,
    .settings-section,
    .question-lane,
    .question-section-composer,
    .input-page-content .input-location-card {
        padding: 16px;
        border-radius: 18px;
    }

    .dashboard-summary-card strong {
        font-size: 1.75rem;
    }

    .dashboard-summary-status,
    .dashboard-inline-badge {
        white-space: normal;
    }

    .dashboard-list-item {
        grid-template-columns: 1fr;
    }

    .dashboard-list-side {
        width: 100%;
        align-items: flex-start;
        text-align: left;
    }

    .dashboard-trend-controls,
    .dashboard-trend-switcher,
    .history-export-actions > *,
    .history-record-actions > *,
    .input-form-toolbar-actions > *,
    .table-actions > *,
    .settings-workspace-actions > *,
    .settings-section-actions > *,
    .measurement-actions > *,
    .balita-filter-actions > *,
    .balita-export-actions > * {
        width: 100%;
    }

    .table-wrap table {
        min-width: 560px;
    }
}

@media (max-width: 560px) {
    .internal-body .topbar {
        width: calc(100% - 12px);
        margin: 8px auto 10px;
        padding: 10px;
        border-radius: 18px;
    }

    .internal-body .topbar-brand .brand-badge.brand-badge-logo-only {
        max-width: 132px;
        min-height: 56px;
        padding: 8px;
    }

    .internal-body .topbar-brand .brand-badge.brand-badge-logo-only .brand-logo-image {
        max-width: min(100%, calc(84px * var(--header-logo-scale, 1)));
        max-height: min(42px, calc(32px * var(--header-logo-scale, 1)));
    }

    .internal-body .internal-nav-toggle {
        min-height: 42px;
        padding: 0 12px;
        font-size: 0.86rem;
    }

    .internal-body .topbar-heading-kicker {
        letter-spacing: 0.08em;
    }

    .internal-body .topbar-profile {
        grid-template-columns: 1fr;
    }

    .internal-body .logout-btn {
        width: 100%;
        justify-content: center;
    }

    .internal-body .layout-with-sidebar {
        width: calc(100% - 12px);
        margin: 10px auto 18px;
    }

    .internal-body .content-area {
        padding-bottom: 72px;
    }

    .internal-body .sidebar {
        width: min(88vw, 300px);
    }

.table-wrap table {
        min-width: 520px;
    }
}

.logout-form-inline,
.sidebar-link-form {
    margin: 0;
}

.logout-btn-button,
.sidebar-link-button {
    width: 100%;
    border: none;
    background: transparent;
    cursor: pointer;
    font: inherit;
    color: inherit;
    text-align: left;
}

.logout-btn-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.sidebar-link-button {
    display: inline-flex;
    align-items: center;
}

/* 2026-04-02 mobile topbar stabilization */
@media (max-width: 767px) {
    body.internal-body .topbar-brand .brand-badge.brand-badge-logo-only {
        width: min(132px, calc(100% - 88px));
        max-width: 132px;
        min-height: 56px;
        padding: 8px 10px;
        justify-content: center;
    }

    body.internal-body .topbar-brand .brand-badge.brand-badge-logo-only .brand-logo-image {
        width: auto !important;
        height: auto !important;
        max-width: 84px !important;
        max-height: 36px !important;
        transform: none !important;
        margin: 0 auto;
    }

    body.internal-body .topbar-profile {
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center;
    }

    body.internal-body .logout-btn {
        width: auto;
        min-width: 102px;
        padding: 0 14px;
        justify-content: center;
    }

    body.internal-body .logout-btn span {
        display: inline !important;
    }
}

@media (max-width: 560px) {
    body.internal-body .topbar {
        gap: 10px;
    }

    body.internal-body .topbar-brand {
        align-items: center;
    }

    body.internal-body .topbar-brand .brand-badge.brand-badge-logo-only {
        width: min(118px, calc(100% - 76px));
        max-width: 118px;
        min-height: 52px;
        padding: 7px 8px;
        border-radius: 16px;
    }

    body.internal-body .topbar-brand .brand-badge.brand-badge-logo-only .brand-logo-image {
        max-width: 74px !important;
        max-height: 32px !important;
    }

    body.internal-body .internal-nav-toggle {
        min-height: 42px;
        min-width: 42px;
        padding: 0 12px;
    }

    body.internal-body .topbar-profile {
        grid-template-columns: minmax(0, 1fr) auto !important;
    }

    body.internal-body .logout-btn {
        min-width: 42px;
        padding: 0 12px;
    }
}

/* 2026-04-03 design system refresh */
body.internal-body,
body.login-body {
    --sigap-surface-base: #f3fbf8;
    --sigap-surface-card: rgba(255, 255, 255, 0.92);
    --sigap-surface-muted: rgba(239, 248, 244, 0.9);
    --sigap-border-soft: rgba(19, 104, 88, 0.12);
    --sigap-shadow-card: 0 20px 44px rgba(16, 83, 74, 0.12);
    --sigap-shadow-soft: 0 12px 26px rgba(16, 83, 74, 0.08);
    --sigap-text-strong: #123632;
    --sigap-text-muted: #5b7570;
    --sigap-brand-deep: #0d8f82;
    --sigap-brand-soft: #dff7f1;
    --sigap-danger-soft: #fff0ef;
    --sigap-warning-soft: #fff7e5;
    --sigap-success-soft: #e8fbf3;
}

body.internal-body {
    background:
        radial-gradient(circle at top left, rgba(204, 245, 233, 0.72), transparent 28%),
        radial-gradient(circle at top right, rgba(255, 241, 224, 0.58), transparent 26%),
        linear-gradient(180deg, #f5fcf9 0%, #eef8f6 100%);
    color: var(--sigap-text-strong);
}

body.internal-body .layout-with-sidebar,
body.login-body .login-shell {
    width: min(1380px, calc(100% - 32px));
}

body.internal-body .content-area {
    min-width: 0;
    gap: 20px;
}

body.internal-body .topbar,
body.internal-body .sidebar,
body.internal-body .dashboard-summary-card,
body.internal-body .dashboard-panel-card,
body.internal-body .form-card,
body.internal-body .table-card,
body.internal-body .settings-section,
body.internal-body .question-lane,
body.internal-body .question-section-composer,
body.internal-body .history-record,
body.internal-body .measurement-record-card,
body.internal-body .recycle-hero,
body.login-body .login-card,
body.login-body .login-showcase {
    background: var(--sigap-surface-card);
    border: 1px solid var(--sigap-border-soft);
    box-shadow: var(--sigap-shadow-card);
}

body.internal-body .dashboard-summary-card,
body.internal-body .dashboard-panel-card,
body.internal-body .form-card,
body.internal-body .table-card,
body.internal-body .settings-section,
body.internal-body .question-lane,
body.internal-body .question-section-composer,
body.internal-body .history-record,
body.internal-body .measurement-record-card,
body.internal-body .recycle-hero {
    overflow: hidden;
}

body.internal-body h1,
body.internal-body h2,
body.internal-body h3,
body.login-body h1,
body.login-body h2,
body.login-body h3 {
    color: var(--sigap-text-strong);
    letter-spacing: -0.02em;
}

body.internal-body p,
body.internal-body .muted,
body.internal-body .muted-small,
body.login-body p {
    color: var(--sigap-text-muted);
}

body.internal-body .topbar {
    gap: 18px;
    padding: 16px 18px;
}

body.internal-body .topbar-main,
body.internal-body .topbar-actions,
body.internal-body .topbar-tools,
body.internal-body .topbar-profile {
    min-width: 0;
}

body.internal-body .topbar-heading-copy h2 {
    font-size: clamp(1.2rem, 1.1rem + 0.4vw, 1.6rem);
}

body.internal-body .topbar-heading-copy p {
    max-width: 54ch;
}

body.internal-body .topbar-tools {
    flex-wrap: wrap;
    gap: 10px;
}

body.internal-body .ghost-btn,
body.internal-body .btn-primary,
body.internal-body .btn-soft,
body.internal-body .btn-ghost,
body.internal-body .logout-btn,
body.login-body .btn-primary,
body.login-body .btn-soft {
    min-height: 44px;
    border-radius: 14px;
    font-weight: 700;
    box-shadow: none;
}

body.internal-body .btn-primary,
body.login-body .btn-primary {
    background: linear-gradient(135deg, #0d8f82 0%, #167465 100%);
}

body.internal-body .btn-soft,
body.internal-body .btn-ghost,
body.internal-body .ghost-btn,
body.login-body .btn-soft {
    background: rgba(255, 255, 255, 0.86);
    border: 1px solid rgba(19, 104, 88, 0.16);
}

body.internal-body .btn-soft:disabled,
body.internal-body .btn-primary:disabled,
body.internal-body .btn-ghost:disabled,
body.internal-body .ghost-btn:disabled {
    opacity: 0.58;
    cursor: not-allowed;
    filter: grayscale(0.08);
}

body.internal-body .sidebar {
    background:
        linear-gradient(180deg, rgba(11, 134, 118, 0.96) 0%, rgba(19, 122, 104, 0.98) 100%);
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: 0 24px 40px rgba(9, 95, 82, 0.22);
}

body.internal-body .sidebar-link,
body.internal-body .sidebar-sublink,
body.internal-body .sidebar-link-button {
    min-height: 46px;
    border-radius: 14px;
}

body.internal-body .sidebar-link.active,
body.internal-body .sidebar-sublink.active {
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
}

body.internal-body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.internal-body select,
body.internal-body textarea,
body.login-body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.login-body select,
body.login-body textarea {
    min-height: 46px;
    border-radius: 14px;
    border: 1px solid rgba(19, 104, 88, 0.16);
    background: rgba(255, 255, 255, 0.96);
    color: var(--sigap-text-strong);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.58);
}

body.internal-body textarea,
body.login-body textarea {
    min-height: 120px;
}

body.internal-body input:focus,
body.internal-body select:focus,
body.internal-body textarea:focus,
body.login-body input:focus,
body.login-body select:focus,
body.login-body textarea:focus {
    border-color: rgba(13, 143, 130, 0.54);
    box-shadow: 0 0 0 4px rgba(13, 143, 130, 0.14);
    outline: none;
}

body.internal-body .table-wrap {
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
    padding-bottom: 4px;
    -webkit-overflow-scrolling: touch;
}

body.internal-body .table-wrap table {
    min-width: 780px;
    border-collapse: separate;
    border-spacing: 0;
}

body.internal-body .table-wrap thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(234, 249, 243, 0.98) 0%, rgba(228, 246, 239, 0.98) 100%);
}

body.internal-body .table-wrap tbody tr:nth-child(even) {
    background: rgba(243, 251, 248, 0.72);
}

body.internal-body .table-wrap tbody tr:hover {
    background: rgba(223, 247, 241, 0.76);
}

body.internal-body .alert,
body.login-body .alert {
    border-radius: 16px;
    border: 1px solid transparent;
    padding: 14px 16px;
    box-shadow: var(--sigap-shadow-soft);
}

body.internal-body .alert.success,
body.login-body .alert.success {
    background: var(--sigap-success-soft);
    border-color: rgba(32, 148, 95, 0.18);
}

body.internal-body .alert.error,
body.login-body .alert.error {
    background: var(--sigap-danger-soft);
    border-color: rgba(207, 82, 67, 0.18);
}

body.internal-body .alert.info,
body.login-body .alert.info {
    background: var(--sigap-brand-soft);
    border-color: rgba(13, 143, 130, 0.18);
}

body.internal-body .status-pill,
body.internal-body .dashboard-inline-badge,
body.internal-body .dashboard-trend-source-badge,
body.internal-body .card-kicker {
    border-radius: 999px;
}

body.internal-body .input-history-name-item.is-static {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--sigap-text-strong);
    font-weight: 600;
}

body.login-body {
    min-height: 100vh;
    background:
        radial-gradient(circle at top left, rgba(210, 247, 235, 0.9), transparent 24%),
        linear-gradient(180deg, #f7fcfa 0%, #edf8f5 100%);
}

body.login-body .public-header.auth-page-header {
    position: sticky;
    top: 0;
    z-index: 10;
    backdrop-filter: blur(16px);
    background: rgba(245, 252, 249, 0.84);
}

body.login-body .login-shell {
    gap: 20px;
    align-items: stretch;
}

body.login-body .login-showcase,
body.login-body .login-card {
    border-radius: 28px;
    padding: 28px;
}

body.login-body .login-card form {
    gap: 14px;
}

@media (max-width: 1080px) {
    body.internal-body .topbar {
        grid-template-columns: 1fr;
    }

    body.internal-body .topbar-main,
    body.internal-body .topbar-actions {
        width: 100%;
    }
}

@media (max-width: 860px) {
    body.internal-body .layout-with-sidebar,
    body.login-body .login-shell {
        width: min(1380px, calc(100% - 20px));
    }

    body.internal-body .content-area {
        gap: 16px;
    }

    body.internal-body .topbar,
    body.internal-body .dashboard-summary-card,
    body.internal-body .dashboard-panel-card,
    body.internal-body .form-card,
    body.internal-body .table-card,
    body.internal-body .settings-section,
    body.internal-body .question-lane,
    body.internal-body .question-section-composer,
    body.internal-body .history-record,
    body.internal-body .measurement-record-card,
    body.internal-body .recycle-hero,
    body.login-body .login-card,
    body.login-body .login-showcase {
        border-radius: 22px;
        padding: 18px;
    }

    body.internal-body .table-wrap table {
        min-width: 680px;
    }
}

@media (max-width: 640px) {
    body.internal-body .topbar {
        padding: 14px;
    }

    body.internal-body .topbar-heading-copy p,
    body.login-body .login-showcase p {
        font-size: 0.94rem;
    }

    body.internal-body .topbar-tools > *,
    body.internal-body .topbar-profile > * {
        width: 100%;
    }

    body.internal-body .topbar-profile {
        grid-template-columns: 1fr;
    }

    body.internal-body .user-chip {
        width: 100%;
    }

    body.internal-body .table-wrap table {
        min-width: 600px;
    }

    body.internal-body .btn-primary,
    body.internal-body .btn-soft,
    body.internal-body .btn-ghost,
    body.internal-body .ghost-btn,
    body.login-body .btn-primary,
    body.login-body .btn-soft {
        width: 100%;
        justify-content: center;
    }

    body.login-body .login-showcase,
    body.login-body .login-card {
        padding: 20px;
        border-radius: 22px;
    }
}

@media (max-width: 420px) {
    body.internal-body .layout-with-sidebar,
    body.login-body .login-shell {
        width: calc(100% - 14px);
    }

    body.internal-body .content-area {
        padding-bottom: 84px;
    }

    body.internal-body .topbar,
    body.internal-body .dashboard-summary-card,
    body.internal-body .dashboard-panel-card,
    body.internal-body .form-card,
    body.internal-body .table-card,
    body.internal-body .settings-section,
    body.internal-body .question-lane,
    body.internal-body .question-section-composer,
    body.internal-body .history-record,
    body.internal-body .measurement-record-card,
    body.internal-body .recycle-hero,
    body.login-body .login-card,
    body.login-body .login-showcase {
        padding: 16px;
        border-radius: 18px;
    }

body.internal-body .table-wrap table {
        min-width: 560px;
    }
}

/* ===== FINAL MOBILE FIXES (FORCE) ===== */
@media (max-width: 640px) {
    .topbar {
        grid-template-columns: 1fr !important;
        padding: 10px 14px !important;
        gap: 10px !important;
    }
    .topbar-brand {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 6px !important;
    }
    .brand-badge {
        padding: 6px 10px !important;
    }
    .brand-logo-image {
        width: 42px !important;
        height: 42px !important;
    }
    .topbar-actions {
        width: 100% !important;
        justify-content: flex-end !important;
        gap: 10px !important;
    }
    .topbar-main {
        align-items: flex-start !important;
        gap: 10px !important;
    }
    .content-area .dashboard-grid,
    .dashboard-panels,
    .question-lane,
    .question-section-composer,
    .question-board,
    .intervention-summary-grid {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }
    .dashboard-summary-card,
    .dashboard-panel-card,
    .form-card,
    .table-card,
    .recycle-hero,
    .settings-section {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}
/* --- responsive quick fix (non-destructive) --- */
@media (max-width: 600px) {
    body.internal-body {
        padding: 12px;
    }
    .layout-with-sidebar,
    .content-area {
        padding: 0;
        max-width: none;
    }
    .topbar,
    .topbar-main {
        padding: 10px 12px;
        gap: 8px;
    }
    .topbar-brand .brand-badge-logo-only .brand-logo-image {
        max-width: 140px;
    }
    .dashboard-summary-card,
    .dashboard-panel-card,
    .form-card,
    .table-card,
    .recycle-hero,
    .settings-section {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
    .content-area .dashboard-grid,
    .dashboard-panels,
    .question-lane,
    .question-section-composer,
    .question-board,
    .intervention-summary-grid {
        grid-template-columns: 1fr !important;
        gap: 14px;
    }
    .dashboard-summary-card,
    .dashboard-panel-card,
    .form-card,
    .table-card,
    .recycle-hero,
    .settings-section {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
    .sidebar {
        width: 100%;
    }
}