.splash {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f4f5f8;
    transition:
        opacity 0.35s ease,
        visibility 0.35s;
}

.splash_hidden {
    opacity: 0;
    visibility: hidden;
}

.splash__logo {
    width: 76px;
    height: auto;
}

.splash__house {
    fill: #6fa52b;
}

.splash__ring {
    fill: #ffffff;
}

:root[data-theme='dark'] .splash {
    background: #202020;
}

:root[data-theme='dark'] .splash__house {
    fill: #d5ed88;
}

:root[data-theme='dark'] .splash__ring {
    fill: #303030;
}

@media (prefers-reduced-motion: reduce) {
    .splash {
        transition: none;
    }
}