/*
 * PokeTeamOn M8.2 — Mobile App UI R1
 * Mobile-only presentation. Desktop intentionally falls back to the
 * pre-M8 builder while mobile is validated against the supplied reference.
 */

:root{
    --ptm-ink:#122143;
    --ptm-muted:#66728a;
    --ptm-line:rgba(22,42,77,.12);
    --ptm-bg:#fffdf8;
    --ptm-card:#fff;
    --ptm-soft:#f7f8fc;
    --ptm-blue:#2477ff;
    --ptm-purple:#7552eb;
    --ptm-green:#36b45b;
    --ptm-orange:#e5a33e;
    --ptm-shadow:0 8px 24px rgba(24,40,72,.08);
    --ptm-radius:16px;
}

.m82-mobile-only{
    display:none;
}

/* Engine panels are only converted to bottom sheets after mobile init succeeds. */
@media(max-width:820px){
    html.m82-mobile-app-page,
    html.m82-mobile-app-page body{
        background:var(--ptm-bg);
        overflow-x:hidden;
    }

    [data-team-builder].m82-mobile-app-ready{
        position:relative;
        padding-bottom:92px !important;
        overflow:visible !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-only{
        display:block;
    }

    /* Supersede M7 page-entry/developer-tool stack on mobile only. */
    [data-team-builder].m82-mobile-app-ready .builder-intro,
    [data-team-builder].m82-mobile-app-ready .builder-toolbar,
    [data-team-builder].m82-mobile-app-ready .m75-explainer,
    [data-team-builder].m82-mobile-app-ready .m76-related-guides,
    [data-team-builder].m82-mobile-app-ready .team-progress,
    [data-team-builder].m82-mobile-app-ready .builder-context-panel:not([data-m82-mobile-active="true"]),
    [data-team-builder].m82-mobile-app-ready .showdown-io-panel:not([data-m82-mobile-active="true"]){
        display:none !important;
    }

    /*
     * Keep original slot list alive for legacy JS + local image loading,
     * but remove it from the visual layout.
     */
    [data-team-builder].m82-mobile-app-ready .builder-slot-list{
        position:absolute !important;
        left:-10000px !important;
        top:auto !important;
        width:1px !important;
        height:1px !important;
        overflow:hidden !important;
        opacity:.001 !important;
        pointer-events:none !important;
    }

    [data-team-builder].m82-mobile-app-ready .builder-layout{
        display:flex !important;
        flex-direction:column !important;
        gap:0 !important;
        margin:0 !important;
        padding:0 !important;
        max-width:none !important;
        overflow:visible !important;
    }

    /* ===== App entry ===== */
    .m82-mobile-app-head{
        display:flex !important;
        flex-direction:column;
        gap:4px;
        margin:8px 0 12px;
    }

    .m82-mobile-app-title{
        margin:0;
        color:var(--ptm-ink);
        font-size:1.42rem;
        font-weight:850;
        line-height:1.08;
        letter-spacing:-.02em;
    }

    .m82-mobile-app-steps{
        color:#56647e;
        font-size:.69rem;
        line-height:1.2;
    }

    .m82-mobile-control-row{
        display:grid !important;
        grid-template-columns:minmax(0,1fr) auto;
        gap:8px;
        margin-bottom:10px;
    }

    .m82-mobile-format{
        min-width:0;
        border:1px solid var(--ptm-line);
        border-radius:11px;
        background:#fff;
        box-shadow:0 3px 12px rgba(24,40,72,.04);
        padding:5px 9px 6px;
    }

    .m82-mobile-format label{
        display:block;
        margin:0 0 1px;
        color:#7a8498;
        font-size:.54rem;
        font-weight:700;
    }

    .m82-mobile-format select{
        width:100%;
        min-width:0;
        border:0 !important;
        outline:0;
        background:transparent;
        color:var(--ptm-ink);
        padding:0 22px 0 0 !important;
        font:inherit;
        font-size:.72rem;
        font-weight:750;
        line-height:1.4;
        box-shadow:none !important;
    }

    .m82-mobile-import{
        appearance:none;
        align-self:stretch;
        border:1px solid rgba(36,119,255,.24);
        border-radius:11px;
        background:#fff;
        color:#2468df;
        padding:0 11px;
        font:inherit;
        font-size:.67rem;
        font-weight:800;
        cursor:pointer;
    }

    /* ===== 6 Pokémon strip ===== */
    .m82-mobile-team-strip{
        display:grid !important;
        grid-template-columns:repeat(6,minmax(0,1fr));
        gap:4px;
        margin-bottom:10px;
        border:1px solid var(--ptm-line);
        border-radius:14px;
        background:#fff;
        box-shadow:var(--ptm-shadow);
        padding:6px;
        overflow:hidden;
    }

    .m82-mobile-team-slot{
        appearance:none;
        min-width:0;
        height:62px;
        position:relative;
        border:1px solid transparent;
        border-radius:10px;
        background:#fff;
        padding:3px;
        cursor:pointer;
    }

    .m82-mobile-team-slot.is-selected{
        border-color:#2f74ff;
        background:#f8faff;
        box-shadow:0 0 0 2px rgba(47,116,255,.08) inset;
    }

    .m82-mobile-slot-num{
        position:absolute;
        left:5px;
        bottom:3px;
        color:#5e6980;
        font-size:.52rem;
        font-weight:850;
    }

    .m82-mobile-team-slot img,
    .m82-mobile-team-slot .m82-mobile-cloned-visual{
        display:block;
        width:44px;
        height:44px;
        max-width:100%;
        margin:1px auto 0;
        object-fit:contain;
    }

    .m82-mobile-team-fallback{
        display:grid;
        place-items:center;
        width:38px;
        height:38px;
        margin:2px auto 0;
        border-radius:50%;
        background:linear-gradient(145deg,#f0edff,#edf4ff);
        color:#6d58df;
        font-size:.9rem;
        font-weight:900;
    }

    /* ===== selected Pokémon card ===== */
    .m82-mobile-member-card{
        display:grid !important;
        grid-template-columns:78px minmax(0,1fr) auto;
        align-items:center;
        gap:10px;
        margin-bottom:0;
        border:1px solid var(--ptm-line);
        border-radius:16px 16px 0 0;
        background:#fff;
        box-shadow:var(--ptm-shadow);
        padding:10px 11px;
    }

    .m82-mobile-member-art{
        display:grid;
        place-items:center;
        width:78px;
        height:78px;
        border-radius:14px;
        background:linear-gradient(145deg,#f6f3ff,#f0f6ff);
        overflow:hidden;
    }

    .m82-mobile-member-art img,
    .m82-mobile-member-art .m82-mobile-cloned-visual{
        width:74px;
        height:74px;
        object-fit:contain;
    }

    .m82-mobile-member-fallback{
        display:grid;
        place-items:center;
        width:58px;
        height:58px;
        border-radius:50%;
        background:linear-gradient(145deg,#e9e4ff,#e5efff);
        color:#6451d8;
        font-size:1.45rem;
        font-weight:900;
    }

    .m82-mobile-member-info{
        min-width:0;
    }

    .m82-mobile-member-name{
        margin:0 0 5px;
        color:var(--ptm-ink);
        font-size:1rem;
        font-weight:850;
        line-height:1.12;
    }

    .m82-mobile-member-chips{
        display:flex;
        flex-wrap:wrap;
        gap:5px;
        min-height:18px;
        margin-bottom:5px;
    }

    .m82-mobile-chip{
        display:inline-flex;
        align-items:center;
        min-height:19px;
        border-radius:6px;
        background:#eef0f7;
        color:#526078;
        padding:2px 7px;
        font-size:.56rem;
        font-weight:800;
    }

    .m82-mobile-chip.primary{
        background:#5a6fea;
        color:#fff;
    }

    .m82-mobile-chip.secondary{
        background:#e6a53d;
        color:#fff;
    }

    .m82-mobile-member-meta{
        color:#4f5d75;
        font-size:.64rem;
        line-height:1.35;
    }

    .m82-mobile-change{
        appearance:none;
        border:1px solid rgba(36,119,255,.22);
        border-radius:9px;
        background:#fff;
        color:#2468df;
        padding:7px 8px;
        font:inherit;
        font-size:.6rem;
        font-weight:800;
        cursor:pointer;
    }

    .m82-mobile-member-more{
        appearance:none;
        width:32px;
        height:32px;
        border:0;
        background:transparent;
        color:var(--ptm-ink);
        padding:0;
        font-size:1.1rem;
        cursor:pointer;
    }

    .m82-mobile-member-actions{
        display:flex;
        align-items:center;
        gap:4px;
    }

    /* ===== tab row ===== */
    .m82-mobile-tabs{
        display:grid !important;
        grid-template-columns:repeat(4,1fr);
        margin-bottom:10px;
        border:1px solid var(--ptm-line);
        border-top:0;
        border-radius:0 0 14px 14px;
        background:#fff;
        overflow:hidden;
        box-shadow:0 5px 16px rgba(24,40,72,.04);
    }

    .m82-mobile-tab{
        appearance:none;
        min-width:0;
        border:0;
        border-right:1px solid rgba(22,42,77,.08);
        background:#fff;
        color:#536078;
        padding:9px 2px 8px;
        font:inherit;
        font-size:.64rem;
        cursor:pointer;
    }

    .m82-mobile-tab:last-child{border-right:0;}

    .m82-mobile-tab.is-active{
        color:var(--ptm-ink);
        font-weight:850;
        box-shadow:inset 0 -2px 0 var(--ptm-blue);
    }

    .m82-mobile-tab[aria-disabled="true"]{
        opacity:.55;
    }

    /* ===== editor ===== */
    [data-team-builder].m82-mobile-app-ready .builder-editor{
        order:20 !important;
        min-width:0 !important;
        border:0 !important;
        background:transparent !important;
        box-shadow:none !important;
        padding:0 !important;
        margin:0 !important;
    }

    [data-team-builder].m82-mobile-app-ready [data-member-editor]{
        border:0 !important;
        background:transparent !important;
        box-shadow:none !important;
        padding:0 !important;
    }

    /*
     * Existing Battle Setup / Moves / EVs-IVs cards remain real controls.
     * Restyle, don't duplicate their behavior.
     */
    [data-team-builder].m82-mobile-app-ready [data-member-editor] > *{
        border-radius:12px !important;
        box-sizing:border-box !important;
    }

    [data-team-builder].m82-mobile-app-ready input,
    [data-team-builder].m82-mobile-app-ready select,
    [data-team-builder].m82-mobile-app-ready textarea{
        max-width:100%;
        box-sizing:border-box;
    }

    /* ===== tools ===== */
    .m82-mobile-tools{
        display:block !important;
        order:30 !important;
        margin-top:12px;
    }

    .m82-mobile-section-title{
        display:flex;
        align-items:center;
        justify-content:space-between;
        margin:0 0 8px;
        color:var(--ptm-ink);
        font-size:.83rem;
        font-weight:850;
    }

    .m82-mobile-tool-grid{
        display:grid;
        grid-template-columns:repeat(3,minmax(0,1fr));
        gap:7px;
    }

    .m82-mobile-tool{
        appearance:none;
        min-width:0;
        min-height:92px;
        border:1px solid var(--ptm-line);
        border-radius:13px;
        background:#fff;
        color:var(--ptm-ink);
        padding:9px 5px 8px;
        text-align:center;
        cursor:pointer;
    }

    .m82-mobile-tool.is-primary{
        border-color:#2f74ff;
        box-shadow:0 0 0 1px rgba(47,116,255,.06) inset;
    }

    .m82-mobile-tool-icon{
        display:grid;
        place-items:center;
        width:32px;
        height:32px;
        margin:0 auto 6px;
        color:#5f62ee;
    }

    .m82-mobile-tool-icon svg{
        width:27px;
        height:27px;
        fill:none;
        stroke:currentColor;
        stroke-width:1.8;
        stroke-linecap:round;
        stroke-linejoin:round;
    }

    .m82-mobile-tool strong{
        display:block;
        font-size:.62rem;
        line-height:1.14;
    }

    .m82-mobile-findings{
        display:block !important;
        margin-top:10px;
        border:1px solid var(--ptm-line);
        border-radius:13px;
        background:#fff;
        padding:11px;
    }

    .m82-mobile-findings h3{
        margin:0 0 8px;
        color:var(--ptm-ink);
        font-size:.78rem;
    }

    .m82-mobile-finding-empty,
    .m82-mobile-finding-row{
        display:flex;
        align-items:flex-start;
        gap:9px;
    }

    .m82-mobile-finding-icon{
        flex:0 0 26px;
        width:26px;
        height:26px;
        display:grid;
        place-items:center;
        border-radius:50%;
        background:#e9f8ed;
        color:#2bad53;
        font-size:.82rem;
        font-weight:900;
    }

    .m82-mobile-finding-copy strong{
        display:block;
        color:var(--ptm-ink);
        font-size:.68rem;
    }

    .m82-mobile-finding-copy span{
        display:block;
        margin-top:3px;
        color:var(--ptm-muted);
        font-size:.59rem;
        line-height:1.32;
    }

    /* ===== sticky action bar ===== */
    [data-team-builder].m82-mobile-app-ready .builder-save-row{
        position:fixed !important;
        left:max(10px,env(safe-area-inset-left));
        right:max(10px,env(safe-area-inset-right));
        bottom:max(8px,env(safe-area-inset-bottom));
        z-index:9000;
        display:grid !important;
        grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);
        gap:7px;
        margin:0 !important;
        border:1px solid var(--ptm-line);
        border-radius:14px;
        background:rgba(255,255,255,.96);
        box-shadow:0 10px 30px rgba(18,33,67,.16);
        padding:7px;
        backdrop-filter:blur(10px);
        box-sizing:border-box;
    }

    [data-team-builder].m82-mobile-app-ready .builder-save-row button,
    [data-team-builder].m82-mobile-app-ready .builder-save-row .button,
    [data-team-builder].m82-mobile-app-ready .builder-save-row [type="submit"]{
        min-width:0;
        margin:0 !important;
    }

    .m82-mobile-tools-cta{
        appearance:none;
        border:0;
        border-radius:9px;
        background:linear-gradient(135deg,var(--ptm-blue),var(--ptm-purple));
        color:#fff;
        padding:10px 8px;
        font:inherit;
        font-size:.64rem;
        font-weight:850;
        cursor:pointer;
    }

    /* ===== bottom sheets ===== */
    [data-team-builder].m82-mobile-app-ready [data-m82-mobile-engine-panel]{
        display:none !important;
    }

    [data-team-builder].m82-mobile-app-ready [data-m82-mobile-engine-panel][data-m82-mobile-active="true"]{
        display:block !important;
        position:fixed !important;
        left:0 !important;
        right:0 !important;
        bottom:0 !important;
        top:auto !important;
        width:100vw !important;
        max-width:100vw !important;
        max-height:82dvh !important;
        min-height:0 !important;
        overflow:auto !important;
        overflow-x:hidden !important;
        box-sizing:border-box !important;
        z-index:10001 !important;
        margin:0 !important;
        padding:12px 14px calc(18px + env(safe-area-inset-bottom)) !important;
        border:1px solid var(--ptm-line) !important;
        border-bottom:0 !important;
        border-radius:22px 22px 0 0 !important;
        background:var(--ptm-bg) !important;
        box-shadow:0 -18px 48px rgba(18,33,67,.22) !important;
        overscroll-behavior:contain;
    }

    [data-team-builder].m82-mobile-app-ready [data-m82-mobile-engine-panel][data-m82-mobile-active="true"]::before{
        content:"";
        display:block;
        width:38px;
        height:4px;
        margin:0 auto 7px;
        border-radius:999px;
        background:#d5d9e2;
    }

    .m82-mobile-sheet-close{
        appearance:none;
        position:sticky;
        top:0;
        z-index:6;
        float:right;
        display:grid;
        place-items:center;
        width:36px;
        height:36px;
        margin:0 0 8px 10px;
        border:0;
        border-radius:50%;
        background:#fff;
        color:var(--ptm-ink);
        box-shadow:0 5px 14px rgba(18,33,67,.09);
        font:inherit;
        font-size:1.25rem;
        cursor:pointer;
    }

    .m82-mobile-backdrop{
        display:none;
    }

    .m82-mobile-backdrop.is-visible{
        display:block;
        position:fixed;
        inset:0;
        z-index:10000;
        border:0;
        background:rgba(15,28,52,.55);
        padding:0;
    }

    /* ===== legality progress state ===== */
    .m82-mobile-progress{
        display:none;
        clear:both;
        padding:4px 0 8px;
    }

    [data-m82-mobile-engine-panel].m82-mobile-progressing > *:not(.m82-mobile-sheet-close):not(.m82-mobile-progress){
        display:none !important;
    }

    [data-m82-mobile-engine-panel].m82-mobile-progressing > .m82-mobile-progress{
        display:block !important;
    }

    .m82-mobile-progress-head{
        display:flex;
        align-items:center;
        gap:10px;
        margin:2px 0 12px;
    }

    .m82-mobile-progress-shield{
        width:30px;
        height:30px;
        color:#3079ff;
    }

    .m82-mobile-progress-shield svg{
        width:30px;
        height:30px;
        fill:none;
        stroke:currentColor;
        stroke-width:1.8;
    }

    .m82-mobile-progress-head h2{
        margin:0;
        color:var(--ptm-ink);
        font-size:1rem;
    }

    .m82-mobile-progress-copy{
        margin:0 0 10px;
        color:#3f4d68;
        font-size:.7rem;
    }

    .m82-mobile-progress-bar{
        height:5px;
        margin-bottom:14px;
        border-radius:999px;
        background:#e8eaf0;
        overflow:hidden;
    }

    .m82-mobile-progress-bar span{
        display:block;
        width:18%;
        height:100%;
        border-radius:inherit;
        background:linear-gradient(90deg,var(--ptm-blue),var(--ptm-purple));
        transition:width .25s ease;
    }

    .m82-mobile-progress-list{
        display:grid;
        gap:10px;
        margin:0 0 14px;
        padding:0;
        list-style:none;
    }

    .m82-mobile-progress-step{
        display:flex;
        align-items:center;
        gap:9px;
        color:#4b5870;
        font-size:.68rem;
    }

    .m82-mobile-progress-dot{
        flex:0 0 20px;
        width:20px;
        height:20px;
        display:grid;
        place-items:center;
        border:2px solid #c7ccd7;
        border-radius:50%;
        color:transparent;
        font-size:.63rem;
        font-weight:900;
    }

    .m82-mobile-progress-step.is-done .m82-mobile-progress-dot{
        border-color:var(--ptm-green);
        background:var(--ptm-green);
        color:#fff;
    }

    .m82-mobile-progress-step.is-current .m82-mobile-progress-dot{
        border-color:#357bff;
        background:#fff;
        color:#357bff;
    }

    .m82-mobile-progress-info{
        display:flex;
        align-items:center;
        gap:8px;
        border-radius:10px;
        background:#edf3ff;
        color:#31528e;
        padding:10px;
        font-size:.65rem;
    }

    @media(max-width:360px){
        .m82-mobile-tool strong{font-size:.58rem;}
        .m82-mobile-team-slot{height:58px;}
        .m82-mobile-team-slot img,
        .m82-mobile-team-slot .m82-mobile-cloned-visual{width:40px;height:40px;}
        .m82-mobile-member-card{grid-template-columns:68px minmax(0,1fr) auto;}
        .m82-mobile-member-art{width:68px;height:68px;}
    }
}

/* ============================================================
 * M8.2 MOBILE APP R2 — HUMAN VIDEO CORRECTION
 * ============================================================ */
@media(max-width:820px){
    /* Compact app header: closer to the supplied Android-style reference. */
    html.m82-mobile-app-page header,
    html.m82-mobile-app-page .site-header,
    html.m82-mobile-app-page .navbar{
        min-height:58px !important;
    }

    html.m82-mobile-app-page header img,
    html.m82-mobile-app-page .site-header img,
    html.m82-mobile-app-page .navbar img{
        max-height:38px !important;
        width:auto !important;
    }

    html.m82-mobile-app-page header button,
    html.m82-mobile-app-page .site-header button,
    html.m82-mobile-app-page .navbar button{
        max-width:42px;
    }

    [data-team-builder].m82-mobile-app-ready{
        padding-bottom:82px !important;
    }

    .m82-mobile-app-head{
        margin-top:4px !important;
        margin-bottom:8px !important;
    }

    .m82-mobile-app-title{
        font-size:1.26rem !important;
    }

    .m82-mobile-app-steps{
        font-size:.64rem !important;
    }

    .m82-mobile-control-row{
        margin-bottom:8px !important;
    }

    .m82-mobile-format,
    .m82-mobile-import{
        min-height:48px !important;
    }

    /* Team strip/card spacing closer to the reference. */
    .m82-mobile-team-strip{
        margin-bottom:8px !important;
        padding:5px !important;
    }

    .m82-mobile-team-slot{
        height:58px !important;
    }

    .m82-mobile-member-card{
        grid-template-columns:72px minmax(0,1fr) auto !important;
        padding:9px 10px !important;
    }

    .m82-mobile-member-art{
        width:72px !important;
        height:72px !important;
    }

    .m82-mobile-member-art img{
        width:68px !important;
        height:68px !important;
    }

    .m82-mobile-tabs{
        margin-bottom:7px !important;
    }

    /* Suppress duplicated old editor title/navigation. */
    .m82-mobile-hide-legacy-chrome{
        display:none !important;
    }

    /* Keep species/nickname/level available, but compact them into one identity card.
       This is deliberately transitional until Change Pokémon owns identity editing. */
    [data-team-builder].m82-mobile-app-ready [data-member-editor]{
        display:block !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-identity-field{
        margin-top:0 !important;
        margin-bottom:7px !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-identity-field label{
        font-size:.62rem !important;
        margin-bottom:3px !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-identity-field input,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-identity-field select{
        min-height:42px !important;
        padding:8px 10px !important;
        font-size:.78rem !important;
    }

    /* Hide the entire old save/status row. R2 owns a clean separate action bar. */
    [data-team-builder].m82-mobile-app-ready .builder-save-row{
        display:none !important;
    }

    .m82-mobile-action-bar{
        display:grid !important;
        grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);
        gap:7px;
        position:fixed;
        left:max(9px,env(safe-area-inset-left));
        right:max(9px,env(safe-area-inset-right));
        bottom:max(8px,env(safe-area-inset-bottom));
        z-index:9000;
        border:1px solid var(--ptm-line);
        border-radius:13px;
        background:rgba(255,255,255,.97);
        box-shadow:0 10px 28px rgba(18,33,67,.16);
        padding:6px;
        backdrop-filter:blur(10px);
        box-sizing:border-box;
    }

    .m82-mobile-save,
    .m82-mobile-tools-cta{
        appearance:none;
        min-width:0;
        min-height:42px;
        border-radius:9px;
        font:inherit;
        font-size:.62rem;
        font-weight:850;
        cursor:pointer;
    }

    .m82-mobile-save{
        border:1px solid #3277ef;
        background:#fff;
        color:#2468df;
    }

    .m82-mobile-tools-cta{
        border:0;
        background:linear-gradient(135deg,var(--ptm-blue),var(--ptm-purple));
        color:#fff;
    }

    /* Tool cards were oversized in R1 video. */
    .m82-mobile-tool{
        min-height:82px !important;
        padding:8px 4px 7px !important;
    }

    .m82-mobile-tool-icon{
        width:28px !important;
        height:28px !important;
        margin-bottom:4px !important;
    }

    .m82-mobile-tool-icon svg{
        width:24px !important;
        height:24px !important;
    }

    .m82-mobile-tool strong{
        font-size:.59rem !important;
    }

    /* Findings must read as concise output, not raw developer caveat dumps. */
    .m82-mobile-finding-copy span{
        max-height:2.7em;
        overflow:hidden;
        display:-webkit-box !important;
        -webkit-line-clamp:2;
        -webkit-box-orient:vertical;
    }

    /* Footer remains reachable, but sticky action no longer covers its content. */
    footer{
        padding-bottom:78px !important;
    }
}

/* ============================================================
 * M8.2 MOBILE APP R3 — REFERENCE FIDELITY CLEANUP
 * ============================================================ */
@media(max-width:820px){
    /* Mobile builder should read like an app surface, not a web page + footer. */
    html.m82-mobile-app-page footer{
        display:none !important;
    }

    [data-team-builder].m82-mobile-app-ready{
        padding-bottom:78px !important;
    }

    /* Duplicate legacy chrome must be gone regardless of original element tag. */
    [data-team-builder].m82-mobile-app-ready .m82-mobile-hide-legacy-chrome{
        display:none !important;
    }

    /* Identity fields are represented by selected-member summary.
       They appear only while Change Pokémon / Done mode is active. */
    [data-team-builder].m82-mobile-app-ready .m82-mobile-identity-field{
        display:none !important;
    }

    [data-team-builder].m82-mobile-app-ready .builder-editor.m82-mobile-identity-editing .m82-mobile-identity-field,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-identity-editing .m82-mobile-identity-field{
        display:block !important;
        margin:0 0 7px !important;
        padding:0 !important;
    }

    /* Collapse empty legacy chrome containers after their children are hidden. */
    [data-team-builder].m82-mobile-app-ready [data-member-editor] > :empty{
        display:none !important;
    }

    /* Real editor controls: tighten to the density of the supplied reference. */
    [data-team-builder].m82-mobile-app-ready [data-member-editor] label{
        font-size:.62rem !important;
        line-height:1.2 !important;
        margin-bottom:3px !important;
    }

    [data-team-builder].m82-mobile-app-ready [data-member-editor] input,
    [data-team-builder].m82-mobile-app-ready [data-member-editor] select,
    [data-team-builder].m82-mobile-app-ready [data-member-editor] textarea{
        min-height:40px !important;
        height:auto !important;
        padding:7px 9px !important;
        font-size:.76rem !important;
        line-height:1.2 !important;
        border-radius:8px !important;
        box-sizing:border-box !important;
    }

    [data-team-builder].m82-mobile-app-ready [data-member-editor] button{
        min-height:36px;
    }

    /* Reduce large spacing left by legacy editor sections. */
    [data-team-builder].m82-mobile-app-ready [data-member-editor] > *{
        margin-top:0 !important;
        margin-bottom:8px !important;
    }

    /* Pokémon artwork: object containment equivalent to the app reference. */
    .m82-mobile-team-slot img{
        width:48px !important;
        height:48px !important;
        margin:-1px auto 0 !important;
        object-fit:contain !important;
    }

    .m82-mobile-member-art img{
        width:72px !important;
        height:72px !important;
        object-fit:contain !important;
    }

    .m82-mobile-member-art{
        background:#fff !important;
    }

    /* Type/status chip row stays compact when local type data is unavailable. */
    .m82-mobile-member-chips{
        margin-bottom:3px !important;
    }

    .m82-mobile-member-meta{
        font-size:.62rem !important;
    }

    /* Findings/tools stay directly above the sticky app action bar. */
    .m82-mobile-tools{
        margin-bottom:8px !important;
    }
}

/* ============================================================
 * M8.2 MOBILE APP R4 — EDITOR CLEANUP ONLY
 * ============================================================ */
@media(max-width:820px){
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-hide{
        display:none !important;
    }

    /* Selected-member card is the default identity surface. */
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-identity{
        display:none !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-identity.m82-mobile-r4-identity-visible{
        display:block !important;
        margin:0 0 7px !important;
    }

    /* If wrapper discovery could not safely isolate a field, hide exact
       label/control pair directly until identity edit mode is active. */
    [data-team-builder].m82-mobile-app-ready:not(.m82-mobile-r4-identity-editing)
    .m82-mobile-r4-identity-label,
    [data-team-builder].m82-mobile-app-ready:not(.m82-mobile-r4-identity-editing)
    .m82-mobile-r4-identity-control{
        display:none !important;
    }

    [data-team-builder].m82-mobile-app-ready .builder-editor.m82-mobile-r4-identity-editing
    .m82-mobile-r4-identity-label{
        display:block !important;
    }

    [data-team-builder].m82-mobile-app-ready .builder-editor.m82-mobile-r4-identity-editing
    .m82-mobile-r4-identity-control{
        display:block !important;
        width:100% !important;
    }

    /* Compact 2-column Battle Setup where the legacy DOM exposes a shared parent. */
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-battle-grid{
        display:grid !important;
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:7px 8px !important;
        align-items:start !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-battle-field{
        min-width:0 !important;
        margin:0 !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-battle-field label{
        display:block !important;
        margin:0 0 3px !important;
        font-size:.58rem !important;
        font-weight:750 !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-battle-field input,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-battle-field select{
        width:100% !important;
        min-width:0 !important;
        min-height:36px !important;
        padding:6px 8px !important;
        font-size:.7rem !important;
    }

    /* Move rows match the reference: label on left, compact control on right. */
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-move-field{
        display:grid !important;
        grid-template-columns:66px minmax(0,1fr) !important;
        align-items:center !important;
        gap:7px !important;
        margin:0 0 6px !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-move-field label{
        margin:0 !important;
        font-size:.64rem !important;
        font-weight:750 !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-move-field input,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-move-field select{
        width:100% !important;
        min-width:0 !important;
        min-height:36px !important;
        padding:6px 8px !important;
        font-size:.71rem !important;
    }

    /* Primary editor sections should read as compact app cards. */
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-section-battle,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-section-moves,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-section-evs{
        border:1px solid var(--ptm-line) !important;
        border-radius:11px !important;
        background:#fff !important;
        box-shadow:none !important;
        padding:9px !important;
        margin:0 0 8px !important;
    }

    /* Remove web-form spaciousness from the editor core. */
    [data-team-builder].m82-mobile-app-ready [data-member-editor]{
        padding:0 !important;
        margin:0 !important;
    }

    [data-team-builder].m82-mobile-app-ready [data-member-editor] input,
    [data-team-builder].m82-mobile-app-ready [data-member-editor] select,
    [data-team-builder].m82-mobile-app-ready [data-member-editor] textarea{
        min-height:36px !important;
        padding-top:6px !important;
        padding-bottom:6px !important;
        font-size:.72rem !important;
    }

    [data-team-builder].m82-mobile-app-ready [data-member-editor] > *{
        margin-top:0 !important;
        margin-bottom:7px !important;
    }

    /* No explanatory/publisher paragraph should sit between editor and tools. */
    [data-team-builder].m82-mobile-app-ready .m82-mobile-tools{
        margin-top:7px !important;
    }
}

/* ============================================================
 * M8.2 MOBILE WEB APP R5 — FIDELITY / SYNC
 * ============================================================ */
@media(max-width:820px){
    /* Never flash the legacy M7 editor before mobile JS finishes. */
    html.m82-mobile-app-booting [data-team-builder] .builder-layout{
        visibility:hidden !important;
        min-height:70dvh;
    }

    /* Site header should behave like compact app chrome. */
    html.m82-mobile-app-page body > header,
    html.m82-mobile-app-page .site-header{
        height:58px !important;
        min-height:58px !important;
        max-height:58px !important;
        padding-top:0 !important;
        padding-bottom:0 !important;
        overflow:hidden !important;
    }

    html.m82-mobile-app-page body > header > *,
    html.m82-mobile-app-page .site-header > *{
        min-height:58px !important;
        height:58px !important;
        align-items:center !important;
        padding-top:3px !important;
        padding-bottom:3px !important;
        box-sizing:border-box !important;
    }

    html.m82-mobile-app-page body > header img,
    html.m82-mobile-app-page .site-header img{
        max-height:34px !important;
        width:auto !important;
    }

    html.m82-mobile-app-page body > header button,
    html.m82-mobile-app-page .site-header button{
        width:40px !important;
        height:40px !important;
        min-width:40px !important;
        min-height:40px !important;
        padding:0 !important;
    }

    /* Selection focus must not paint a second false active state. */
    .m82-mobile-team-slot:focus,
    .m82-mobile-team-slot:focus-visible{
        outline:2px solid rgba(47,116,255,.28) !important;
        outline-offset:-2px !important;
        background:#fff !important;
    }

    .m82-mobile-team-slot.is-selected,
    .m82-mobile-team-slot.is-selected:focus,
    .m82-mobile-team-slot.is-selected:focus-visible{
        border-color:#2f74ff !important;
        background:#f8faff !important;
        box-shadow:0 0 0 2px rgba(47,116,255,.08) inset !important;
    }

    /* Match the supplied reference density more closely. */
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-section-battle,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-section-moves,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-section-evs{
        padding:0 8px 8px !important;
        overflow:hidden !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r5-section-heading{
        display:flex !important;
        align-items:center !important;
        min-height:42px !important;
        margin:0 -8px 8px !important;
        padding:8px 11px !important;
        font-size:.78rem !important;
        line-height:1.15 !important;
        font-weight:850 !important;
        box-sizing:border-box !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-battle-grid{
        gap:6px 7px !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-battle-field input,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-battle-field select{
        min-height:33px !important;
        height:33px !important;
        padding:5px 7px !important;
        font-size:.66rem !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-move-field{
        grid-template-columns:56px minmax(0,1fr) !important;
        gap:6px !important;
        margin-bottom:5px !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-move-field input,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-move-field select{
        min-height:33px !important;
        height:33px !important;
        padding:5px 7px !important;
        font-size:.67rem !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-move-field label{
        font-size:.6rem !important;
    }

    /* Selected-member type chips: app-like compact pills. */
    .m82-mobile-chip{
        min-height:18px !important;
        padding:2px 6px !important;
        font-size:.53rem !important;
    }

    .m82-mobile-member-card{
        min-height:104px !important;
    }
}

/* ============================================================
 * M8.2 MOBILE WEB R7 — PREPAINT + REFERENCE POLISH
 * No engine or JS behavior changes.
 * ============================================================ */

@keyframes m82-mobile-r7-fail-open {
    0%, 99% {
        opacity:0;
        visibility:hidden;
    }
    100% {
        opacity:1;
        visibility:visible;
    }
}

@media(max-width:820px){
    /*
     * The M8 stylesheet arrives before the builder markup. Hide the legacy
     * server/M7 surface BEFORE JavaScript is ready, then cancel this gate as
     * soon as .m82-mobile-app-ready is applied.
     *
     * Fail-open safety: if M8 JavaScript completely fails, the legacy builder
     * becomes visible after 6 seconds instead of remaining inaccessible.
     */
    [data-team-builder]:not(.m82-mobile-app-ready){
        opacity:0 !important;
        visibility:hidden !important;
        animation:m82-mobile-r7-fail-open 6s steps(1,end) forwards;
        min-height:72dvh;
    }

    [data-team-builder].m82-mobile-app-ready{
        opacity:1 !important;
        visibility:visible !important;
        animation:none !important;
    }

    /* Reference: selected-member tabs span the entire content width. */
    .m82-mobile-member-card,
    .m82-mobile-tabs{
        width:100% !important;
        max-width:none !important;
        align-self:stretch !important;
        box-sizing:border-box !important;
    }

    .m82-mobile-tabs{
        grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    }

    .m82-mobile-tab{
        width:auto !important;
        min-width:0 !important;
        max-width:none !important;
    }

    /* Selected-member card: slightly denser, closer to supplied reference. */
    .m82-mobile-member-card{
        min-height:96px !important;
        grid-template-columns:68px minmax(0,1fr) auto !important;
        gap:8px !important;
        padding:8px 9px !important;
    }

    .m82-mobile-member-art{
        width:68px !important;
        height:68px !important;
    }

    .m82-mobile-member-art img{
        width:66px !important;
        height:66px !important;
    }

    .m82-mobile-member-name{
        font-size:.92rem !important;
        margin-bottom:4px !important;
    }

    .m82-mobile-change{
        padding:6px 7px !important;
        font-size:.57rem !important;
    }

    /* Reference uses restrained light-gray form borders, not heavy black. */
    [data-team-builder].m82-mobile-app-ready [data-member-editor] input,
    [data-team-builder].m82-mobile-app-ready [data-member-editor] select,
    [data-team-builder].m82-mobile-app-ready [data-member-editor] textarea{
        border:1px solid #d9dee8 !important;
        box-shadow:none !important;
        outline:none !important;
        background:#fff !important;
        color:var(--ptm-ink) !important;
    }

    [data-team-builder].m82-mobile-app-ready [data-member-editor] input:focus,
    [data-team-builder].m82-mobile-app-ready [data-member-editor] select:focus,
    [data-team-builder].m82-mobile-app-ready [data-member-editor] textarea:focus{
        border-color:#6f78e9 !important;
        box-shadow:0 0 0 2px rgba(93,101,232,.10) !important;
    }

    /* Final density pass for the three visible editor groups. */
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r5-section-heading{
        min-height:36px !important;
        margin-bottom:6px !important;
        padding:6px 9px !important;
        font-size:.72rem !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-section-battle,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-section-moves,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-section-evs{
        padding:0 7px 7px !important;
        margin-bottom:7px !important;
        border-radius:10px !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-battle-field input,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-battle-field select,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-move-field input,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-move-field select{
        min-height:31px !important;
        height:31px !important;
        padding:4px 7px !important;
        font-size:.64rem !important;
        border-radius:7px !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-battle-field label,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-move-field label{
        font-size:.57rem !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-move-field{
        grid-template-columns:52px minmax(0,1fr) !important;
        margin-bottom:4px !important;
    }

    /* Keep the native-style bottom action from visually covering card borders. */
    .m82-mobile-tools{
        padding-bottom:4px !important;
    }
}

/* ============================================================
 * M8.2 MOBILE WEB R8 — REFERENCE STRUCTURE FIDELITY
 * ============================================================ */
@media(max-width:820px){
    /*
     * Replace the tall site header with a compact mobile-web app topbar.
     * The original header remains in DOM so its menu behavior can be proxied.
     */
    html.m82-mobile-app-page body > header:not(.m82-mobile-r8-topbar),
    html.m82-mobile-app-page .site-header:not(.m82-mobile-r8-topbar){
        display:none !important;
    }

    .m82-mobile-r8-topbar{
        position:sticky;
        top:0;
        z-index:9500;
        display:flex;
        align-items:center;
        justify-content:space-between;
        width:100%;
        min-height:54px;
        height:54px;
        box-sizing:border-box;
        border-bottom:1px solid var(--ptm-line);
        background:rgba(255,253,248,.97);
        padding:6px 12px;
        backdrop-filter:blur(12px);
    }

    .m82-mobile-r8-brand{
        display:flex;
        align-items:center;
        min-width:0;
        height:40px;
        text-decoration:none;
        color:var(--ptm-ink);
    }

    .m82-mobile-r8-brand img{
        display:block;
        max-width:174px;
        max-height:36px;
        width:auto;
        height:auto;
        object-fit:contain;
    }

    .m82-mobile-r8-brand strong{
        font-size:1rem;
        font-weight:900;
    }

    .m82-mobile-r8-menu{
        appearance:none;
        display:grid;
        place-items:center;
        width:38px;
        min-width:38px;
        height:38px;
        border:0;
        border-radius:10px;
        background:transparent;
        color:var(--ptm-ink);
        padding:0;
        font:inherit;
        font-size:1.35rem;
        line-height:1;
        cursor:pointer;
    }

    /* Remove the large top gap left by website layout wrappers. */
    html.m82-mobile-app-page main,
    html.m82-mobile-app-page .site-main,
    [data-team-builder].m82-mobile-app-ready{
        margin-top:0 !important;
        padding-top:0 !important;
    }

    .m82-mobile-app-head{
        margin-top:8px !important;
    }

    /* Format + Import row closer to reference proportions. */
    .m82-mobile-control-row{
        gap:7px !important;
        margin-bottom:7px !important;
    }

    .m82-mobile-format,
    .m82-mobile-import{
        min-height:42px !important;
        height:42px !important;
    }

    .m82-mobile-import{
        padding-inline:9px !important;
        font-size:.61rem !important;
    }

    /* --------------------------------------------------------
     * PLAIN BATTLE SETUP / MOVES / EVs-IVs CARDS
     * No M7 gradient headers in primary mobile editor.
     * -------------------------------------------------------- */
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-section-battle,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-section-moves,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-section-evs{
        border:1px solid #e0e4ec !important;
        border-radius:10px !important;
        background:#fff !important;
        box-shadow:none !important;
        padding:0 8px 7px !important;
        margin:0 0 7px !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r5-section-heading{
        display:flex !important;
        align-items:center !important;
        min-height:34px !important;
        margin:0 -8px 6px !important;
        padding:6px 9px !important;
        border:0 !important;
        border-bottom:1px solid #edf0f5 !important;
        border-radius:0 !important;
        background:#fff !important;
        background-image:none !important;
        box-shadow:none !important;
        color:var(--ptm-ink) !important;
        font-size:.7rem !important;
        font-weight:850 !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r5-section-heading::before{
        content:"•";
        margin-right:6px;
        color:#266fe7;
        font-size:.78rem;
    }

    /* Battle Setup: restrained 2-column form card. */
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-battle-grid{
        display:grid !important;
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:5px 7px !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-battle-field label{
        margin-bottom:2px !important;
        font-size:.55rem !important;
        font-weight:750 !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-battle-field input,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-battle-field select{
        min-height:30px !important;
        height:30px !important;
        padding:4px 7px !important;
        border:1px solid #e0e4ec !important;
        border-radius:7px !important;
        background:#fff !important;
        font-size:.63rem !important;
    }

    /* Moves: actual controls displayed as short reference-style rows. */
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-move-field{
        position:relative !important;
        display:grid !important;
        grid-template-columns:48px minmax(0,1fr) 16px !important;
        align-items:center !important;
        min-height:30px !important;
        gap:5px !important;
        margin:0 !important;
        padding:2px 0 !important;
        border-bottom:1px solid #eef1f5 !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-move-field:last-of-type{
        border-bottom:0 !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-move-field label{
        margin:0 !important;
        color:#4f5d74 !important;
        font-size:.57rem !important;
        font-weight:800 !important;
    }

    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-move-field input,
    [data-team-builder].m82-mobile-app-ready .m82-mobile-r4-move-field select{
        width:100% !important;
        min-width:0 !important;
        min-height:28px !important;
        height:28px !important;
        border:0 !important;
        background:transparent !important;
        box-shadow:none !important;
        padding:3px 2px !important;
        color:var(--ptm-ink) !important;
        font-size:.64rem !important;
        font-weight:700 !important;
    }

    .m82-mobile-r8-row-chevron{
        display:grid;
        place-items:center;
        width:16px;
        color:#748096;
        font-size:.72rem;
        pointer-events:none;
    }

    /* EVs & IVs: compact default summary, real controls on Edit. */
    .m82-mobile-r8-ev-summary{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:10px;
        min-height:42px;
        padding:3px 0 1px;
    }

    .m82-mobile-r8-ev-summary-copy{
        min-width:0;
        display:flex;
        align-items:center;
        gap:8px;
    }

    .m82-mobile-r8-ev-summary-copy strong{
        color:#4d5b72;
        font-size:.58rem;
        font-weight:800;
        white-space:nowrap;
    }

    .m82-mobile-r8-ev-values{
        overflow:hidden;
        color:var(--ptm-ink);
        font-size:.59rem;
        font-weight:700;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    .m82-mobile-r8-ev-edit{
        appearance:none;
        flex:0 0 auto;
        min-width:44px;
        min-height:28px;
        border:1px solid #4380eb;
        border-radius:7px;
        background:#fff;
        color:#2669db;
        padding:4px 8px;
        font:inherit;
        font-size:.57rem;
        font-weight:850;
        cursor:pointer;
    }

    [data-team-builder].m82-mobile-app-ready
    .m82-mobile-r4-section-evs:not(.m82-mobile-r8-ev-expanded)
    > *:not(.m82-mobile-r5-section-heading):not(.m82-mobile-r8-ev-summary){
        display:none !important;
    }

    [data-team-builder].m82-mobile-app-ready
    .m82-mobile-r4-section-evs.m82-mobile-r8-ev-expanded
    > *{
        display:revert;
    }

    [data-team-builder].m82-mobile-app-ready
    .m82-mobile-r4-section-evs.m82-mobile-r8-ev-expanded
    > .m82-mobile-r8-ev-summary{
        display:flex !important;
    }

    /* Tool cards closer to reference height. */
    .m82-mobile-tool{
        min-height:76px !important;
        padding:7px 4px 6px !important;
    }

    .m82-mobile-tool-icon{
        width:25px !important;
        height:25px !important;
        margin-bottom:3px !important;
    }

    .m82-mobile-tool-icon svg{
        width:22px !important;
        height:22px !important;
    }

    /* Sticky action helps editing, then gets out of the way at Team Tools. */
    .m82-mobile-action-bar{
        min-height:52px !important;
        padding:5px !important;
        transition:transform .18s ease, opacity .18s ease;
    }

    .m82-mobile-save,
    .m82-mobile-tools-cta{
        min-height:38px !important;
        font-size:.59rem !important;
    }

    .m82-mobile-action-bar.m82-mobile-r8-hidden{
        opacity:0 !important;
        transform:translateY(calc(100% + 24px)) !important;
        pointer-events:none !important;
    }
}

/* ============================================================
 * M8.2 R8-v2 — BOOT FAILURE FAIL-OPEN HARDENING
 * ============================================================ */
@keyframes m82-mobile-r8v2-layout-fail-open {
    0%, 99% {
        visibility:hidden;
    }
    100% {
        visibility:visible;
    }
}

@media(max-width:820px){
    /*
     * R5 hides .builder-layout while the mobile shell boots.
     * If JS crashes before removing m82-mobile-app-booting, R7's root
     * fail-open is insufficient because this descendant remains hidden.
     * R8-v2 gives the descendant the same bounded recovery.
     */
    html.m82-mobile-app-booting [data-team-builder] .builder-layout{
        animation:m82-mobile-r8v2-layout-fail-open 6s steps(1,end) forwards !important;
    }

    html:not(.m82-mobile-app-booting) [data-team-builder] .builder-layout,
    html.m82-mobile-app-page [data-team-builder].m82-mobile-app-ready .builder-layout{
        visibility:visible !important;
        animation:none !important;
    }
}

/* ============================================================
 * M8.2 MOBILE STRUCTURAL EDITOR R9
 * ============================================================ */
@keyframes m82-r9-editor-fail-open{
    0%,99%{visibility:hidden}
    100%{visibility:visible}
}

@media(max-width:820px){
    /* Hide only the legacy editor while R9 is building; fail open safely. */
    [data-team-builder].m82-mobile-r9-booting .builder-editor{
        visibility:hidden !important;
        animation:m82-r9-editor-fail-open 5.2s steps(1,end) forwards;
    }

    [data-team-builder].m82-mobile-r9-ready .builder-editor.m82-mobile-r9-legacy-editor{
        position:absolute !important;
        left:-10000px !important;
        top:auto !important;
        width:1px !important;
        height:1px !important;
        margin:0 !important;
        padding:0 !important;
        overflow:hidden !important;
        opacity:.001 !important;
        pointer-events:none !important;
        visibility:visible !important;
        animation:none !important;
    }

    .m82-mobile-r9-editor{
        display:none;
    }

    [data-team-builder].m82-mobile-r9-ready .m82-mobile-r9-editor{
        display:grid;
        gap:7px;
        margin:0 0 7px;
    }

    .m82-mobile-r9-card{
        overflow:hidden;
        border:1px solid #e1e5ed;
        border-radius:11px;
        background:#fff;
        box-shadow:0 3px 12px rgba(22,38,68,.04);
    }

    .m82-mobile-r9-card-head{
        display:grid;
        grid-template-columns:auto 1fr auto;
        align-items:center;
        min-height:35px;
        gap:5px;
        border-bottom:1px solid #eef0f4;
        padding:5px 9px;
        color:var(--ptm-ink);
    }

    .m82-mobile-r9-card-head strong{
        font-size:.72rem;
        font-weight:850;
    }

    .m82-mobile-r9-card-dot{
        color:#2773eb;
        font-size:.8rem;
    }

    .m82-mobile-r9-card-chevron{
        color:#6f7a90;
        font-size:.68rem;
    }

    .m82-mobile-r9-battle-grid{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:6px 7px;
        padding:7px;
    }

    .m82-mobile-r9-field{
        min-width:0;
    }

    .m82-mobile-r9-field-label{
        display:block;
        margin:0 0 3px;
        color:#536078;
        font-size:.55rem;
        font-weight:800;
    }

    .m82-mobile-r9-field-button{
        appearance:none;
        display:grid;
        grid-template-columns:minmax(0,1fr) auto;
        align-items:center;
        width:100%;
        min-width:0;
        min-height:33px;
        gap:5px;
        border:1px solid #dde2eb;
        border-radius:8px;
        background:#fff;
        padding:5px 7px;
        color:var(--ptm-ink);
        text-align:left;
        font:inherit;
        cursor:pointer;
    }

    .m82-mobile-r9-field-value{
        overflow:hidden;
        font-size:.65rem;
        font-weight:700;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    .m82-mobile-r9-field-chevron{
        color:#7c879a;
        font-size:.67rem;
    }

    .m82-mobile-r9-move-list{
        padding:2px 8px 5px;
    }

    .m82-mobile-r9-move-row{
        appearance:none;
        display:grid;
        grid-template-columns:50px minmax(0,1fr) auto 14px;
        align-items:center;
        width:100%;
        min-width:0;
        min-height:31px;
        gap:5px;
        border:0;
        border-bottom:1px solid #eef1f5;
        background:#fff;
        padding:3px 0;
        color:var(--ptm-ink);
        text-align:left;
        font:inherit;
        cursor:pointer;
    }

    .m82-mobile-r9-move-row:last-child{
        border-bottom:0;
    }

    .m82-mobile-r9-move-label{
        color:#46536b;
        font-size:.58rem;
        font-weight:850;
    }

    .m82-mobile-r9-move-value{
        overflow:hidden;
        font-size:.64rem;
        font-weight:700;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    .m82-mobile-r9-move-type{
        min-width:34px;
        border-radius:5px;
        background:#eef1f7;
        padding:2px 5px;
        color:#4e5b72;
        font-size:.49rem;
        font-weight:850;
        text-align:center;
        text-transform:uppercase;
    }

    .m82-mobile-r9-move-chevron{
        color:#778398;
        font-size:.66rem;
    }

    .m82-mobile-r9-ev-summary{
        display:flex;
        align-items:center;
        justify-content:space-between;
        min-height:45px;
        gap:10px;
        padding:6px 8px;
    }

    .m82-mobile-r9-ev-copy{
        display:flex;
        min-width:0;
        align-items:center;
        gap:8px;
    }

    .m82-mobile-r9-ev-copy strong{
        flex:0 0 auto;
        color:#4b5870;
        font-size:.57rem;
    }

    .m82-mobile-r9-ev-value{
        overflow:hidden;
        color:var(--ptm-ink);
        font-size:.59rem;
        font-weight:700;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    .m82-mobile-r9-ev-edit{
        appearance:none;
        min-width:44px;
        min-height:28px;
        border:1px solid #3f7fe9;
        border-radius:7px;
        background:#fff;
        color:#2468d8;
        padding:4px 8px;
        font:inherit;
        font-size:.56rem;
        font-weight:850;
        cursor:pointer;
    }

    /* Mobile contextual editor sheet. */
    .m82-mobile-r9-sheet-backdrop{
        display:none;
    }

    .m82-mobile-r9-sheet-backdrop.is-open{
        display:block;
        position:fixed;
        inset:0;
        z-index:11000;
        border:0;
        background:rgba(15,28,52,.55);
        padding:0;
    }

    .m82-mobile-r9-sheet{
        display:none;
    }

    .m82-mobile-r9-sheet.is-open{
        display:block;
        position:fixed;
        left:0;
        right:0;
        bottom:0;
        z-index:11001;
        width:100%;
        max-height:78dvh;
        overflow:auto;
        box-sizing:border-box;
        border:1px solid #dfe3eb;
        border-bottom:0;
        border-radius:21px 21px 0 0;
        background:var(--ptm-bg);
        box-shadow:0 -18px 44px rgba(18,33,67,.22);
        padding:8px 14px calc(16px + env(safe-area-inset-bottom));
    }

    .m82-mobile-r9-sheet-handle{
        width:38px;
        height:4px;
        margin:0 auto 6px;
        border-radius:999px;
        background:#d3d8e2;
    }

    .m82-mobile-r9-sheet-head{
        display:flex;
        align-items:center;
        justify-content:space-between;
        min-height:44px;
        gap:10px;
        border-bottom:1px solid #e8ebf0;
        margin-bottom:8px;
    }

    .m82-mobile-r9-sheet-head h2{
        margin:0;
        color:var(--ptm-ink);
        font-size:.95rem;
        font-weight:850;
    }

    .m82-mobile-r9-sheet-close{
        appearance:none;
        display:grid;
        place-items:center;
        width:34px;
        height:34px;
        border:0;
        background:transparent;
        color:var(--ptm-ink);
        padding:0;
        font:inherit;
        font-size:1.2rem;
        cursor:pointer;
    }

    .m82-mobile-r9-option-list{
        display:grid;
        gap:5px;
        padding:2px 0 4px;
    }

    .m82-mobile-r9-option{
        appearance:none;
        min-height:40px;
        border:1px solid #e0e4ec;
        border-radius:9px;
        background:#fff;
        color:var(--ptm-ink);
        padding:7px 10px;
        text-align:left;
        font:inherit;
        font-size:.7rem;
        cursor:pointer;
    }

    .m82-mobile-r9-option.is-selected{
        border-color:#4b7fe8;
        background:#f3f7ff;
        font-weight:850;
    }

    .m82-mobile-r9-text-editor,
    .m82-mobile-r9-identity-form{
        display:grid;
        gap:8px;
    }

    .m82-mobile-r9-text-editor input,
    .m82-mobile-r9-identity-field input,
    .m82-mobile-r9-identity-field select,
    .m82-mobile-r9-ev-field input{
        width:100%;
        min-height:42px;
        box-sizing:border-box;
        border:1px solid #dce1ea;
        border-radius:9px;
        background:#fff;
        color:var(--ptm-ink);
        padding:8px 10px;
        font:inherit;
        font-size:.72rem;
    }

    .m82-mobile-r9-identity-field,
    .m82-mobile-r9-ev-field{
        display:grid;
        gap:4px;
        color:#536078;
        font-size:.58rem;
        font-weight:800;
    }

    .m82-mobile-r9-sheet-apply{
        appearance:none;
        width:100%;
        min-height:42px;
        margin-top:6px;
        border:0;
        border-radius:9px;
        background:linear-gradient(135deg,var(--ptm-blue),var(--ptm-purple));
        color:#fff;
        padding:8px 10px;
        font:inherit;
        font-size:.68rem;
        font-weight:850;
        cursor:pointer;
    }

    .m82-mobile-r9-ev-grid{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:7px;
    }

    .m82-mobile-r9-source-hidden{
        position:absolute !important;
        left:-10000px !important;
        width:1px !important;
        height:1px !important;
        opacity:.001 !important;
        pointer-events:none !important;
    }

    .m82-mobile-r9-format-proxy{
        appearance:none;
        display:grid;
        grid-template-columns:1fr auto;
        grid-template-rows:auto auto;
        align-items:center;
        width:100%;
        min-height:42px;
        border:0;
        background:transparent;
        padding:0;
        color:var(--ptm-ink);
        text-align:left;
        font:inherit;
        cursor:pointer;
    }

    .m82-mobile-r9-format-proxy-label{
        grid-column:1;
        grid-row:1;
        color:#7a8498;
        font-size:.53rem;
        font-weight:700;
    }

    .m82-mobile-r9-format-proxy-value{
        grid-column:1;
        grid-row:2;
        overflow:hidden;
        font-size:.67rem;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    .m82-mobile-r9-format-proxy-chevron{
        grid-column:2;
        grid-row:1/3;
        color:#748096;
        font-size:.68rem;
    }
}

/* ============================================================
 * M8.2 R9-v4 — MOBILE FULL-WIDTH FIDELITY
 * ============================================================ */
@media(max-width:820px){
    /*
     * Human R9-v3 showed the structural editor occupying only half the
     * available width while selected-card/tools were full width.
     */
    [data-team-builder].m82-mobile-r9-ready .m82-mobile-r9-editor{
        display:grid !important;
        width:100% !important;
        max-width:none !important;
        min-width:0 !important;
        grid-column:1 / -1 !important;
        justify-self:stretch !important;
        align-self:stretch !important;
        box-sizing:border-box !important;
    }

    [data-team-builder].m82-mobile-r9-ready .m82-mobile-r9-card{
        width:100% !important;
        max-width:none !important;
        min-width:0 !important;
        box-sizing:border-box !important;
    }

    [data-team-builder].m82-mobile-r9-ready .m82-mobile-r9-battle-grid{
        width:100% !important;
        box-sizing:border-box !important;
    }

    [data-team-builder].m82-mobile-r9-ready .m82-mobile-r9-move-list,
    [data-team-builder].m82-mobile-r9-ready .m82-mobile-r9-ev-summary{
        width:100% !important;
        box-sizing:border-box !important;
    }

    /* Format should appear once: compact app proxy only. */
    .m82-mobile-format .m82-mobile-r9-format-legacy{
        display:none !important;
    }

    .m82-mobile-format:has(.m82-mobile-r9-format-proxy){
        display:block !important;
        overflow:hidden !important;
        padding:0 10px !important;
    }

    .m82-mobile-r9-format-proxy{
        min-height:42px !important;
    }

    /* Reference-scale cards. */
    .m82-mobile-r9-card-head{
        min-height:34px !important;
        padding:5px 9px !important;
    }

    .m82-mobile-r9-battle-grid{
        gap:6px 8px !important;
        padding:7px 8px 8px !important;
    }

    .m82-mobile-r9-field-button{
        min-height:34px !important;
    }

    .m82-mobile-r9-move-row{
        min-height:34px !important;
        grid-template-columns:50px minmax(0,1fr) auto 16px !important;
    }

    .m82-mobile-r9-move-type{
        display:inline-flex !important;
        align-items:center;
        justify-content:center;
        min-width:38px !important;
        min-height:18px !important;
    }

    .m82-mobile-r9-move-type[hidden]{
        display:none !important;
    }

    /* Tools were still visually larger than the supplied reference. */
    .m82-mobile-tool{
        min-height:70px !important;
        padding:6px 4px !important;
    }

    .m82-mobile-tool-icon{
        width:22px !important;
        height:22px !important;
    }

    .m82-mobile-tool-icon svg{
        width:20px !important;
        height:20px !important;
    }

    .m82-mobile-tool strong{
        font-size:.56rem !important;
        line-height:1.15 !important;
    }

    /* Slightly tighter top chrome and selected member without changing IA. */
    .m82-mobile-r8-topbar{
        min-height:52px !important;
        height:52px !important;
        padding-top:5px !important;
        padding-bottom:5px !important;
    }

    .m82-mobile-r8-brand img{
        max-height:33px !important;
        max-width:164px !important;
    }
}

/* ============================================================
 * M8.2 R9-v5 — EV / PICKER INTERACTION POLISH
 * ============================================================ */
@media(max-width:820px){
    .m82-mobile-r9-ev-loading,
    .m82-mobile-r9-sheet-empty{
        margin:6px 0 8px;
        border-radius:9px;
        background:#f6f8fc;
        color:#66738a;
        padding:10px;
        font-size:.64rem;
        line-height:1.35;
    }

    .m82-mobile-r9-ev-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:7px !important;
    }

    .m82-mobile-r9-ev-field{
        min-width:0;
    }

    .m82-mobile-r9-ev-field > span{
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    .m82-mobile-r9-ev-field input{
        min-height:38px !important;
        font-size:.68rem !important;
    }

    /* Keep option-list pickers visually app-like when datalist options exist. */
    .m82-mobile-r9-option-list{
        max-height:58dvh;
        overflow:auto;
        overscroll-behavior:contain;
    }

    .m82-mobile-r9-option{
        min-height:38px !important;
        font-size:.67rem !important;
    }

    /* EV summary should have enough room for six values. */
    .m82-mobile-r9-ev-copy{
        flex:1 1 auto !important;
    }

    .m82-mobile-r9-ev-value{
        max-width:190px !important;
    }
}

/* ============================================================
 * M8.2 R9-v6 — EV ACCURACY / SHEET CLEANUP
 * ============================================================ */
@media(max-width:820px){
    .m82-mobile-r9-ev-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:7px 8px !important;
    }

    .m82-mobile-r9-ev-field{
        min-width:0;
        border:1px solid #e6e9ef;
        border-radius:9px;
        background:#fff;
        padding:6px;
    }

    .m82-mobile-r9-ev-field > span{
        display:block;
        margin-bottom:4px;
        color:#566279;
        font-size:.55rem;
        font-weight:850;
    }

    .m82-mobile-r9-ev-field input{
        min-height:34px !important;
        border:1px solid #dfe3eb !important;
        border-radius:7px !important;
        background:#fafbfe !important;
        padding:5px 7px !important;
        font-size:.67rem !important;
        font-weight:750;
    }

    .m82-mobile-r9-ev-value{
        max-width:210px !important;
        font-variant-numeric:tabular-nums;
    }
}

/* ============================================================
 * M8.2 R9-v7 — EV DISCOVERY / PICKER UX
 * ============================================================ */
@media(max-width:820px){
    .m82-mobile-r9-current-value{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:10px;
        border:1px solid #e4e8ef;
        border-radius:9px;
        background:#f7f9fc;
        padding:8px 10px;
    }

    .m82-mobile-r9-current-value span{
        color:#748096;
        font-size:.56rem;
        font-weight:700;
    }

    .m82-mobile-r9-current-value strong{
        overflow:hidden;
        color:var(--ptm-ink);
        font-size:.67rem;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    .m82-mobile-r9-ev-editor{
        display:grid;
        gap:10px;
    }

    .m82-mobile-r9-ev-group{
        display:grid;
        gap:6px;
    }

    .m82-mobile-r9-ev-group-title{
        color:#69758b;
        font-size:.57rem;
        font-weight:850;
        letter-spacing:.08em;
        text-transform:uppercase;
    }

    .m82-mobile-r9-ev-grid{
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
        gap:6px !important;
    }

    .m82-mobile-r9-ev-field{
        padding:5px !important;
    }

    .m82-mobile-r9-ev-field > span{
        margin-bottom:3px !important;
        font-size:.53rem !important;
        text-align:center;
    }

    .m82-mobile-r9-ev-field input{
        min-height:34px !important;
        padding:4px 5px !important;
        text-align:center;
    }
}

/* ============================================================
 * M8.2 R9-v8 — SIDE-BY-SIDE EV/IV + LIVE PICKER SUGGESTIONS
 * ============================================================ */
@media(max-width:820px){
    /* EV and IV groups side-by-side, as requested. */
    .m82-mobile-r9-ev-editor{
        display:grid !important;
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        align-items:start !important;
        gap:8px !important;
    }

    .m82-mobile-r9-ev-group{
        min-width:0 !important;
        align-content:start !important;
        border:1px solid #e5e8ef;
        border-radius:10px;
        background:#fff;
        padding:6px;
    }

    .m82-mobile-r9-ev-group-title{
        margin-bottom:2px;
        text-align:center;
    }

    .m82-mobile-r9-ev-group .m82-mobile-r9-ev-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:5px !important;
    }

    .m82-mobile-r9-ev-group .m82-mobile-r9-ev-field{
        padding:4px !important;
    }

    .m82-mobile-r9-ev-group .m82-mobile-r9-ev-field input{
        min-height:32px !important;
        padding:4px !important;
        font-size:.64rem !important;
    }

    /* Ability / Item / Move suggestion results. */
    .m82-mobile-r9-live-suggestions{
        display:grid;
        gap:5px;
        min-height:62px;
        border:1px solid #e4e8ef;
        border-radius:10px;
        background:#fbfcfe;
        padding:7px;
    }

    .m82-mobile-r9-suggestion-head{
        color:#6d788e;
        font-size:.55rem;
        font-weight:850;
        letter-spacing:.06em;
        text-transform:uppercase;
    }

    .m82-mobile-r9-suggestion-list{
        display:flex;
        flex-wrap:wrap;
        gap:5px;
        max-height:32dvh;
        overflow:auto;
        overscroll-behavior:contain;
    }

    .m82-mobile-r9-suggestion-option{
        appearance:none;
        max-width:100%;
        min-height:31px;
        border:1px solid #dce3ef;
        border-radius:8px;
        background:#fff;
        color:var(--ptm-ink);
        padding:5px 8px;
        font:inherit;
        font-size:.62rem;
        font-weight:700;
        text-align:left;
        cursor:pointer;
    }

    .m82-mobile-r9-suggestion-option:active{
        border-color:#4b7fe8;
        background:#f1f6ff;
    }

    .m82-mobile-r9-suggestion-state{
        color:#8791a3;
        font-size:.56rem;
        line-height:1.25;
    }
}

/* ============================================================
 * M8.2 R9-v9 — PICKER OPTION QUALITY
 * ============================================================ */
@media(max-width:820px){
    .m82-mobile-r9-suggestion-list{
        display:grid !important;
        grid-template-columns:1fr !important;
        gap:5px !important;
    }

    .m82-mobile-r9-suggestion-option{
        display:flex !important;
        width:100% !important;
        min-width:0 !important;
        min-height:40px !important;
        align-items:center !important;
        justify-content:flex-start !important;
        padding:7px 9px !important;
    }

    .m82-mobile-r9-suggestion-option.is-current{
        border-color:#5a7fea !important;
        background:#f3f6ff !important;
    }

    .m82-mobile-r9-suggestion-copy{
        display:flex;
        min-width:0;
        align-items:center;
        justify-content:space-between;
        gap:8px;
        width:100%;
    }

    .m82-mobile-r9-suggestion-name{
        overflow:hidden;
        color:var(--ptm-ink);
        font-size:.66rem;
        font-weight:800;
        text-overflow:ellipsis;
        white-space:nowrap;
    }

    .m82-mobile-r9-suggestion-meta{
        flex:0 0 auto;
        border-radius:999px;
        background:#f2ecff;
        color:#7048c8;
        padding:3px 6px;
        font-size:.49rem;
        font-weight:850;
        white-space:nowrap;
    }
}

/* ============================================================
 * M8.2 R9-v10 — INTERACTION STABILITY / CONTEXT / EV FAIL-OPEN
 * ============================================================ */
@media(max-width:820px){
    /* Keep identity CTA reachable while Android keyboard is open. */
    .m82-mobile-r9-identity-apply{
        position:sticky !important;
        bottom:max(4px,env(safe-area-inset-bottom)) !important;
        z-index:2 !important;
        box-shadow:0 -6px 16px rgba(25,39,72,.08) !important;
    }

    .m82-mobile-r9-identity-sync,
    .m82-mobile-r9-identity-error{
        display:grid;
        gap:3px;
        border:1px solid #e2e7ef;
        border-radius:10px;
        background:#f7f9fc;
        padding:10px;
        color:#66738a;
        font-size:.62rem;
        line-height:1.35;
    }

    .m82-mobile-r9-identity-error{
        border-color:#f0c8c8;
        background:#fff7f7;
        color:#8d3d3d;
    }

    .m82-mobile-r9-identity-error strong{
        color:#7a2929;
        font-size:.65rem;
    }

    .m82-mobile-r9-species-suggestions{
        display:grid;
        gap:5px;
        max-height:28dvh;
        overflow:auto;
        overscroll-behavior:contain;
        border:1px solid #e5e9f0;
        border-radius:9px;
        background:#fbfcfe;
        padding:6px;
    }

    /* EV / IV editor remains side-by-side and now has guaranteed end states. */
    .m82-mobile-r9-ev-editor{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }

    .m82-mobile-r9-sheet-empty{
        min-height:54px;
        display:flex;
        align-items:center;
    }
}

/* ============================================================
 * M8.2 R9-v11 — ATOMIC MEMBER CONTEXT + FOCUS QUARANTINE
 * ============================================================ */
@media(max-width:820px){
    .m82-mobile-v11-context-status{
        position:sticky;
        top:54px;
        z-index:9400;
        width:100%;
        box-sizing:border-box;
        border:1px solid #dfe6f2;
        border-radius:9px;
        background:#f6f9ff;
        color:#52627d;
        margin:6px 0;
        padding:7px 10px;
        font-size:.58rem;
        font-weight:750;
        line-height:1.25;
        text-align:center;
    }

    /*
     * During member synchronization the presentation remains visible, but
     * every member-scoped editor action is inert. This prevents wrong-member
     * writes during the transient selection race.
     */
    [data-team-builder].m82-mobile-v11-context-syncing
    .m82-mobile-r9-field-button,
    [data-team-builder].m82-mobile-v11-context-syncing
    .m82-mobile-r9-move-row,
    [data-team-builder].m82-mobile-v11-context-syncing
    .m82-mobile-r9-ev-edit,
    [data-team-builder].m82-mobile-v11-context-syncing
    .m82-mobile-change{
        pointer-events:none !important;
        opacity:.58 !important;
    }

    [data-team-builder].m82-mobile-v11-context-syncing
    .m82-mobile-r9-editor{
        position:relative;
    }

    [data-team-builder].m82-mobile-v11-context-syncing
    .m82-mobile-r9-editor::after{
        content:"Syncing selected Pokémon…";
        position:absolute;
        inset:0;
        z-index:3;
        display:grid;
        place-items:center;
        border-radius:10px;
        background:rgba(255,253,248,.72);
        color:#65728a;
        font-size:.6rem;
        font-weight:800;
        pointer-events:none;
        backdrop-filter:blur(1px);
    }

    /*
     * Belt-and-suspenders: the real legacy editor is never a touch target.
     * R9 presentation owns all mobile pointer interactions.
     */
    [data-team-builder].m82-mobile-r9-ready
    [data-member-editor].m82-mobile-r9-legacy-editor,
    [data-team-builder].m82-mobile-r9-ready
    .m82-mobile-r9-legacy-editor{
        pointer-events:none !important;
        user-select:none !important;
        touch-action:none !important;
    }
}

/* ============================================================
 * M8.2 R9-v12 — R9-ONLY MOBILE SLOT SELECTION
 * ============================================================ */
@media(max-width:820px){
    /*
     * No legacy transition/animation is allowed to visually walk the selected
     * state across the six mobile cards.
     */
    .m82-mobile-slot,
    .m82-mobile-slot::before,
    .m82-mobile-slot::after,
    .m82-mobile-slot *{
        transition-property:none !important;
        animation:none !important;
    }

    /*
     * Once R9 takes ownership, any legacy active/selected class on a non-target
     * slot is visually neutralized. The locked class remains in DOM for behavior.
     */
    [data-team-builder].m82-mobile-v12-selection-owned
    .m82-mobile-slot:not(.m82-mobile-v12-selected){
        border-color:#e2e6ee !important;
        box-shadow:none !important;
        outline:0 !important;
        transform:none !important;
    }

    [data-team-builder].m82-mobile-v12-selection-owned
    .m82-mobile-slot.m82-mobile-v12-selected{
        border-color:#4f79e8 !important;
        box-shadow:0 0 0 1px rgba(79,121,232,.28) !important;
        outline:0 !important;
        transform:none !important;
        background:#fbfcff !important;
    }

    [data-team-builder].m82-mobile-v12-selection-pending
    .m82-mobile-slot{
        transition:none !important;
        animation:none !important;
    }

    /*
     * Legacy M7 member editor remains a behavior/data source only.
     * It cannot become a painted or interactive mobile surface.
     */
    [data-team-builder].m82-mobile-r9-ready
    [data-member-editor].m82-mobile-r9-legacy-editor,
    [data-team-builder].m82-mobile-r9-ready
    .m82-mobile-r9-legacy-editor{
        position:fixed !important;
        left:-10000px !important;
        top:0 !important;
        width:1px !important;
        height:1px !important;
        max-width:1px !important;
        max-height:1px !important;
        overflow:hidden !important;
        opacity:0 !important;
        pointer-events:none !important;
        user-select:none !important;
        touch-action:none !important;
        caret-color:transparent !important;
    }
}


/* ============================================================
 * M8.2 R9-v13 — CONTEXT RELEASE / NO ROUTINE SYNC FLASH
 * ============================================================ */
@media(max-width:820px){
    [data-team-builder].m82-mobile-v11-context-syncing
    .m82-mobile-r9-editor::after{
        display:none !important;
        content:none !important;
    }

    [data-team-builder].m82-mobile-v11-context-syncing
    .m82-mobile-r9-field-button,
    [data-team-builder].m82-mobile-v11-context-syncing
    .m82-mobile-r9-move-row,
    [data-team-builder].m82-mobile-v11-context-syncing
    .m82-mobile-r9-ev-edit,
    [data-team-builder].m82-mobile-v11-context-syncing
    .m82-mobile-change{
        opacity:1 !important;
    }

    .m82-mobile-v11-context-status{
        margin:5px 8px !important;
        top:54px !important;
    }
}