:root {
    --app-shell-page-top: #d7ebfa;
    --app-shell-page-bottom: #9ec6e7;
    --app-shell-panel-bg: rgba(255, 255, 255, 0.94);
    --app-shell-panel-border: rgba(255, 255, 255, 0.5);
    --app-shell-panel-shadow: 0 28px 64px rgba(24, 60, 102, 0.2);
}

body.app-gradient-page {
    background:
        radial-gradient(circle at top right, rgba(255, 255, 255, 0.58), transparent 30%),
        linear-gradient(180deg, var(--app-shell-page-top) 0%, var(--app-shell-page-bottom) 100%);
    min-height: 100vh;
    min-height: 100dvh;
    position: relative;
    overflow-x: hidden;
}

body.app-gradient-page::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 14% 18%, rgba(255, 255, 255, 0.18), transparent 24%),
        radial-gradient(circle at 82% 78%, rgba(0, 79, 177, 0.09), transparent 28%);
}

.app-shell-layer {
    position: relative;
    z-index: 1;
}

.app-glass-panel {
    background: var(--app-shell-panel-bg);
    backdrop-filter: blur(10px);
    border: 1px solid var(--app-shell-panel-border);
    box-shadow: var(--app-shell-panel-shadow);
}