/* Mobile/responsive hardening for the public TechXiaomi shell. */
.tx-mobile-nav{display:none;position:relative;flex:0 0 auto}
.tx-mobile-nav summary{list-style:none;display:inline-flex;width:38px;height:38px;align-items:center;justify-content:center;border:1px solid #3a3a3a;border-radius:8px;background:#202020;color:#fff;cursor:pointer;font-size:0}
.tx-mobile-nav summary::-webkit-details-marker{display:none}
.tx-mobile-nav summary::before{content:'☰';font-size:20px;line-height:1}
.tx-mobile-nav[open] summary::before{content:'×';font-size:25px}
.tx-mobile-nav-menu{position:absolute;z-index:1100;top:calc(100% + 8px);right:0;width:min(320px,calc(100vw - 20px));padding:8px;background:#181818;border:1px solid #333;border-radius:10px;box-shadow:0 18px 48px rgba(0,0,0,.34)}
.tx-mobile-nav-menu a{display:flex;min-height:44px;align-items:center;padding:0 13px;border-radius:7px;color:#d5d8dc;text-decoration:none;font-size:14px;font-weight:750}
.tx-mobile-nav-menu a:hover,.tx-mobile-nav-menu a.is-active{background:#2a2a2a;color:#fff}

img,svg,video,canvas{max-width:100%}
main,section,article,aside,form,.tx-card,.tx-page-head-inner,.tx-footer-inner{min-width:0}
h1,h2,h3,p,a,strong,span{overflow-wrap:break-word}
input,select,textarea,button{max-width:100%;min-width:0}

@media(max-width:860px){
    .tx-header{height:auto;min-height:54px}
    .tx-header-inner{min-height:54px;height:auto;gap:10px;padding:7px 0;flex-wrap:wrap}
    .tx-nav{display:none}
    .tx-mobile-nav{display:block;order:3;margin-left:auto}
    .tx-logo{order:1}
    .tx-table-shell{max-width:100%;-webkit-overflow-scrolling:touch}
    .tx-table{min-width:620px}
}

@media(max-width:640px){
    .tx-container{width:calc(100% - 20px)}
    .tx-header-inner{gap:8px}
    .tx-logo img{height:30px;max-width:122px}
    .tx-mobile-nav{order:2;margin-left:auto}
    .tx-suggestions{max-height:min(60vh,360px);overflow-y:auto}

    /*
     * Device autocomplete rows must keep two bounded columns on mobile.
     * Using an auto-sized metadata column allows long metadata to consume
     * nearly the whole row, collapsing the device-name column to a few
     * pixels and wrapping names character-by-character. Fractional tracks
     * keep both columns usable regardless of result length.
     */
    .home-search-wrap .tx-suggestions .tx-suggestion,
    .fw-search-autocomplete .tx-suggestions .tx-suggestion,
    .tx-autocomplete .tx-suggestions .tx-suggestion,
    .tx-header-search .tx-suggestions .tx-suggestion{
        grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
        gap:8px;
        align-items:center;
    }
    .home-search-wrap .tx-suggestion>span,
    .fw-search-autocomplete .tx-suggestion>span,
    .tx-autocomplete .tx-suggestion>span,
    .tx-header-search .tx-suggestion>span{
        min-width:0;
        overflow-wrap:normal;
        word-break:normal;
        white-space:normal;
    }
    .home-search-wrap .tx-suggestion>span *,
    .fw-search-autocomplete .tx-suggestion>span *,
    .tx-autocomplete .tx-suggestion>span *,
    .tx-header-search .tx-suggestion>span *{
        overflow-wrap:normal;
        word-break:normal;
        white-space:normal;
    }
    .home-search-wrap .tx-suggestion small,
    .fw-search-autocomplete .tx-suggestion small,
    .tx-autocomplete .tx-suggestion small,
    .tx-header-search .tx-suggestion small{
        min-width:0;
        max-width:100%;
        text-align:right;
        line-height:1.25;
        overflow-wrap:anywhere;
        word-break:normal;
        white-space:normal;
    }

    /* Search fields may stack; suggestion rows should still use full width. */
    .tx-page-head .compare-builder{grid-template-columns:1fr}

    h1{font-size:clamp(1.72rem,8vw,2.15rem);line-height:1.12}
    h2{font-size:clamp(1.35rem,6vw,1.75rem);line-height:1.18}
    .tx-page-head-inner{padding:13px 0}
    .tx-main{padding:14px 0 34px}
    .tx-footer{margin-top:12px}
    .tx-footer-inner{font-size:11px;line-height:1.45}
    .tx-button{min-height:40px}
}

@media(max-width:380px){
    .tx-container{width:calc(100% - 16px)}
    .tx-logo img{max-width:108px;height:27px}
    .tx-mobile-nav summary{width:36px;height:36px}
    .tx-mobile-nav-menu{width:calc(100vw - 16px)}

    .home-search-wrap .tx-suggestions .tx-suggestion,
    .fw-search-autocomplete .tx-suggestions .tx-suggestion,
    .tx-autocomplete .tx-suggestions .tx-suggestion,
    .tx-header-search .tx-suggestions .tx-suggestion{
        grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
        gap:6px;
    }
}