.user-shell {
    height: 100vh;
    height: 100svh;
    height: var(--app-vh);
    padding:
        max(14px, env(safe-area-inset-top))
        max(14px, env(safe-area-inset-right))
        max(14px, var(--safe-bottom))
        max(14px, env(safe-area-inset-left));
    display: flex;
    flex-direction: column;
    gap: 10px;
}

html[data-display-mode="standalone"] body {
    background-color: var(--zn-member-bg-app);
}

.znode-overlay-portal {
    display: contents;
}

.znode-upload-task-indicator {
    position: fixed;
    right: max(16px, env(safe-area-inset-right));
    bottom: max(88px, calc(env(safe-area-inset-bottom) + 72px));
    z-index: 1490;
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: min(360px, calc(100vw - 32px));
    padding: 10px 12px;
    border: 1px solid var(--zn-border-strong);
    border-radius: 8px;
    background: var(--zn-bg-surface-elevated);
    color: var(--zn-text-primary);
    box-shadow: var(--zn-shadow-soft);
    font-size: 14px;
}

.znode-upload-task-indicator[hidden] {
    display: none;
}

.znode-upload-task-indicator button {
    width: 30px;
    height: 30px;
    border: 0;
    background: transparent;
    color: inherit;
    font-size: 22px;
    cursor: pointer;
}

.znode-upload-task-indicator[data-status="failed"],
.znode-upload-task-indicator[data-status="interrupted"] {
    border-color: var(--zn-danger);
}

@supports (height: 100dvh) {
    body {
        min-height: 100dvh;
    }

    .user-shell {
        height: var(--app-vh);
    }

    .call-screen-shell {
        min-height: 100dvh;
    }
}