@media (max-width: 899px) {
    :root {
        --pg-visual-height: 100vh;
        --pg-cart-panel-height: calc(84vh - 61px);
        --pg-keyboard-height: 0px;
    }

    html,
    body {
        max-width: 100%;
        overflow-x: hidden;
    }

    input,
    textarea,
    select {
        font-size: 16px !important;
    }

    body.playground-home,
    body.page-template-page-list,
    body.category,
    body.search,
    body.single-post,
    body.page-template-page-game-detail {
        min-width: 0;
    }

    .pg-topbar,
    .pg-app-shell,
    body.page-template-page-list .pg-app-shell,
    body.category .pg-app-shell,
    body.search .pg-app-shell {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .pg-search-modal,
    .pg-password-modal,
    .pg-success-modal,
    .pg-cart-panel,
    .pg-list-filter-overlay,
    .pg-rating-modal,
    .pg-review-modal,
    .pg-review-success-modal,
    .pg-detail-pc-download-modal {
        width: 100%;
        max-width: 100vw;
        overflow-x: hidden;
    }

    .pg-search-modal__dialog,
    .pg-modal__dialog,
    #pg-password-modal .pg-modal__dialog,
    .pg-list-filter-sheet,
    .pg-rating-modal__dialog,
    .pg-review-modal__dialog,
    .pg-review-success-modal__dialog,
    .pg-detail-pc-download-modal__dialog {
        max-width: calc(100vw - 24px);
        box-sizing: border-box;
    }

    .pg-bottom-nav {
        right: 0;
        bottom: 0;
        left: 0;
        width: min(100%, 640px);
        height: auto;
        padding: 10px 8px calc(10px + env(safe-area-inset-bottom));
        border-radius: 0;
        box-sizing: border-box;
    }

    .pg-cart-panel__sheet {
        right: max(8px, env(safe-area-inset-right));
        left: max(8px, env(safe-area-inset-left));
        width: auto;
        max-width: none;
        margin-right: 0;
        margin-left: 0;
        box-sizing: border-box;
        bottom: calc(61px + env(safe-area-inset-bottom));
        height: min(var(--pg-cart-panel-height, calc(84vh - 61px)), 760px);
    }

    .pg-cart-panel__header,
    .pg-cart-panel__body,
    .pg-cart-panel__summary,
    .pg-cart-panel__actions {
        padding-right: 20px;
        padding-left: 20px;
    }

    .pg-keyboard-open .pg-bottom-nav {
        transform: translateY(100%);
        pointer-events: none;
    }

    .pg-keyboard-open .pg-cart-button {
        transform: translateY(calc(var(--pg-keyboard-height, 0px) * -1));
    }

    .pg-keyboard-open .pg-cart-panel__sheet {
        bottom: max(8px, env(safe-area-inset-bottom));
        height: min(calc(var(--pg-visual-height, 100vh) - 16px), 760px);
        max-height: calc(var(--pg-visual-height, 100vh) - 16px);
    }

    .pg-keyboard-open .pg-cart-panel__actions {
        padding-bottom: calc(12px + env(safe-area-inset-bottom));
    }

    .pg-keyboard-open .pg-search-modal__dialog,
    .pg-keyboard-open .pg-modal__dialog,
    .pg-keyboard-open #pg-password-modal .pg-modal__dialog,
    .pg-keyboard-open .pg-list-filter-sheet,
    .pg-keyboard-open .pg-rating-modal__dialog,
    .pg-keyboard-open .pg-review-modal__dialog,
    .pg-keyboard-open .pg-review-success-modal__dialog,
    .pg-keyboard-open .pg-detail-pc-download-modal__dialog {
        max-height: calc(var(--pg-visual-height, 100vh) - 16px);
    }

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

@media (max-width: 360px) {
    .pg-topbar {
        grid-template-columns: 44px minmax(0, 1fr) 44px;
        height: 88px;
        padding-inline: 14px;
    }

    .pg-logo {
        min-width: 0;
        overflow: hidden;
        font-size: 24px;
        text-overflow: ellipsis;
    }

    .pg-icon-button {
        width: 40px;
        height: 40px;
    }

    .pg-menu-button {
        width: 46px;
        height: 46px;
    }

    .pg-app-shell {
        min-height: calc(100vh - 88px);
        padding: 24px 14px 112px;
    }

    .pg-hero {
        height: 210px;
        border-radius: 16px;
    }

    .pg-hero__content {
        right: 14px;
        bottom: 16px;
        left: 14px;
    }

    .pg-hero h1 {
        font-size: 21px;
    }

    .pg-hero p {
        display: -webkit-box;
        overflow: hidden;
        font-size: 15px;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .pg-section {
        margin-top: 34px;
    }

    .pg-section__heading {
        gap: 10px;
        margin-bottom: 14px;
    }

    .pg-section__heading h2 {
        font-size: 23px;
    }

    .pg-section__heading a {
        font-size: 13px;
    }

    .pg-game-grid,
    .pg-list-grid {
        column-gap: 12px;
        row-gap: 24px;
    }

    .pg-game-card__cover,
    .pg-list-card__media {
        border-radius: 12px;
    }

    .pg-game-card__category,
    .pg-game-card__language,
    .pg-list-card__badge,
    .pg-list-card__language {
        height: 24px;
        min-height: 24px;
        padding: 3px 8px;
        font-size: 10px;
    }

    .pg-game-card__size,
    .pg-list-card__badge--size {
        min-height: 26px;
        padding-inline: 8px;
        font-size: 10px;
    }

    .pg-game-card h3,
    .pg-list-card__body h4 {
        margin-top: 10px;
        font-size: 15px;
    }

    .pg-views,
    .pg-list-card__foot {
        font-size: 12px;
    }

    .pg-add-button {
        width: 40px;
        height: 40px;
    }

    .pg-bottom-nav__item {
        min-width: 0;
        gap: 3px;
        font-size: 10px;
    }

    .pg-cart-button {
        right: 18px;
        bottom: calc(82px + env(safe-area-inset-bottom));
        width: 58px;
        height: 58px;
    }

    .pg-cart-list__item {
        grid-template-columns: 18px 48px minmax(0, 1fr) 64px;
        gap: 8px;
        padding: 10px;
    }

    .pg-cart-list__item img {
        width: 48px;
        height: 48px;
        border-radius: 10px;
    }

    .pg-cart-list__item strong {
        font-size: 13px;
    }

    .pg-cart-list__actions {
        width: 64px;
        gap: 4px;
    }

    .pg-cart-list__remove {
        width: 30px;
        height: 30px;
    }

    .pg-cart-panel__actions {
        gap: 8px;
        padding-right: 14px;
        padding-left: 14px;
    }

    .pg-cart-panel__field input,
    .pg-cart-panel__submit {
        height: 44px;
    }

    .pg-cart-panel__submit {
        padding: 0 18px;
    }

    #pg-password-modal .pg-modal__title {
        min-height: 58px;
        padding: 19px 56px 15px 20px;
        font-size: 18px;
    }

    #pg-password-modal .pg-modal__form {
        padding: 18px 18px 20px;
    }

    .pg-device-modal__device-grid {
        gap: 8px;
    }

    .pg-device-modal__device-card {
        min-height: 108px;
        gap: 8px;
        padding: 10px 6px 12px;
        border-radius: 14px;
        font-size: 12px;
    }

    .pg-device-modal__device-art {
        max-width: 66px;
    }

    .pg-device-modal__storage-grid {
        gap: 8px;
    }
}

@media (max-width: 320px) {
    .pg-app-shell,
    body.page-template-page-list .pg-app-shell,
    body.category .pg-app-shell,
    body.search .pg-app-shell {
        padding-right: 10px;
        padding-left: 10px;
    }

    .pg-game-grid,
    .pg-list-grid {
        column-gap: 10px;
        row-gap: 22px;
    }

    .pg-game-card h3,
    .pg-list-card__body h4 {
        font-size: 14px;
    }

    .pg-add-button {
        width: 36px;
        height: 36px;
    }

    .pg-cart-panel__actions {
        flex-direction: column;
        align-items: stretch;
    }

    .pg-cart-panel__submit {
        width: 100%;
    }

    #pg-password-modal .pg-modal__dialog {
        max-width: calc(100vw - 16px);
    }
}
