/* Kreis-Transition Landing → Tracker (#121212 = Anmelden-Button) */

html.pt-enter-pending,
html.pt-enter-pending body,
html.pt-exit-cover,
html.pt-exit-cover body {
    background: #121212 !important;
    color-scheme: dark;
}

html.pt-enter-pending::after {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 2147483646;
    background: #121212;
    pointer-events: none;
}

html.pt-enter-pending:has(.page-transition-layer)::after {
    display: none;
}

html.pt-enter-pending body.tracker-page {
    overflow: hidden;
    background: #121212 !important;
}

html.pt-enter-pending body.tracker-page::before,
html.pt-enter-pending body.tracker-page::after {
    display: none !important;
}

html.pt-enter-pending body.tracker-page > *:not(.page-transition-layer),
html.pt-enter-pending body.auth-page > *:not(.page-transition-layer),
html.pt-enter-pending body.landing-page > *:not(.page-transition-layer) {
    visibility: hidden !important;
}

html.pt-enter-pending body.auth-page,
html.pt-enter-pending body.landing-page {
    background: #121212 !important;
}

.page-transition-layer {
    position: fixed;
    inset: 0;
    z-index: 2147483647;
    pointer-events: all;
    overflow: hidden;
}

/* Lavendel-Glow — wie .pt-screen::before in der Vorschau */
.page-transition-glow {
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background:
        radial-gradient(ellipse 70% 50% at 50% 45%, rgba(90, 77, 204, 0.14) 0%, transparent 62%),
        radial-gradient(ellipse 40% 30% at 20% 80%, rgba(155, 142, 232, 0.08) 0%, transparent 55%);
}

.page-transition-circle {
    position: absolute;
    z-index: 1;
    width: 40px;
    height: 40px;
    margin: 0;
    border-radius: 50%;
    background: #121212;
    transform-origin: center center;
    will-change: transform;
}

/* Willkommen — Variante „Minimal“ aus page-transition-welcome-preview.html */
.page-transition-welcome {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 3;
    transform: translate(-50%, -50%);
    pointer-events: none;
    text-align: center;
    max-width: 520px;
    width: max-content;
    animation: pt-welcome-in 0.55s cubic-bezier(0.33, 1, 0.38, 1) 0.12s both;
}

.page-transition-welcome__icon {
    display: block;
    width: 52px;
    height: 52px;
    margin: 0 auto 22px;
    opacity: 0.95;
}

.page-transition-welcome--minimal .page-transition-welcome__title {
    margin: 0;
    font-family: 'Inter Display', 'Inter', system-ui, sans-serif;
    font-size: clamp(2rem, 6vw, 3rem);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.03em;
    color: #fff;
}

.page-transition-welcome--minimal .page-transition-welcome__brand {
    color: #9b8ee8;
}

.page-transition-welcome--continuing {
    animation: none;
    opacity: 1;
}

@keyframes pt-welcome-in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

body.pt-transition-lock {
    overflow: hidden;
}
