html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    overflow-x: hidden;
}

img,
video,
canvas {
    max-width: 100%;
}

button,
a,
input,
select,
textarea {
    touch-action: manipulation;
}

.device-mobile body {
    padding-bottom: max(16px, env(safe-area-inset-bottom));
}

.device-mobile button,
.device-mobile .btn,
.device-mobile nav a,
.device-mobile input,
.device-mobile select {
    min-height: 44px;
}

.device-mobile input,
.device-mobile select,
.device-mobile textarea {
    font-size: 16px;
}

.device-mobile .modal,
.device-mobile .modal-overlay,
.device-mobile .modal-backdrop {
    padding: 12px;
}

.device-mobile .modal-box,
.device-mobile .modal-content {
    max-width: calc(100vw - 24px);
    max-height: calc(100dvh - 24px);
    overflow-y: auto;
}

.device-mobile .modal {
    width: auto;
    max-width: none;
    max-height: none;
    overflow: visible;
}

.device-mobile .topbar,
.device-mobile .site-header,
.device-mobile .header {
    max-width: 100%;
}

.device-mobile .nav,
.device-mobile .nav-links,
.device-mobile .actions,
.device-mobile .account-actions,
.device-mobile .filters,
.device-mobile .tabs {
    row-gap: 8px;
}

.device-mobile .item-tooltip {
    width: min(260px, calc(100vw - 32px));
}

.device-mobile .market-list,
.device-mobile .chat-messages,
.device-mobile .code-list {
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

.device-mobile .panel,
.device-mobile .profile-card,
.device-mobile .edit-section,
.device-mobile .market-item,
.device-mobile .item-card {
    min-width: 0;
}

.device-desktop .topbar,
.device-desktop .site-header {
    backface-visibility: hidden;
}

@media (max-width: 420px) {
    .device-mobile .modal-actions,
    .device-mobile .actions,
    .device-mobile .account-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .device-mobile .modal-actions > *,
    .device-mobile .actions > *,
    .device-mobile .account-actions > * {
        width: 100%;
    }
}

@media (max-width: 760px) {
    .device-mobile .container,
    .device-mobile .page,
    .device-mobile .app {
        width: 100%;
        max-width: 100%;
    }

    .device-mobile h1 {
        overflow-wrap: anywhere;
    }

    .device-mobile .topbar {
        gap: 12px;
    }

    .device-mobile .panel-title {
        align-items: flex-start;
        flex-direction: column;
    }

    .device-mobile .market-tools {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .device-mobile .market-tools .btn {
        width: 100%;
    }

    .device-mobile .status {
        width: 100%;
        gap: 8px 14px;
    }
}

@media (max-width: 390px) {
    .device-mobile .catalog-grid {
        grid-template-columns: 1fr;
    }

    .device-mobile .public-bag-grid,
    .device-mobile .bag-grid {
        gap: 4px;
    }

    .device-mobile .item-tooltip {
        width: calc(100vw - 24px);
    }
}