@media screen and (max-width: 767px) {  /* @media for more specificity */
    html[lang] {
        font-size: 1.8vw;
        --borders: 2px;
        --intro-roll: 15vw;
    }

    html {
        position: fixed;
        --form-width: 100vw;
    }

    body {
        touch-action: none;
    }

    .logo > svg { width: 17vw; }

    .layout[data-layout="main"] {
        height: var(--app-height);
    }

    .feature_pane {
        line-height: 0.69;
        transform: translateY(9%) translateY(-0.9rem);
    }
    .layout.horizontal > [data-item="feature_pane"] .feature_pane {
        line-height: 0.66;
        transform: rotate(-180deg) translateX(-8.5%) translateX(0.6rem);
    }

    .gear {
        width: 100%;
    }
    .gear .icon {
        width: 8vw;
    }

    .statement > div {
        inset: 1rem;
        font-size: clamp(4.7rem, 14.4vw, 9.6rem);
        line-height: 0.86;
    }
}
