:root {
    --atelier-public-nav-height: var(--public-nav-height, 64px);
}

body.atelier-page {
    box-sizing: border-box;
    min-width: 0;
    min-height: 100vh;
    margin: 0;
    padding-top: var(--atelier-public-nav-height);
    overflow-x: hidden;
    background: #f2f0e9;
    color: #172033;
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* Radix's modal scroll lock derives padding-top from body margin-top (zero).
   Preserve the public-header offset so opening a menu/dialog cannot move it. */
body.atelier-page[data-scroll-locked] {
    padding-top: var(--atelier-public-nav-height);
}

.atelier-page .atelier-page-shell {
    display: flex;
    flex-direction: column;
    height: calc(100dvh - var(--atelier-public-nav-height));
}

.atelier-page .atelier-page-shell > :not(.atelier-root) {
    flex-shrink: 0;
}

.atelier-page .atelier-root {
    flex: 1;
    min-height: 0;
    width: 100%;
    height: auto;
}

.atelier-page .app-shell:not(.presentation-mode),
.atelier-page .project-hub-shell {
    min-height: 100%;
    padding-bottom: 24px;
}

.atelier-page #atelier-status,
.atelier-page .atelier-exit-status {
    box-sizing: border-box;
    width: min(100% - 2rem, 70rem);
    margin: 1rem auto;
    padding: 0.75rem 1rem;
    border: 1px solid #bfdbfe;
    border-radius: 0.65rem;
    background: #eff6ff;
    color: #1e3a8a;
    font-size: 0.9rem;
    font-weight: 700;
}

.atelier-page .atelier-exit-status[data-level="error"] {
    border-color: #fecaca;
    background: #fef2f2;
    color: #991b1b;
}

.atelier-page .atelier-exit-status[hidden] {
    display: none;
}

.atelier-page .atelier-root [data-slot="dialog-overlay"],
.atelier-page .atelier-root [data-slot="dialog-content"],
.atelier-page .atelier-root [data-slot="alert-dialog-overlay"],
.atelier-page .atelier-root [data-slot="alert-dialog-content"],
.atelier-page .atelier-root [data-slot="sheet-overlay"],
.atelier-page .atelier-root [data-slot="sheet-content"],
.atelier-page .atelier-root [data-slot="dropdown-menu-content"],
.atelier-page .atelier-root [data-slot="dropdown-menu-sub-content"] {
    z-index: 4100;
}

body.atelier-page:has(.atelier-root .presentation-mode),
body.atelier-page:has(.atelier-root .studio-presenter) {
    padding-top: 0;
}

body.atelier-page:has(.atelier-root .presentation-mode) .maplytics-public-nav,
body.atelier-page:has(.atelier-root .presentation-mode) .maplytics-public-nav__overlay,
body.atelier-page:has(.atelier-root .presentation-mode) .atelier-demo-banner,
body.atelier-page:has(.atelier-root .studio-presenter) .maplytics-public-nav,
body.atelier-page:has(.atelier-root .studio-presenter) .maplytics-public-nav__overlay,
body.atelier-page:has(.atelier-root .studio-presenter) .atelier-demo-banner {
    display: none;
}

body.atelier-page:has(.atelier-root .presentation-mode) .atelier-page-shell,
body.atelier-page:has(.atelier-root .studio-presenter) .atelier-page-shell {
    height: 100dvh;
}

/* A wrapped toolbar must scroll away on a short/narrow viewport. Keep one
   document scroller there, instead of trapping content below two fixed bars. */
@media (max-width: 820px), (max-height: 800px) {
    .atelier-page .atelier-page-shell {
        height: auto;
        min-height: calc(100dvh - var(--atelier-public-nav-height));
    }

    .atelier-page .atelier-root {
        flex: none;
        overflow: visible;
        scrollbar-gutter: auto;
    }

    .atelier-page .topbar,
    .atelier-page .tab-bar,
    .atelier-page .assumptions-panel,
    .atelier-page .control-card,
    .atelier-page .map-side-card,
    .atelier-page .field-visit-list,
    .atelier-page .studio-page-rail,
    .atelier-page .studio-inspector {
        position: static;
    }

    .atelier-page .assumptions-panel,
    .atelier-page .studio-inspector {
        max-height: none;
        overflow: visible;
    }

    .atelier-page .workspace-heading,
    .atelier-page .project-hub-heading {
        padding-block: 20px 16px;
    }

    .atelier-page .workspace-heading > div,
    .atelier-page .project-hub-heading > div {
        min-width: 0;
    }

    .atelier-page .file-line {
        flex-wrap: wrap;
        overflow-wrap: anywhere;
    }
}

@media (max-width: 560px) {
    .atelier-page .maplytics-public-nav .maplytics-public-nav__page-action {
        display: inline-flex;
        padding-inline: 0.65rem;
        font-size: 0.78rem;
    }

    .atelier-page .maplytics-public-nav .maplytics-public-nav__brand > span {
        display: none;
    }
}

@media print {
    body.atelier-page,
    body.atelier-page[data-scroll-locked] {
        padding-top: 0;
    }

    .atelier-page .maplytics-public-nav,
    .atelier-page .maplytics-public-nav__overlay,
    .atelier-page .atelier-demo-banner,
    .atelier-page .atelier-exit-status {
        display: none !important;
    }

    .atelier-page .atelier-page-shell,
    .atelier-page .atelier-root {
        height: auto;
        min-height: 0;
        overflow: visible;
    }
}