#screen-lock {
    border-radius: var(--radius-lg);
    border: solid 1px var(--border-color);
    box-shadow: var(--shadow-lg);
    padding: 0;

    &::backdrop {
        backdrop-filter: blur(10px);
    }

    > .site-logo {
        position: fixed;
        top: calc(var(--spacing-lg));
        right: var(--spacing-lg);
    }

    > .inner {
        align-items: center;
        background: white;
        display: flex;
        flex-direction: column;
        gap: var(--spacing-md);
        justify-content: center;
        padding-block: var(--spacing-lg);

        > h2,
        button {
            margin-inline: var(--spacing-lg);
        }

        > h2 {
            align-self: flex-start;
        }

        > p {
            border-top: solid 1px var(--border-color);
            border-bottom: solid 1px var(--border-color);
            padding: var(--spacing-lg);
            opacity: 0.75;
        }

        > button {
            align-self: flex-end;
        }
    }
}