@media (max-width: 699px) {
    html,
    body {
        width: 100%;
        max-width: 100%;
        margin: 0;
        overflow-x: hidden;
        background: #fffdf9;
        scrollbar-width: none;
    }

    html::-webkit-scrollbar,
    body::-webkit-scrollbar {
        display: none;
        width: 0;
        height: 0;
    }

    main {
        width: 100%;
        max-width: 100%;
        margin: 0;
    }

    .profile-card,
    .edit-card,
    .panel {
        width: 100%;
        max-width: 100%;
        margin: 0;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .edit-card,
    .panel {
        padding: 22px 16px 30px;
    }

    .profile-card {
        overflow: visible;
    }

    .cover {
        border-radius: 0;
    }

    .details,
    .details article,
    .identity > div,
    .story-box,
    .form-section {
        min-width: 0;
        max-width: 100%;
    }

    .details b,
    .identity h1,
    .identity p,
    .story-box p {
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .form-section {
        margin-inline: 0;
        border-right: 0;
        border-left: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .report-card,
    .report-preview {
        border-radius: 0;
        box-shadow: none;
    }

    .report-card {
        margin-inline: 0;
    }

    input,
    select,
    textarea,
    button {
        max-width: 100%;
    }

    .page {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        overflow-x: clip;
    }

    nav,
    .app-nav {
        max-width: 100%;
        overflow: hidden;
    }
}