* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    min-height: 100%;
}

body {
    min-height: 100vh;
    min-height: 100dvh;

    display: grid;
    place-items: center;

    padding:
        max(24px, env(safe-area-inset-top))
        18px
        max(24px, env(safe-area-inset-bottom));

    background: #f7f7f8;
    color: #171717;

    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
}

.access-shell {
    width: min(100%, 460px);
}

.access-logo {
    margin-bottom: 22px;

    text-align: center;

    font-size: 36px;
    font-weight: 900;
}

.access-logo b {
    color: #ef233c;
}

.access-card {
    padding: 28px 22px;

    border:
        1px solid
        rgba(0,0,0,.06);

    border-radius: 22px;

    background: #ffffff;

    box-shadow:
        0 12px 34px
        rgba(0,0,0,.07);

    text-align: center;
}

.access-icon {
    margin-bottom: 13px;
    font-size: 38px;
}

.access-card h1 {
    margin: 0 0 11px;

    font-size: 22px;
    line-height: 1.2;
}

.access-card p {
    margin: 0;

    color: #666;
    line-height: 1.5;

    white-space: pre-line;
}

#access-retry {
    width: 100%;

    margin-top: 22px;
    padding: 14px 18px;

    border: 0;
    border-radius: 14px;

    background: #111111;
    color: #ffffff;

    font: inherit;
    font-weight: 750;
}