/* Memo page: compact Federation layout for phones. */
@media (width <= 767px) {
    html:has(.w_memo) body.gundam-skin #ajax-content.contents {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }

    html:has(.w_memo) body.gundam-skin.gundam-skin #ajax-content.contents > .page.w_memo {
        width: 100% !important;
        max-width: none !important;
        margin: -12px 0 0 !important;
        padding: 0 0 22px !important;
        gap: 0 !important;
        background: linear-gradient(180deg, #f8fbfd 0, #edf4f8 100%) !important;
    }

    html:has(.w_memo) body.gundam-skin.gundam-skin #ajax-content.contents > .page.w_memo > .page_ttl .memo-page-subtitle {
        top: auto !important;
        bottom: 14px !important;
        display: block !important;
        font-size: 9px !important;
        letter-spacing: .18em !important;
        white-space: nowrap !important;
    }

    html:has(.w_memo) body.gundam-skin.gundam-skin #ajax-content.contents > .page.w_memo > .memo-shell {
        gap: 8px !important;
        padding: 0 !important;
        border: 0 !important;
        background: #edf4f8 !important;
        box-shadow: none !important;
    }

    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo .memo-overview {
        min-height: 316px !important;
        height: auto !important;
        margin: 0 !important;
        padding: 13px 12px !important;
        border-right: 0 !important;
        border-left: 0 !important;
        background: linear-gradient(135deg, #fff, #f7fafc) !important;
        clip-path: none !important;
    }

    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo .memo-overview__intro {
        grid-template-columns: 104px minmax(0, 1fr) !important;
        height: 112px !important;
        padding: 0 0 10px !important;
    }

    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo .memo-overview__art {
        width: 96px !important;
        height: 92px !important;
    }

    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo .memo-overview__copy { padding-left: 5px !important; }
    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo .memo-overview__title { font-size: 19px !important; }
    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo .memo-overview__description { margin-top: 6px !important; font-size: 11px !important; line-height: 1.4 !important; }
    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo .memo-overview__description-desktop { display: none !important; }
    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo .memo-overview__description-mobile { display: inline !important; }
    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo .memo-overview__total { margin-top: 5px !important; font-size: 32px !important; }
    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo .memo-overview__stats { height: 68px !important; }
    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo .memo-stat__value { margin-top: 4px !important; font-size: 27px !important; }
    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo #memo_toolbar_card { gap: 7px !important; padding-top: 5px !important; }
    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo :is(#all_read_btn, #all_memo_del_btn) { height: 40px !important; }
    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo .memo-toolbar-note { line-height: 1.35 !important; }

    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo #memo_list_card {
        min-height: 0 !important;
        padding: 12px !important;
        border-right: 0 !important;
        border-left: 0 !important;
        clip-path: none !important;
    }

    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo #memo_list_card .memo-card-title { font-size: 20px !important; }
    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo #memo_list_card .memo-card-header::after { left: 132px !important; }
    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo #memo_list_card .memo-empty-row { min-height: 286px !important; }

    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo #memo_list_card .memo-item--empty .memo-empty-state {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 206px !important;
        padding: 96px 12px 18px !important;
    }

    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo #memo_list_card .memo-item--empty .memo-empty-state::before {
        width: 94px !important;
        height: 70px !important;
        background-size: 67px 59px !important;
    }

    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo #memo_list_card .memo-empty-state__title {
        font-size: 19px !important;
        word-break: keep-all !important;
    }

    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo #memo_list_card .memo-empty-state__body {
        max-width: 280px !important;
        margin: 8px auto 0 !important;
        font-size: 12px !important;
        line-height: 1.5 !important;
        overflow-wrap: anywhere !important;
        word-break: keep-all !important;
    }

    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo #memo_list_card .memo-row {
        width: 100% !important;
        margin-bottom: 7px !important;
    }

    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo #memo_list_card .memo_content { width: 100% !important; }
}

@media (width <= 340px) {
    html:has(.w_memo) body.gundam-skin.gundam-skin #ajax-content.contents > .page.w_memo { margin-top: -10px !important; }
    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo .memo-overview__intro { grid-template-columns: 88px minmax(0, 1fr) !important; }
    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo .memo-overview__art { width: 82px !important; height: 82px !important; }
    html:has(.w_memo) body.gundam-skin.gundam-skin .page.w_memo .memo-toolbar-note { font-size: 10px !important; }
}