.landing-shell,
.auth-shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: var(--space-lg);
}

.landing-card,
.auth-card {
    width: min(100%, 30rem);
}

.landing-card {
    text-align: center;
    gap: var(--space-lg);
}

.landing-status {
    color: var(--color-text-soft);
    line-height: 1.6;
}

.auth-panel {
    width: min(100%, 80rem);
    display: grid;
    gap: var(--space-lg);
}

.auth-hero {
    display: none;
}

.auth-hero__inner,
.auth-card-wrapper {
    height: 100%;
}

.auth-card {
    display: grid;
    gap: var(--space-lg);
}

.auth-copy {
    color: var(--color-text-soft);
    line-height: 1.6;
}

.app-shell {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.workspace-shell {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.sidebar {
    display: none;
}

.mobile-topbar,
.topbar {
    position: sticky;
    top: 0;
    z-index: var(--z-sticky);
    backdrop-filter: blur(12px);
}

.mobile-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-sm);
    min-height: 4.75rem;
    padding: var(--space-md) var(--space-lg);
    background: rgba(245, 242, 237, 0.88);
    border-bottom: 1px solid rgba(222, 216, 207, 0.9);
}

.mobile-topbar__brand {
    font-family: var(--font-display);
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: 0.04em;
}

.mobile-topbar__meta {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
}

.topbar {
    display: none;
}

.workspace {
    flex: 1;
    width: min(100%, var(--content-max-width));
    margin: 0 auto;
    padding: var(--space-lg);
}

.page-host,
.page {
    display: grid;
    gap: var(--space-lg);
}

.page-header,
.page-toolbar,
.page-grid,
.detail-grid,
.panel-grid,
.split-grid {
    display: grid;
    gap: var(--space-lg);
}

.page-header__actions,
.inline-actions,
.toolbar-actions,
.meta-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
}

.dashboard-grid,
.dashboard-columns,
.records-grid,
.summary-grid,
.detail-grid__main,
.detail-grid__aside {
    display: grid;
    gap: var(--space-lg);
}

.list-stack,
.field-stack,
.form-stack,
.section-stack {
    display: grid;
    gap: var(--space-md);
}

.bottom-nav {
    position: sticky;
    bottom: 0;
    z-index: var(--z-sticky);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-xs);
    padding: var(--space-sm);
    background: rgba(23, 25, 29, 0.96);
}

.toast-stack {
    position: fixed;
    right: var(--space-md);
    bottom: 5.5rem;
    z-index: var(--z-toast);
    display: grid;
    gap: var(--space-sm);
    width: min(100% - 2rem, 24rem);
}