/* Installed MusicMastering PWA: true phone UI for portrait mode only. */
@media (max-width: 991.98px) and (orientation: portrait) {
    html[data-mm-display-mode="standalone"] {
        font-size: 1.25rem;

        /* Override the compact desktop design tokens used across the site. */
        --mm-font-xs: 1rem;
        --mm-font-sm: 1.08rem;
        --mm-font-md: 1.18rem;
        --mm-font-lg: 1.42rem;
        --mm-font-xl: 1.72rem;
        --mm-font-2xl: 2.05rem;
        --mm-font-3xl: 2.45rem;
        --mm-control-height: 3.4rem;
        --mm-control-height-sm: 3rem;
        --mm-icon-control: 3.4rem;
        --mm-pwa-touch-target: 3.4rem;
        --mm-pwa-page-gutter: .8rem;
    }

    html[data-mm-display-mode="standalone"] body.mm-body {
        font-size: 1.08rem;
        line-height: 1.5;
    }

    html[data-mm-display-mode="standalone"] .mm-page-host {
        padding: .8rem !important;
    }

    html[data-mm-display-mode="standalone"] .btn,
    html[data-mm-display-mode="standalone"] .form-control,
    html[data-mm-display-mode="standalone"] .form-select,
    html[data-mm-display-mode="standalone"] .dropdown-item,
    html[data-mm-display-mode="standalone"] .list-group-item,
    html[data-mm-display-mode="standalone"] .accordion-button,
    html[data-mm-display-mode="standalone"] .nav-link,
    html[data-mm-display-mode="standalone"] .form-label,
    html[data-mm-display-mode="standalone"] .table {
        font-size: var(--mm-font-sm);
    }

    html[data-mm-display-mode="standalone"] small,
    html[data-mm-display-mode="standalone"] .small,
    html[data-mm-display-mode="standalone"] .form-text,
    html[data-mm-display-mode="standalone"] .text-muted {
        font-size: var(--mm-font-xs);
    }

    html[data-mm-display-mode="standalone"] .mm-public-header {
        --mm-public-header-height: 76px;
    }

    html[data-mm-display-mode="standalone"] .mm-public-header .mm-public-header__navbar,
    html[data-mm-display-mode="standalone"] .mm-app-body.mm-app-body--header-shell {
        --mm-topbar-height: 76px;
    }

    html[data-mm-display-mode="standalone"] .mm-public-header .mm-public-header__container {
        min-height: 76px;
        padding-inline: .8rem;
    }

    html[data-mm-display-mode="standalone"] .mm-public-header .brand-logo--header {
        flex-basis: 14rem;
        width: 14rem;
        height: 4rem;
    }

    html[data-mm-display-mode="standalone"] .mm-public-header .brand-logo--header .brand-logo__image {
        width: 11.5rem;
        height: auto;
    }

    html[data-mm-display-mode="standalone"] .mm-public-header .mm-public-header__toggler {
        width: 3.4rem;
        height: 3.4rem;
        min-width: 3.4rem;
        min-height: 3.4rem;
    }

    /* Archive / Discografia: phone layout, not a desktop table squeezed into the viewport. */
    html[data-mm-display-mode="standalone"] .archive-page .mm-page-header {
        min-height: 0 !important;
        margin-bottom: .85rem;
        padding: 1rem !important;
    }

    html[data-mm-display-mode="standalone"] .archive-page .mm-page-header__row {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: .9rem;
        min-height: 0;
    }

    html[data-mm-display-mode="standalone"] .archive-page .mm-page-header__content {
        justify-content: flex-start;
        text-align: left;
    }

    html[data-mm-display-mode="standalone"] .archive-page .mm-page-header__title {
        font-size: var(--mm-font-xl);
        text-align: left;
    }

    html[data-mm-display-mode="standalone"] .archive-page .mm-page-header__actions {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        width: 100%;
        gap: .65rem;
        justify-content: stretch;
    }

    html[data-mm-display-mode="standalone"] .archive-page .mm-page-header__actions .btn,
    html[data-mm-display-mode="standalone"] .archive-page .archive-header-storage {
        width: 100%;
        min-width: 0;
        min-height: 3.6rem;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-header-storage {
        grid-column: 1 / -1;
        padding: .7rem .9rem;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-toolbar {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr);
        gap: .75rem;
        padding: 1rem !important;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-toolbar__stats {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        gap: .6rem;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-toolbar-stat {
        min-width: 0 !important;
        min-height: 4.2rem;
        padding: .65rem .7rem;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-toolbar-stat__content small {
        font-size: .88rem;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-toolbar-stat__content strong {
        font-size: 1.15rem;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-search,
    html[data-mm-display-mode="standalone"] .archive-page .archive-sort,
    html[data-mm-display-mode="standalone"] .archive-page .archive-page-size,
    html[data-mm-display-mode="standalone"] .archive-page .archive-toolbar__context,
    html[data-mm-display-mode="standalone"] .archive-page .archive-project-filter {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-toolbar__context {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: .6rem;
        margin: 0 !important;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-search-button {
        width: 3.6rem;
        min-width: 3.6rem;
        padding-inline: 0;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-table-card {
        display: none !important;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-card-view[data-archive-view="cards"] {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: .8rem;
        width: 100%;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-card {
        width: 100%;
        min-width: 0;
        padding: 1rem !important;
        border-radius: 1rem;
        font-size: var(--mm-font-sm);
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-card__header {
        display: flex;
        align-items: flex-start;
        flex-wrap: wrap;
        gap: .65rem;
        margin-bottom: .8rem;
        font-size: var(--mm-font-md);
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-card dl {
        display: grid;
        grid-template-columns: minmax(7rem, .8fr) minmax(0, 1fr);
        gap: .4rem .8rem;
        margin: 0;
        font-size: 1rem;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-card dt {
        color: var(--mm-muted);
        font-weight: 600;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-card dd {
        min-width: 0;
        margin: 0;
        overflow-wrap: anywhere;
        color: var(--mm-text);
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-card__footer {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: .7rem;
        margin-top: 1rem;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-card__footer .btn,
    html[data-mm-display-mode="standalone"] .archive-page .archive-card__footer button {
        min-height: 3.4rem;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-pagination {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr);
        gap: .75rem;
        padding: 1rem !important;
        font-size: 1rem;
        text-align: center;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-pagination__controls {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: .45rem;
    }

    html[data-mm-display-mode="standalone"] .archive-page .archive-pagination__controls .btn {
        min-width: 3rem;
        min-height: 3rem;
        padding-inline: .65rem;
    }
}
