.home-weather-strip{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 10px;padding:7px 10px;border:1px solid rgba(30,82,136,.14);border-radius:16px;background:linear-gradient(135deg,#edf6ff 0%,#f8fbff 58%,#e2efff 100%);box-shadow:0 8px 20px rgba(20,58,102,.07);color:#15233d}.home-weather-head{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:190px;flex:1 1 210px}.home-weather-title{min-width:0}.home-weather-main{min-width:0}.home-weather-title h2{display:flex;align-items:center;gap:6px;margin:0;font-size:15px;font-weight:950;letter-spacing:-.02em;line-height:1.05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.home-weather-title h2 i{color:#1e5288;font-size:16px}.home-weather-temp{display:flex;align-items:center;justify-content:flex-end;flex:0 0 auto;text-align:right}.home-weather-temp b{font-size:18px;font-weight:950;letter-spacing:-.035em;color:#143a66;line-height:1}.home-weather-temp b.is-pending{max-width:135px;font-size:12px;letter-spacing:0;line-height:1.15;color:#64748b}.home-weather-grid{display:flex;align-items:center;gap:5px;flex:0 0 auto}.home-weather-stat{display:flex;align-items:center;gap:5px;min-height:26px;border:1px solid rgba(30,82,136,.11);border-radius:999px;background:rgba(255,255,255,.82);padding:3px 7px}.home-weather-stat span{display:flex;align-items:center;gap:4px;color:#64748b;font-size:10.5px;font-weight:850;line-height:1;white-space:nowrap}.home-weather-stat b{font-size:13px;font-weight:950;line-height:1;color:#0f172a}.hw-dot{width:6px;height:6px;border-radius:999px;display:inline-block;background:#94a3b8}.hw-stat-safe .hw-dot{background:#16a34a}.hw-stat-watch .hw-dot{background:#eab308}.hw-stat-warning .hw-dot{background:#f97316}.hw-stat-danger .hw-dot{background:#dc2626}.home-weather-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-left:auto;min-width:0}.home-weather-source{display:inline-flex;align-items:center;gap:4px;margin:0;color:#64748b;font-size:10.5px;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.home-weather-source i{font-size:12px}.home-weather-link{display:inline-flex;align-items:center;gap:3px;color:#1e5288;font-size:12px;font-weight:900;line-height:1;text-decoration:none;white-space:nowrap}.home-weather-link i{font-size:11px;transition:transform .12s ease}.home-weather-link:hover i{transform:translateX(2px)}@media(max-width:760px){.home-weather-strip{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;padding:8px 9px;border-radius:14px}.home-weather-head{min-width:0;grid-column:1/3}.home-weather-grid{grid-column:1/3;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;width:100%}.home-weather-stat{justify-content:space-between;padding:5px 7px}.home-weather-stat span{font-size:10px}.home-weather-actions{grid-column:1/3;width:100%;justify-content:space-between;margin-left:0}.home-weather-source{font-size:10.5px}.home-weather-link{font-size:11.5px}.home-weather-temp b{font-size:17px}}
    .home-weather-strip{position:relative;overflow:hidden}.home-weather-strip>*:not(.hw-scene){position:relative;z-index:1}.hw-scene{position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit;overflow:hidden;opacity:.5}.hw-scene::before{content:"";position:absolute;inset:0;background-repeat:no-repeat;background-image:radial-gradient(60px 22px at 22% 30%,rgba(255,255,255,.5),transparent 72%),radial-gradient(80px 26px at 70% 24%,rgba(255,255,255,.36),transparent 72%);animation:hwClouds 34s ease-in-out infinite}.hw-scene::after{content:"";position:absolute;top:-60%;left:-30%;width:45%;height:220%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);transform:rotate(12deg);animation:hwSheen 9s ease-in-out infinite}
    .hw-anim-icon{position:relative;display:inline-block;width:20px;height:18px;flex:0 0 auto;vertical-align:-3px}.hw-anim-icon .hw-sun{position:absolute;left:0;top:1px;width:11px;height:11px;border-radius:50%;background:radial-gradient(circle at 38% 34%,#fff3c8 0 40%,#ffd24d 70%,#f59e0b 100%);box-shadow:0 0 6px rgba(245,158,11,.5);animation:hwSunPulse 4s ease-in-out infinite}.hw-anim-icon .hw-sun::before{content:"";position:absolute;inset:-4px;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 18deg,rgba(245,158,11,.6) 19deg 26deg,transparent 27deg 45deg);-webkit-mask:radial-gradient(circle,transparent 0 48%,#000 50% 70%,transparent 72%);mask:radial-gradient(circle,transparent 0 48%,#000 50% 70%,transparent 72%);animation:hwSpin 14s linear infinite}.hw-anim-icon .hw-cloud{position:absolute;right:0;bottom:0;width:15px;height:9px;border-radius:999px;background:linear-gradient(180deg,#fff 0%,#cdd8e6 100%);box-shadow:0 1px 2px rgba(15,23,42,.18);animation:hwCloudDrift 5s ease-in-out infinite}
    @keyframes hwClouds{0%{transform:translateX(-4%)}50%{transform:translateX(4%)}100%{transform:translateX(-4%)}}@keyframes hwSheen{0%{left:-30%;opacity:0}20%{opacity:.85}55%{left:120%;opacity:0}100%{left:120%;opacity:0}}@keyframes hwSunPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}@keyframes hwSpin{to{transform:rotate(360deg)}}@keyframes hwCloudDrift{0%,100%{transform:translateX(0)}50%{transform:translateX(-1.5px)}}
    .hw-anim-icon .hw-moon{display:none;position:absolute;left:0;top:0;width:12px;height:12px;border-radius:50%;background:#dbeafe;box-shadow:3px -2px 0 0 #64748b,0 0 7px rgba(191,219,254,.65)}
    .hw-anim-icon.is-night .hw-sun{display:none!important}.hw-anim-icon.is-night .hw-moon{display:block}
    @media(prefers-reduced-motion:reduce){.hw-scene::before,.hw-scene::after,.hw-anim-icon .hw-sun,.hw-anim-icon .hw-sun::before,.hw-anim-icon .hw-cloud{animation:none!important}}
    .home-digital-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.home-digital-card{display:flex;min-width:0;flex-direction:column;overflow:hidden;border:1px solid rgba(30,82,136,.11);border-radius:18px;background:#f8fbff;color:#14233c;text-decoration:none;transition:transform .15s ease,box-shadow .15s ease}.home-digital-card:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(30,82,136,.12)}.home-digital-media{display:block;aspect-ratio:16/9;background:#dcecff center/cover no-repeat}.home-digital-body{display:flex;min-height:126px;flex-direction:column;padding:11px}.home-digital-topline{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}.home-digital-topic{display:inline-flex;align-items:center;gap:5px;min-width:0;color:#1e5288;font-size:11px;font-weight:900}.home-digital-time{flex:0 0 auto;color:#75859a;font-size:10.5px;font-weight:750;white-space:nowrap}.home-digital-card h3{display:-webkit-box;margin:0;overflow:hidden;color:#12213a;font-size:15px!important;font-weight:850;line-height:1.35;-webkit-box-orient:vertical;-webkit-line-clamp:3}.home-digital-guide-strip{display:flex;align-items:center;gap:9px;margin-top:12px;padding:10px 12px;border:1px solid rgba(30,82,136,.11);border-radius:14px;background:#f8fbff;color:#153b68;text-decoration:none}.home-digital-guide-strip span{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;font-size:11px;font-weight:900}.home-digital-guide-strip strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.home-digital-guide-strip>.bi{margin-left:auto;flex:0 0 auto}.home-digital-skeleton{min-height:240px;background:linear-gradient(100deg,#eef4fa 30%,#f8fbff 48%,#eef4fa 66%);background-size:240% 100%;animation:homeDigitalLoading 1.4s linear infinite}@keyframes homeDigitalLoading{to{background-position-x:-240%}}
    .home-agri-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.home-agri-card{display:grid;grid-template-columns:132px minmax(0,1fr);gap:12px;padding:10px;border:1px solid rgba(23,107,74,.12);border-radius:18px;background:#f8fcf9;color:#17372a;text-decoration:none}.home-agri-card img{width:132px;height:106px;border-radius:13px;object-fit:cover;background:#edf8f2}.home-agri-card__body{display:flex;min-width:0;flex-direction:column;padding:2px 0}.home-agri-card small{color:#5d776b;font-size:10.5px;font-weight:750}.home-agri-card h3{display:-webkit-box;margin:6px 0;overflow:hidden;color:#17372a;font-size:15px!important;font-weight:850;line-height:1.35;-webkit-box-orient:vertical;-webkit-line-clamp:2}.home-agri-card span{margin-top:auto;color:#176b4a;font-size:11.5px;font-weight:850}
    @media(max-width:900px){.home-digital-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-agri-grid{grid-template-columns:1fr}}
    @media(max-width:560px){.home-digital-grid{grid-template-columns:1fr 1fr;gap:8px}.home-digital-body{min-height:116px;padding:9px}.home-digital-card h3{font-size:13px!important;-webkit-line-clamp:3}.home-digital-topic,.home-digital-time{font-size:9px}.home-digital-guide-strip{align-items:flex-start;flex-wrap:wrap}.home-digital-guide-strip strong{width:calc(100% - 24px);white-space:normal}.home-agri-card{grid-template-columns:104px minmax(0,1fr)}.home-agri-card img{width:104px;height:94px}}

.page-ui-home .content-layout { min-width: 0; }
    @media (min-width: 1200px) {
        .page-ui-home .content-layout { grid-template-columns: minmax(0, 1fr) 320px !important; gap: 16px !important; }
    }
    @media (max-width: 1199px) {
        .page-ui-home .content-layout { grid-template-columns: minmax(0, 1fr) !important; }
    }
    .page-ui-home .main-column { min-width: 0; }
    .page-ui-home .home-showcase-icon--digital { background: linear-gradient(145deg, #1e5288, #3f7fbd); }
    .page-ui-home .home-showcase-icon--agri { background: linear-gradient(145deg, #176b4a, #1c9a67); }
    .page-ui-home .home-digital-section,
    .page-ui-home #homeDigitalGrid,
    .page-ui-home #cho-lao-cai .market-highlight,
    .page-ui-home #homeMarketGrid,
    .page-ui-home #homeMarketGrid > .market-empty { width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; }
    .page-ui-home .home-digital-section,
    .page-ui-home #cho-lao-cai { overflow: hidden; }
    .page-ui-home #homeMarketGrid > .market-empty {
        grid-column: 1 / -1 !important;
        display: flex !important;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        margin: 0;
        padding: 22px 16px;
        overflow: hidden;
        overflow-wrap: anywhere;
        text-align: center;
    }
    .page-ui-home .home-about-column { min-width: 0; }
    .page-ui-home .home-about-card { overflow: hidden; padding: 18px; border: 1px solid rgba(30,82,136,.12); background: linear-gradient(155deg,#eef6ff 0,#fff 42%); }
    .page-ui-home .home-about-badge { display: inline-flex; align-items: center; gap: 6px; min-height: 28px; padding: 0 10px; border-radius: 999px; background: #fff5df; color: #965c00; font-size: 10.5px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
    .page-ui-home .home-about-card h2 { display: flex; align-items: center; gap: 8px; margin: 13px 0 8px; color: #123a63; font-size: 21px; font-weight: 950; letter-spacing: -.03em; }
    .page-ui-home .home-about-card h2 i { color: #1e5288; font-size: 19px; }
    .page-ui-home .home-about-card p { margin: 0; color: #53657b; font-size: 13px; line-height: 1.6; }
    .page-ui-home .home-about-links { display: grid; gap: 8px; margin-top: 15px; }
    .page-ui-home .home-about-link { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 42px; padding: 0 13px; border: 1px solid rgba(30,82,136,.13); border-radius: 12px; background: #fff; color: #1e5288; font-size: 12.5px; font-weight: 850; text-decoration: none; }
    .page-ui-home .home-about-link--feedback { border-color: transparent; background: #1e5288; color: #fff; }
    @media (max-width: 1199px) {
        .page-ui-home .home-about-column { position: static; }
        .page-ui-home .home-about-card { margin-top: 0; }
    }
    @media (max-width: 760px) {
        .page-ui-home .home-digital-grid { grid-template-columns: minmax(0, 1fr) !important; }
        .page-ui-home .home-digital-card { display: grid; grid-template-columns: 124px minmax(0, 1fr); }
        .page-ui-home .home-digital-media { width: 124px; height: 100%; min-height: 132px; aspect-ratio: auto; }
        .page-ui-home .home-digital-body { min-width: 0; min-height: 132px; }
        .page-ui-home .home-showcase-heading { min-width: 0; }
        .page-ui-home .home-showcase-heading > div { min-width: 0; }
        .page-ui-home .home-showcase-heading p,
        .page-ui-home .market-home-title { overflow-wrap: anywhere; }
    }
    @media (max-width: 420px) {
        .page-ui-home .home-digital-card { grid-template-columns: 100px minmax(0, 1fr); }
        .page-ui-home .home-digital-media { width: 100px; min-height: 120px; }
        .page-ui-home .home-digital-body { min-height: 120px; }
    }
    /* Polish đợt 1: đồng bộ tiêu đề mục, mũi tên "Xem thêm", gọn cho mobile (append-only) */
    .trend-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
    .trend-head .trend-head-title { display: inline-flex; align-items: center; gap: 7px; margin: 0; font-weight: 950; font-size: 15px; letter-spacing: -.02em; color: #15233d; line-height: 1.1; }
    .trend-head .trend-head-title i { color: #ef4444; font-size: 16px; }
    .trend-head .trend-top-link { display: inline-flex; align-items: center; gap: 2px; color: #1e5288; font-weight: 800; font-size: 12.5px; text-decoration: none; white-space: nowrap; }
    .trend-head .trend-top-link i, .section-link i { font-size: 15px; transition: transform .14s ease; }
    .trend-head .trend-top-link:hover i, .section-link:hover i { transform: translateX(2px); }
    @media (max-width: 760px) {
        .trend-head .trend-head-title { font-size: 14px; }
        .trend-head .trend-top-link { font-size: 12px; }
    }
    /* Critical contrast stays inline so an old cached stylesheet cannot hide the lead headline. */
    .page-ui-home #newsHero.home-hero-contrast-v2 .hero-news-overlay {
        background: linear-gradient(90deg, rgba(2, 6, 23, .90) 0%, rgba(2, 6, 23, .68) 58%, rgba(15, 23, 42, .28) 100%) !important;
    }
    .page-ui-home #newsHero.home-hero-contrast-v2 .hero-content { z-index: 2 !important; }
    .page-ui-home #newsHero.home-hero-contrast-v2 .hero-title {
        color: #fff !important;
        font-weight: 900 !important;
        text-shadow: 0 2px 18px rgba(0, 0, 0, .58) !important;
    }
    .page-ui-home #newsHero.home-hero-contrast-v2 .hero-meta,
    .page-ui-home #newsHero.home-hero-contrast-v2 .hero-meta b,
    .page-ui-home #newsHero.home-hero-contrast-v2 .hero-meta i { color: #fff !important; }

.page-ui-home .home-digital-section,
    .page-ui-home #kham-pha-ban-dia,
    .page-ui-home #cho-lao-cai,
    .page-ui-home .home-agri-section {
        padding: 18px !important;
        border: 1px solid rgba(30, 82, 136, .08) !important;
        box-shadow: 0 4px 16px rgba(15, 23, 42, .045) !important;
    }
    .page-ui-home .home-showcase-head {
        min-height: 44px;
        margin-bottom: 12px;
    }
    .page-ui-home .home-showcase-icon {
        width: 42px;
        height: 42px;
        flex: 0 0 42px;
        border-radius: 13px;
        font-size: 19px;
    }
    .page-ui-home .home-showcase-kicker { font-size: 9px; letter-spacing: .08em; }
    .page-ui-home .home-showcase-heading .market-home-title {
        margin: 0;
        color: #10375f;
        font-size: clamp(20px, 2vw, 24px) !important;
        font-weight: 950;
        line-height: 1.08;
        letter-spacing: -.035em;
    }
    .page-ui-home .home-showcase-heading p {
        margin: 3px 0 0;
        font-size: 11.5px;
        line-height: 1.35;
    }
    .page-ui-home .home-showcase-link { min-height: 34px; padding: 0 11px; font-size: 11.5px; }

    @media (min-width: 768px) {
        .page-ui-home #homeDigitalGrid,
        .page-ui-home #kham-pha-ban-dia .home-explore-grid,
        .page-ui-home #homeMarketGrid,
        .page-ui-home .home-agri-grid {
            display: grid !important;
            grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
            gap: 10px !important;
        }
        .page-ui-home .home-digital-card,
        .page-ui-home #kham-pha-ban-dia .home-explore-card,
        .page-ui-home #cho-lao-cai .market-post-card,
        .page-ui-home .home-agri-card {
            display: grid !important;
            grid-template-columns: 132px minmax(0, 1fr) !important;
            gap: 0 !important;
            min-width: 0 !important;
            min-height: 112px !important;
            height: 112px !important;
            padding: 0 !important;
            overflow: hidden !important;
            border-radius: 16px !important;
            background: #fff !important;
            border: 1px solid #e3eaf2 !important;
            box-shadow: none !important;
            text-align: left;
        }
        .page-ui-home .home-digital-card:hover,
        .page-ui-home #kham-pha-ban-dia .home-explore-card:hover,
        .page-ui-home #cho-lao-cai .market-post-card:hover,
        .page-ui-home .home-agri-card:hover {
            transform: none !important;
            border-color: #bfd0df !important;
            box-shadow: none !important;
        }
        .page-ui-home .home-digital-media,
        .page-ui-home #kham-pha-ban-dia .home-explore-media,
        .page-ui-home #cho-lao-cai .market-post-image,
        .page-ui-home .home-agri-card > img {
            display: block !important;
            width: 132px !important;
            min-width: 132px !important;
            height: 112px !important;
            min-height: 112px !important;
            aspect-ratio: auto !important;
            border-radius: 0 !important;
            object-fit: cover !important;
        }
        .page-ui-home .home-digital-body,
        .page-ui-home #kham-pha-ban-dia .home-explore-body,
        .page-ui-home #cho-lao-cai .market-post-body,
        .page-ui-home .home-agri-card__body {
            display: flex !important;
            min-width: 0 !important;
            min-height: 0 !important;
            height: 112px !important;
            flex-direction: column !important;
            padding: 10px 11px !important;
        }
        .page-ui-home .home-digital-card h3,
        .page-ui-home #kham-pha-ban-dia .home-explore-card h3,
        .page-ui-home #cho-lao-cai .market-post-card h3,
        .page-ui-home .home-agri-card h3 {
            min-height: 0 !important;
            margin: 0 !important;
            display: -webkit-box !important;
            overflow: hidden !important;
            font-size: 13.5px !important;
            font-weight: 850 !important;
            line-height: 1.35 !important;
            -webkit-box-orient: vertical !important;
            -webkit-line-clamp: 2 !important;
        }
        .page-ui-home #kham-pha-ban-dia .home-explore-meta,
        .page-ui-home .home-digital-topic { margin-bottom: 0 !important; font-size: 9.5px !important; }
        .page-ui-home .home-digital-meta { padding-top: 6px !important; font-size: 9.5px !important; }
        .page-ui-home #kham-pha-ban-dia .home-explore-card p { display: none !important; }
        .page-ui-home .home-agri-card small { font-size: 9.5px !important; }
        .page-ui-home .home-agri-card__body > span:last-child { font-size: 10.5px !important; }
        .page-ui-home #cho-lao-cai .market-post-card .price { margin-top: 5px; font-size: 13px !important; }
        .page-ui-home #cho-lao-cai .market-post-trust { display: none !important; }
        .page-ui-home #cho-lao-cai .market-post-meta { margin-top: auto !important; font-size: 9.5px !important; }
    }

    .page-ui-home #homeMarketGrid > .market-empty {
        min-height: 96px;
        display: grid !important;
        grid-template-columns: 48px minmax(0, 1fr) auto;
        gap: 12px;
        align-items: center;
        padding: 14px 16px;
        border: 1px solid rgba(194, 65, 12, .1);
        border-radius: 16px;
        background: linear-gradient(135deg, #fffaf5, #fff);
        text-align: left;
    }
    .page-ui-home .market-empty__icon {
        display: grid;
        place-items: center;
        width: 48px;
        height: 48px;
        border-radius: 15px;
        background: #ffedd5;
        color: #c2410c;
        font-size: 22px;
    }
    .page-ui-home .market-empty__copy { min-width: 0; }
    .page-ui-home .market-empty__copy b { display: block; color: #6f2f0d; font-size: 13px; line-height: 1.3; }
    .page-ui-home .market-empty__copy small { display: block; margin-top: 4px; color: #7b6a5f; font-size: 10.5px; line-height: 1.4; }
    .page-ui-home .market-empty__cta { min-height: 38px; display: inline-flex; align-items: center; white-space: nowrap; font-size: 11.5px; }

    @media (max-width: 767px) {
        .page-ui-home .home-digital-section,
        .page-ui-home #kham-pha-ban-dia,
        .page-ui-home #cho-lao-cai,
        .page-ui-home .home-agri-section { padding: 14px 12px !important; }
        .page-ui-home .home-showcase-head { min-height: 48px; margin-bottom: 11px; }
        .page-ui-home .home-showcase-icon { width: 38px; height: 38px; flex-basis: 38px; }
        .page-ui-home .home-showcase-heading .market-home-title { font-size: 19px !important; }
        .page-ui-home .home-showcase-heading p { max-width: 245px; font-size: 10px; }
        .page-ui-home #homeDigitalGrid,
        .page-ui-home #kham-pha-ban-dia .home-explore-grid,
        .page-ui-home #homeMarketGrid,
        .page-ui-home .home-agri-grid {
            display: grid !important;
            grid-template-columns: minmax(0, 1fr) !important;
            grid-auto-flow: row !important;
            grid-auto-columns: auto !important;
            gap: 9px !important;
            width: 100% !important;
            margin: 0 !important;
            padding: 0 !important;
            overflow: visible !important;
        }
        .page-ui-home .home-digital-card,
        .page-ui-home #kham-pha-ban-dia .home-explore-card,
        .page-ui-home #cho-lao-cai .market-post-card,
        .page-ui-home .home-agri-card {
            display: grid !important;
            grid-template-columns: 112px minmax(0, 1fr) !important;
            gap: 0 !important;
            width: 100% !important;
            min-width: 0 !important;
            min-height: 108px !important;
            height: 108px !important;
            padding: 0 !important;
            overflow: hidden !important;
            border-radius: 15px !important;
            background: #fff !important;
        }
        .page-ui-home .home-digital-media,
        .page-ui-home #kham-pha-ban-dia .home-explore-media,
        .page-ui-home #cho-lao-cai .market-post-image,
        .page-ui-home .home-agri-card > img {
            width: 112px !important;
            min-width: 112px !important;
            height: 108px !important;
            min-height: 108px !important;
            aspect-ratio: auto !important;
            border-radius: 0 !important;
            object-fit: cover !important;
        }
        .page-ui-home .home-digital-body,
        .page-ui-home #kham-pha-ban-dia .home-explore-body,
        .page-ui-home #cho-lao-cai .market-post-body,
        .page-ui-home .home-agri-card__body {
            display: flex !important;
            min-width: 0 !important;
            min-height: 0 !important;
            height: 108px !important;
            flex-direction: column !important;
            padding: 9px 10px !important;
        }
        .page-ui-home .home-digital-card h3,
        .page-ui-home #kham-pha-ban-dia .home-explore-card h3,
        .page-ui-home #cho-lao-cai .market-post-card h3,
        .page-ui-home .home-agri-card h3 { min-height: 0 !important; margin: 0 !important; font-size: 13px !important; line-height: 1.32 !important; -webkit-line-clamp: 2 !important; }
        .page-ui-home #kham-pha-ban-dia .home-explore-meta,
        .page-ui-home .home-digital-topic { margin-bottom: 0 !important; font-size: 9px !important; }
        .page-ui-home #kham-pha-ban-dia .home-explore-card p { display: none !important; }
        .page-ui-home .home-digital-meta { padding-top: 5px !important; font-size: 9px !important; }
        .page-ui-home #homeMarketGrid > .market-empty { min-height: 0; grid-template-columns: 42px minmax(0, 1fr); gap: 10px; padding: 12px; }
        .page-ui-home .market-empty__icon { width: 42px; height: 42px; border-radius: 13px; font-size: 19px; }
        .page-ui-home .market-empty__cta { grid-column: 1 / -1; width: 100%; justify-content: center; }
        .page-ui-home #diem-tin,
        .page-ui-home #diem-tin .side-stack,
        .page-ui-home #diem-tin #tin {
            width: 100% !important;
            max-width: 100% !important;
            min-width: 0 !important;
            margin-right: 0 !important;
            margin-left: 0 !important;
        }
        .page-ui-home #newsList .trend-item,
        .page-ui-home #newsList .trend-primary-mobile { grid-template-columns: 72px minmax(0,1fr) !important; }
        body.page-ui-home #kham-pha-ban-dia .home-explore-grid,
        body.page-ui-home #cam-nang-nong-nghiep .home-agri-grid {
            display: flex !important;
            grid-template-columns: none !important;
            grid-auto-flow: initial !important;
            overflow-x: auto !important;
            overflow-y: hidden !important;
            overscroll-behavior-inline: contain;
            scroll-snap-type: inline mandatory;
            scrollbar-width: none;
            touch-action: pan-x pan-y;
            -webkit-overflow-scrolling: touch;
        }
        body.page-ui-home #kham-pha-ban-dia .home-explore-grid::-webkit-scrollbar,
        body.page-ui-home #cam-nang-nong-nghiep .home-agri-grid::-webkit-scrollbar { display: none; }
        body.page-ui-home #kham-pha-ban-dia .home-explore-card,
        body.page-ui-home #cam-nang-nong-nghiep .home-agri-card {
            flex: 0 0 calc(100% - 30px) !important;
            width: calc(100% - 30px) !important;
            max-width: calc(100% - 30px) !important;
            min-height: 120px !important;
            height: 120px !important;
            scroll-snap-align: start;
        }
        body.page-ui-home #kham-pha-ban-dia .home-explore-media,
        body.page-ui-home #cam-nang-nong-nghiep .home-agri-card > img,
        body.page-ui-home #kham-pha-ban-dia .home-explore-body,
        body.page-ui-home #cam-nang-nong-nghiep .home-agri-card__body { height: 120px !important; min-height: 120px !important; }
        body.page-ui-home #kham-pha-ban-dia .home-explore-meta,
        body.page-ui-home #cam-nang-nong-nghiep .home-agri-card small { font-size: 11px !important; line-height: 1.25 !important; }
        body.page-ui-home #cam-nang-nong-nghiep .home-agri-card__body > span:last-child { min-height: 32px; display: inline-flex; align-items: center; font-size: 11.5px !important; }
    }
    @media (max-width: 575px) {
        .page-ui-home .home-showcase-link {
            width: 44px;
            min-width: 44px !important;
            height: 44px !important;
            min-height: 44px !important;
            padding: 0 !important;
            font-size: 0 !important;
        }
        .page-ui-home .home-showcase-link i { margin: 0; font-size: 14px; }
    }
    .page-ui-home #kham-pha-ban-dia,
    .page-ui-home #cho-lao-cai,
    .page-ui-home #cam-nang-nong-nghiep,
    .page-ui-home #laocaiso-beta {
        content-visibility: auto;
        contain-intrinsic-size: auto 360px;
    }

.home-mobile-priority-nav { display: none; }
    .home-weather-overview { display: inline-flex; align-items: center; gap: 4px; margin-top: 4px; color: #52657c; font-size: 10px; font-weight: 850; line-height: 1.15; }
    .home-weather-overview::before { width: 7px; height: 7px; border-radius: 999px; background: #94a3b8; content: ""; }
    .hw-risk-normal .home-weather-overview::before { background: #16a34a; }
    .hw-risk-notice .home-weather-overview::before { background: #eab308; }
    .hw-risk-warning .home-weather-overview::before { background: #f97316; }
    .hw-risk-emergency .home-weather-overview::before { background: #dc2626; }
    .home-util-copy { display: inline-flex; min-width: 0; align-items: baseline; gap: 3px; }
    .home-util-label { display: none; }
    .home-util-value { color: inherit; font: inherit; }
    .page-ui-home .home-weather-stat { color: inherit; text-decoration: none; cursor: pointer; transition: border-color .14s ease, box-shadow .14s ease, transform .14s ease; }
    .page-ui-home .home-weather-stat:hover { border-color: rgba(30,82,136,.28) !important; box-shadow: 0 5px 12px rgba(30,82,136,.08); transform: translateY(-1px); }
    .page-ui-home .home-weather-stat:focus-visible { outline: 3px solid rgba(37,99,235,.35); outline-offset: 2px; }
    .page-ui-home .home-weather-stat .hw-stat-unit { display: none; font-size: .78em; font-weight: 850; line-height: 1; }
    .page-ui-home .hw-stat-safe .hw-stat-icon { color: #16a34a; }
    .page-ui-home .hw-stat-watch .hw-stat-icon { color: #ca8a04; }
    .page-ui-home .hw-stat-warning .hw-stat-icon { color: #ea580c; }
    .page-ui-home .hw-stat-danger .hw-stat-icon { color: #dc2626; }
    .home-weather-cta { display: inline-flex; min-width: 0; align-items: center; gap: 6px; }
    .home-weather-locate { display: inline-flex; min-height: 32px; align-items: center; justify-content: center; gap: 5px; padding: 0 9px; border: 1px solid rgba(30,82,136,.18); border-radius: 10px; background: rgba(255,255,255,.88); color: #1e5288; font: inherit; font-size: 11px; font-weight: 900; line-height: 1; cursor: pointer; white-space: nowrap; }
    .home-weather-locate:hover { border-color: rgba(30,82,136,.35); background: #fff; }
    .home-weather-locate:focus-visible { outline: 3px solid rgba(37,99,235,.35); outline-offset: 2px; }
    .home-weather-locate[disabled] { cursor: wait; opacity: .68; }
    .home-weather-location-status { width: 100%; margin: -2px 0 0; color: #52657c; font-size: 10px; font-weight: 750; line-height: 1.35; }
    .home-weather-location-status.is-error { color: #8a4b16; }
    .home-weather-location-note { width: 100%; margin: -3px 0 0; color: #64748b; font-size: 9.5px; font-weight: 700; line-height: 1.25; }
    .home-weather-location-note__mobile { display: none; }
    .home-weather-saved { display: grid; width: 100%; min-width: 0; grid-template-columns: 36px minmax(0,1fr) auto auto; align-items: center; gap: 9px; padding: 9px 10px; border: 1px solid rgba(22,101,52,.14); border-radius: 13px; background: rgba(240,253,244,.82); color: #244968; text-decoration: none; }
    .home-weather-saved__icon { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 11px; background: #dcfce7; color: #15803d; }
    .home-weather-saved__copy { display: flex; min-width: 0; flex-direction: column; line-height: 1.2; }
    .home-weather-saved__copy small { color: #527164; font-size: 9px; font-weight: 850; }
    .home-weather-saved__copy b { overflow: hidden; color: #23543a; font-size: 12px; font-weight: 950; text-overflow: ellipsis; white-space: nowrap; }
    .home-weather-saved__copy em { overflow: hidden; color: #607568; font-size: 9px; font-style: normal; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
    .home-weather-saved > strong { color: #23543a; font-size: 18px; font-weight: 950; }
    .home-weather-saved__go { display: inline-flex; min-height: 34px; align-items: center; color: #167647; font-size: 10px; font-weight: 900; }
    .home-weather-saved:focus-visible { outline: 3px solid rgba(22,163,74,.25); outline-offset: 2px; }
    .home-weather-saved--empty { grid-template-columns: 36px minmax(0,1fr) auto; background: rgba(255,255,255,.76); }
    .home-weather-local[hidden] { display: none !important; }
    .home-weather-local { width: 100%; padding: 12px; border: 1px solid rgba(30,82,136,.14); border-left: 4px solid #2f78b7; border-radius: 15px; background: linear-gradient(145deg,rgba(255,255,255,.97),rgba(239,247,255,.94)); box-shadow: 0 7px 18px rgba(30,82,136,.07); opacity: 0; transform: translateY(5px); transition: opacity .16s ease, transform .16s ease; }
    .home-weather-local.is-visible { opacity: 1; transform: translateY(0); }
    .home-weather-local__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
    .home-weather-local__eyebrow { display: block; margin-bottom: 3px; color: #2563a3; font-size: 10px; font-weight: 950; letter-spacing: .05em; text-transform: uppercase; }
    .home-weather-local__head h3 { margin: 0; color: #173f69; font-size: 16px; font-weight: 950; line-height: 1.15; letter-spacing: -.025em; }
    .home-weather-local__head p { margin: 3px 0 0; color: #536a82; font-size: 11px; font-weight: 750; line-height: 1.3; }
    .home-weather-local__head > strong { flex: 0 0 auto; color: #173f69; font-size: 25px; font-weight: 950; line-height: 1; letter-spacing: -.05em; }
    .home-weather-local__metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; margin-top: 10px; }
    .home-weather-local__metrics > span { display: grid; min-width: 0; grid-template-columns: 18px minmax(0,1fr); grid-template-rows: auto auto; align-items: center; column-gap: 4px; padding: 7px; border: 1px solid rgba(30,82,136,.09); border-radius: 11px; background: rgba(255,255,255,.78); }
    .home-weather-local__metrics i { grid-row: 1 / 3; color: #2f78b7; font-size: 14px; }
    .home-weather-local__metrics small { overflow: hidden; color: #6b7d91; font-size: 8.5px; font-weight: 850; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
    .home-weather-local__metrics b { overflow: hidden; color: #244968; font-size: 11px; font-weight: 950; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
    .home-weather-local__accuracy { margin: 9px 0 0; color: #5f7185; font-size: 9.5px; font-weight: 700; line-height: 1.4; }
    .home-weather-local__candidates { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 9px; }
    .home-weather-local__candidates[hidden] { display: none !important; }
    .home-weather-local__candidates strong { width: 100%; color: #3a536d; font-size: 10px; font-weight: 900; }
    .home-weather-local__separation { width: 100%; padding: 8px 9px; border-radius: 10px; background: #f0fdf4; color: #27613e; font-size: 10px; font-weight: 850; line-height: 1.35; }
    .home-weather-local__separation i { margin-right: 4px; color: #15803d; }
    .home-weather-local__candidates a,
    .home-weather-local__candidates button { display: inline-flex; min-height: 38px; align-items: center; justify-content: center; padding: 0 11px; border: 1px solid rgba(37,99,163,.16); border-radius: 999px; background: #fff; color: #245d94; font: inherit; font-size: 10px; font-weight: 850; line-height: 1.15; text-align: center; text-decoration: none; cursor: pointer; }
    .home-weather-local__candidates button.is-primary { border-color: #2563a3; background: #2563a3; color: #fff; }
    .home-weather-local__candidates button.is-save-home { border-color: rgba(22,101,52,.22); color: #166534; }
    .home-weather-local__detail { display: inline-flex; min-height: 38px; align-items: center; gap: 5px; margin-top: 9px; color: #1d5f99; font-size: 11px; font-weight: 950; text-decoration: none; }
    .home-weather-strip.is-refreshing::after,
    .home-weather-strip.is-location-refreshing::after { position: absolute; z-index: 2; top: 7px; right: 8px; width: 7px; height: 7px; border-radius: 999px; background: #3b82f6; box-shadow: 0 0 0 4px rgba(59,130,246,.12); content: ""; animation: homeWeatherRefreshPulse 1.3s ease-in-out infinite; }
    .home-weather-strip.is-location-refreshing .home-weather-local { opacity: .82; }
    @keyframes homeWeatherRefreshPulse { 0%,100% { transform: scale(.78); opacity: .48; } 50% { transform: scale(1); opacity: 1; } }
    @media (prefers-reduced-motion: reduce) { .home-weather-strip.is-refreshing::after, .home-weather-strip.is-location-refreshing::after { animation: none; } }

    @media (max-width: 767px) {
        .page-ui-home .home-weather-strip { gap: 6px !important; padding: 10px 11px !important; border-radius: 18px !important; box-shadow: 0 5px 14px rgba(20,58,102,.06) !important; }
        .page-ui-home .home-weather-head { min-height: 40px; }
        .page-ui-home .home-weather-title h2 { font-size: 15.5px; }
        .page-ui-home .home-weather-temp b { font-size: 18px; }
        .page-ui-home .home-weather-grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 4px; }
        .page-ui-home .home-weather-saved,
        .page-ui-home .home-weather-actions,
        .page-ui-home .home-weather-location-note,
        .page-ui-home .home-weather-location-status,
        .page-ui-home .home-weather-local { grid-column: 1 / -1; }
        .page-ui-home .home-weather-stat { min-height: 48px; flex-direction: column; justify-content: center; gap: 3px; padding: 4px 2px; border-radius: 12px; }
        .page-ui-home .home-weather-overview { margin-top: 3px; font-size: 11px; line-height: 1.2; }
        .page-ui-home .home-weather-stat span { gap: 0; justify-content: center; font-size: 9.5px; }
        .page-ui-home .home-weather-stat .hw-stat-icon { display: none; }
        .page-ui-home .home-weather-stat b { font-size: 13.5px; }
        .page-ui-home .home-weather-stat .hw-stat-unit { display: inline; font-size: 9.5px; }
        .page-ui-home .home-weather-actions { min-height: 44px; flex-wrap: nowrap; }
        .page-ui-home .home-weather-source { display: none; }
        .page-ui-home .home-weather-cta { display: grid; width: 100%; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 7px; }
        .page-ui-home .home-weather-locate,
        .page-ui-home .home-weather-link { min-height: 44px; padding: 6px 9px; border: 1px solid rgba(30,82,136,.14); border-radius: 12px; background: rgba(255,255,255,.88); font-size: 12px; line-height: 1.2; text-align: center; white-space: normal; }
        .page-ui-home .home-weather-link { justify-content: center; overflow: hidden; text-overflow: ellipsis; }
        .page-ui-home .home-weather-location-note,
        .page-ui-home .home-weather-location-status { margin-top: -1px; font-size: 10.5px; line-height: 1.25; }
        .page-ui-home .home-weather-location-note__full { display: none; }
        .page-ui-home .home-weather-location-note__mobile { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
        .page-ui-home .home-weather-saved__copy small,
        .page-ui-home .home-weather-saved__copy em { font-size: 11px; }
        .page-ui-home .home-weather-saved__copy b { font-size: 13px; }
        .page-ui-home .home-weather-local { padding: 11px; }
        .page-ui-home .home-weather-local__eyebrow,
        .page-ui-home .home-weather-local__candidates strong { font-size: 11px; }
        .page-ui-home .home-weather-local__head p,
        .page-ui-home .home-weather-local__detail { font-size: 12px; }
        .page-ui-home .home-weather-local__metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
        .page-ui-home .home-weather-local__metrics > span { min-height: 44px; }
        .page-ui-home .home-weather-local__metrics small { font-size: 10.5px; }
        .page-ui-home .home-weather-local__metrics b { font-size: 12px; }
        .page-ui-home .home-weather-local__accuracy { font-size: 11px; }
        .page-ui-home .home-weather-local__separation { font-size: 11.5px; }
        .page-ui-home .home-weather-local__candidates a,
        .page-ui-home .home-weather-local__candidates button { min-height: 48px; flex: 1 1 100%; font-size: 12px; }
        .page-ui-home .home-weather-local__detail { min-height: 44px; }
        .page-ui-home .home-weather-saved { grid-template-columns: 36px minmax(0,1fr) auto; min-height: 56px; }
        .page-ui-home .home-weather-saved__go { display: none; }
        .page-ui-home #tin .trend-head .trend-top-link { min-height: 44px; padding: 0 4px; }
        .page-ui-home .home-util-strip { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)) 20px; gap: 4px; min-height: 54px; padding: 5px; border-radius: 16px; }
        .page-ui-home .home-util-item,
        .page-ui-home .home-util-out { min-width: 0; min-height: 44px; justify-content: flex-start; gap: 6px; padding: 4px 6px; border: 0; border-radius: 11px; background: rgba(255,255,255,.72); }
        .page-ui-home .home-util-item i,
        .page-ui-home .home-util-out i { font-size: 15px; }
        .page-ui-home .home-util-copy { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: 2px; }
        .page-ui-home .home-util-label { display: block; overflow: hidden; max-width: 100%; color: #7b6a5f; font-size: 9px; font-weight: 800; line-height: 1; text-overflow: ellipsis; white-space: nowrap; }
        .page-ui-home .home-util-value { overflow: hidden; max-width: 100%; font-size: 11px; font-weight: 950; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
        .page-ui-home .home-util-sep,
        .page-ui-home .home-util-item .hu-unit { display: none; }
        .page-ui-home .home-util-go { width: 20px; min-height: 44px; justify-content: center; margin-left: 0; }

        .page-ui-home .home-showcase-head { display: flex !important; min-height: 48px; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important; }
        .page-ui-home .home-showcase-heading { min-width: 0; flex: 1 1 auto !important; }
        .page-ui-home .home-showcase-heading > div { overflow: hidden; }
        .page-ui-home .home-showcase-heading .market-home-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
        .page-ui-home .home-showcase-link { flex: 0 0 44px !important; align-self: center !important; margin-left: auto !important; }
        .page-ui-home .market-empty__cta,
        .page-ui-home .home-about-link,
        .page-ui-home .home-market-more { min-height: 44px !important; }
        .page-ui-home .home-market-more { display: flex; align-items: center; justify-content: center; }

        .page-ui-home .hw-scene::before,
        .page-ui-home .hw-scene::after,
        .page-ui-home .hw-anim-icon .hw-sun,
        .page-ui-home .hw-anim-icon .hw-sun::before,
        .page-ui-home .hw-anim-icon .hw-cloud,
        .page-ui-home .home-digital-skeleton { animation: none !important; }
    }

    /* Tablet vẫn là bề mặt app: ưu tiên lối tắt và danh sách quét nhanh,
       không dành gần trọn màn đầu cho hero kiểu desktop. */
    @media (min-width: 768px) and (max-width: 991.98px) {
        body.home-surface-app .home-mobile-priority-nav { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; margin: 0 0 12px; }
        body.home-surface-app .home-primary-action { display: flex; min-width: 0; min-height: 60px; flex-direction: row; align-items: center; justify-content: center; gap: 7px; padding: 7px 8px; border: 1px solid rgba(30,82,136,.10); border-radius: 14px; background: #fff; box-shadow: 0 4px 12px rgba(15,23,42,.04); color: #27435f; font-size: 11.5px; font-weight: 850; line-height: 1.15; text-align: center; text-decoration: none; transition: transform .16s ease, box-shadow .16s ease, background-color .16s ease; }
        body.home-surface-app .home-primary-action:active { transform: scale(.98); background: #f8fbff; }
        body.home-surface-app .home-primary-action__icon { display: grid; width: 30px; height: 30px; flex: 0 0 30px; place-items: center; border-radius: 9px; background: #eaf3fd; color: #1e5288; font-size: 15px; }
        body.home-surface-app .home-primary-action--explore .home-primary-action__icon { background: #e8f8ef; color: #08795f; }
        body.home-surface-app .home-primary-action--market .home-primary-action__icon { background: #fff1df; color: #c55a11; }
        body.home-surface-app .home-primary-action--agri .home-primary-action__icon { background: #e9f7ee; color: #176b4a; }
        body.home-surface-app .home-primary-action--safety .home-primary-action__icon { background: #e9f1ff; color: #2457a6; }
        body.home-surface-app .top-layout { display: block !important; }
        body.home-surface-app .top-layout .hero-news { display: none !important; }
        body.home-surface-app .top-layout .side-stack,
        body.home-surface-app .top-layout #tin { width: 100% !important; max-width: none !important; }
        body.home-surface-app #newsList .trend-primary-mobile { display: grid !important; }
    }

    @media (max-width: 379px) {
        .page-ui-home .home-weather-strip { gap: 6px !important; padding: 9px !important; }
        .page-ui-home .home-weather-stat span { font-size: 9px; }
        .page-ui-home .home-weather-stat { gap: 2px; padding-right: 2px; padding-left: 2px; }
        .page-ui-home .home-weather-stat b { font-size: 13px; }
        .page-ui-home .home-weather-cta { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px; }
        .page-ui-home .home-weather-locate,
        .page-ui-home .home-weather-link { width: 100%; min-height: 44px; }
        .page-ui-home .home-weather-locate,
        .page-ui-home .home-weather-link { min-width: 0; padding-inline: 5px; overflow: hidden; font-size: 11.5px; white-space: nowrap; text-overflow: ellipsis; }
        .page-ui-home .home-weather-source { font-size: 11.5px; }
        .page-ui-home .home-weather-location-note { font-size: 10.5px; line-height: 1.25; }
        .page-ui-home .home-util-strip { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 3px; padding: 5px; }
        .page-ui-home .home-util-item,
        .page-ui-home .home-util-out { gap: 2px; padding-right: 3px; padding-left: 3px; }
        .page-ui-home .home-util-item i,
        .page-ui-home .home-util-out i { font-size: 13px; }
        .page-ui-home .home-util-label { font-size: 9px; }
        .page-ui-home .home-util-value { font-size: 10.5px; }
        .page-ui-home .home-util-go { display: none; }
        .page-ui-home .home-showcase-heading .market-home-title { font-size: 17px !important; letter-spacing: -.04em; }
    }

    @media (max-width: 360px) {
        .page-ui-home #cam-nang-nong-nghiep .home-showcase-head { min-height: 58px; }
        .page-ui-home #cam-nang-nong-nghiep .home-showcase-heading > div { overflow: visible; }
        .page-ui-home #cam-nang-nong-nghiep .home-showcase-heading .market-home-title {
            overflow: visible;
            line-height: 1.05;
            text-overflow: clip;
            white-space: normal;
        }
        body.page-ui-home #kham-pha-ban-dia .home-explore-card,
        body.page-ui-home #cam-nang-nong-nghiep .home-agri-card { grid-template-columns: 100px minmax(0,1fr) !important; }
        body.page-ui-home #kham-pha-ban-dia .home-explore-media,
        body.page-ui-home #cam-nang-nong-nghiep .home-agri-card > img { width: 100px !important; min-width: 100px !important; }
    }

    /* Tin nóng mobile: đồng bộ đúng kích thước cột và ảnh, tránh ảnh 112px đè lên cột chữ. */
    @media (max-width: 767px) {
        /* Trang chủ mobile chỉ là bản tóm tắt: giữ 5 tin đầu để các tiện ích
           Khám phá/Chợ/Cẩm nang xuất hiện sau một lần vuốt, còn toàn bộ tin vẫn
           ở /diem-tin qua liên kết "Xem thêm" ngay trên tiêu đề. */
        .page-ui-home #newsList .trend-item:nth-child(n+6) { display: none !important; }
        .page-ui-home #newsList .trend-item,
        .page-ui-home #newsList .trend-primary-mobile {
            grid-template-columns: 76px minmax(0,1fr) !important;
            gap: 9px !important;
            align-items: stretch !important;
            padding: 7px !important;
        }
        .page-ui-home #newsList .trend-item .thumb,
        .page-ui-home #newsList .trend-item .news-thumb-img {
            width: 76px !important;
            min-width: 76px !important;
            height: 100% !important;
            min-height: 78px !important;
            aspect-ratio: auto !important;
        }
        .page-ui-home #newsList .trend-item > div {
            gap: 2px !important;
            min-height: 0 !important;
            height: auto !important;
        }
        .page-ui-home #newsList .trend-item small {
            overflow: hidden !important;
            font-size: 10.5px !important;
            line-height: 1.25 !important;
            text-overflow: ellipsis !important;
            white-space: nowrap !important;
        }
        .page-ui-home #newsList .trend-item b {
            display: -webkit-box !important;
            overflow: hidden !important;
            flex: 0 0 auto !important;
            font-size: 13.5px !important;
            line-height: 1.3 !important;
            -webkit-box-orient: vertical !important;
            -webkit-line-clamp: 2 !important;
        }
        .page-ui-home #newsList .trend-item .trend-desc {
            display: none !important;
        }
    }

    @media (max-width: 360px) {
        .page-ui-home #newsList .trend-item,
        .page-ui-home #newsList .trend-primary-mobile {
            grid-template-columns: 72px minmax(0,1fr) !important;
        }
        .page-ui-home #newsList .trend-item .thumb,
        .page-ui-home #newsList .trend-item .news-thumb-img {
            width: 72px !important;
            min-width: 72px !important;
            min-height: 76px !important;
        }
        .page-ui-home #newsList .trend-item b {
            min-height: calc(1.3em * 2) !important;
            max-height: calc(1.3em * 2) !important;
        }
    }

    @media (hover: none) {
        .page-ui-home .home-digital-card:hover,
        .page-ui-home .home-util-strip:hover .home-util-go i,
        .page-ui-home .home-weather-link:hover i,
        .page-ui-home .home-weather-stat:hover { transform: none !important; }
    }

    @media (prefers-reduced-motion: reduce) {
        .page-ui-home .home-primary-action,
        .page-ui-home .home-showcase-link,
        .page-ui-home .home-util-strip,
        .page-ui-home .home-weather-link,
        .page-ui-home .home-weather-stat,
        .page-ui-home .home-weather-local { scroll-behavior: auto !important; transition: none !important; }
    }

.home-util-strip{display:flex;align-items:center;gap:6px;margin:0 0 10px;padding:6px 10px;border:1px solid rgba(180,83,9,.16);border-radius:999px;background:linear-gradient(135deg,#fff8ec 0%,#fffdf7 58%,#fdeede 100%);box-shadow:0 8px 20px rgba(120,63,4,.06);color:#3b2a14;overflow:hidden;text-decoration:none}
                    .home-util-item{display:inline-flex;align-items:center;gap:4px;min-width:0;white-space:nowrap;font-size:12.5px;font-weight:950;letter-spacing:-.02em;color:#7c3a06}
                    .home-util-item i{font-size:14px;flex:0 0 auto}
                    .home-util-item .hu-unit{font-size:10px;font-weight:800;color:#b45309}
                    .home-util-fuel i{color:#d97706}
                    .home-util-power i{color:#0e7490}
                    .home-util-power{color:#155e75}
                    .home-util-power .hu-unit{color:#0e7490}
                    .home-util-sep{width:1px;height:14px;background:rgba(120,63,4,.18);flex:0 0 auto}
                    .home-util-out{display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:999px;font-size:11.5px;font-weight:900;white-space:nowrap;border:1px solid rgba(100,116,139,.22);background:#f1f5f9;color:#64748b}
                    .home-util-out i{font-size:11px}
                    .home-util-out.is-alert{background:#fef2f2;border-color:rgba(220,38,38,.3);color:#dc2626}
                    .home-util-go{margin-left:auto;display:inline-flex;align-items:center;color:#b45309;flex:0 0 auto}
                    .home-util-go i{font-size:13px;transition:transform .12s ease}
                    .home-util-strip:hover .home-util-go i{transform:translateX(2px)}
                    .home-util-pending{font-size:11.5px;font-weight:800;color:#94a3b8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
                    @media(max-width:760px){
                        .home-util-strip{gap:5px;padding:6px 9px}
                        .home-util-item{font-size:11.5px}
                        .home-util-item .hu-unit{display:none}
                        .home-util-out{font-size:10.5px;padding:2px 6px}
                    }

/* Mobile app density v4: the home screen is a dashboard, not a second copy of
   every full section. Keep touch targets clear while surfacing all core areas
   within fewer vertical swipes. Desktop and /web are intentionally unchanged. */
@media (max-width: 767px) {
    body.page-ui-home .main-wrap { padding-top: 8px !important; }

    body.page-ui-home #newsList .trend-item:nth-child(n+4) { display: none !important; }
    body.page-ui-home #newsList .trend-item,
    body.page-ui-home #newsList .trend-primary-mobile {
        min-height: 78px !important;
        grid-template-columns: 68px minmax(0, 1fr) !important;
        gap: 8px !important;
        padding: 6px !important;
    }
    body.page-ui-home #newsList .trend-item .thumb,
    body.page-ui-home #newsList .trend-item .news-thumb-img {
        width: 68px !important;
        min-width: 68px !important;
        min-height: 70px !important;
    }

    body.page-ui-home .home-digital-section,
    body.page-ui-home #kham-pha-ban-dia,
    body.page-ui-home #cho-lao-cai,
    body.page-ui-home .home-agri-section {
        padding: 11px !important;
        border-radius: 20px !important;
    }
    body.page-ui-home .home-showcase-head {
        min-height: 40px !important;
        margin-bottom: 8px !important;
    }
    body.page-ui-home .home-showcase-icon {
        width: 34px !important;
        height: 34px !important;
        flex: 0 0 34px !important;
        border-radius: 11px !important;
        font-size: 16px !important;
    }
    body.page-ui-home .home-showcase-heading .market-home-title { font-size: 17px !important; }
    body.page-ui-home .home-showcase-kicker { font-size: 8px !important; }
    body.page-ui-home .home-showcase-link {
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
    }

    body.page-ui-home #homeDigitalGrid {
        display: flex !important;
        gap: 8px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        overscroll-behavior-inline: contain;
        scroll-snap-type: inline mandatory;
        scrollbar-width: none;
        touch-action: pan-x pan-y;
        -webkit-overflow-scrolling: touch;
    }
    body.page-ui-home #homeDigitalGrid::-webkit-scrollbar { display: none; }
    body.page-ui-home #homeDigitalGrid .home-digital-card {
        flex: 0 0 calc(100% - 28px) !important;
        width: calc(100% - 28px) !important;
        max-width: calc(100% - 28px) !important;
        min-height: 104px !important;
        height: 104px !important;
        grid-template-columns: 104px minmax(0, 1fr) !important;
        scroll-snap-align: start;
    }
    body.page-ui-home #homeDigitalGrid .home-digital-media {
        width: 104px !important;
        min-width: 104px !important;
        height: 104px !important;
        min-height: 104px !important;
    }
    body.page-ui-home #homeDigitalGrid .home-digital-body {
        height: 104px !important;
        min-height: 104px !important;
        padding: 8px 9px !important;
    }
    body.page-ui-home .home-digital-guide-strip {
        min-height: 42px !important;
        margin-top: 8px !important;
        padding: 7px 9px !important;
    }
    body.page-ui-home .home-digital-guide-strip strong {
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    body.page-ui-home #cho-lao-cai .market-highlight { margin-top: 8px !important; }
    body.page-ui-home #cho-lao-cai .home-market-more { display: none !important; }
    body.page-ui-home #homeMarketGrid > .market-empty {
        grid-template-columns: 38px minmax(0, 1fr) !important;
        gap: 8px !important;
        padding: 10px !important;
    }
    body.page-ui-home .market-empty__icon {
        width: 38px !important;
        height: 38px !important;
    }

    body.page-ui-home .home-about-card {
        padding: 12px !important;
        border-radius: 18px !important;
    }
    body.page-ui-home .home-about-card h2 {
        margin: 8px 0 4px !important;
        font-size: 18px !important;
    }
    body.page-ui-home .home-about-card p {
        font-size: 12px !important;
        line-height: 1.4 !important;
    }
    body.page-ui-home .home-about-links {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 7px !important;
        margin-top: 10px !important;
    }
    body.page-ui-home .home-about-link {
        min-width: 0;
        min-height: 44px !important;
        padding: 0 9px !important;
        font-size: 11px !important;
    }
}

/* Agriculture cards without exact-location media */
body.page-ui-home #cam-nang-nong-nghiep .home-agri-card__photo-pending{display:flex;width:100%;height:100%;min-height:94px;flex-direction:column;align-items:center;justify-content:center;gap:5px;border-radius:inherit;background:linear-gradient(145deg,#edf8f2,#e0f1e8);color:#315e4c;text-align:center}
body.page-ui-home #cam-nang-nong-nghiep .home-agri-card__photo-pending i{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:#fff;color:#176b4a;font-size:16px}
body.page-ui-home #cam-nang-nong-nghiep .home-agri-card__photo-pending small{font-size:9.5px;font-weight:800;line-height:1.2}
body.page-ui-home #cam-nang-nong-nghiep .home-agri-card--illustrative{position:relative}
body.page-ui-home #cam-nang-nong-nghiep .home-agri-card__image-note{position:absolute;left:8px;top:8px;z-index:1;display:inline-flex;align-items:center;min-height:24px;padding:3px 7px;border-radius:999px;background:rgba(22,55,43,.88);color:#fff;font-size:9px;font-weight:850;line-height:1;backdrop-filter:blur(3px)}

@media (max-width: 359px) {
    body.page-ui-home #newsList .trend-item,
    body.page-ui-home #newsList .trend-primary-mobile {
        grid-template-columns: 64px minmax(0, 1fr) !important;
    }
    body.page-ui-home #newsList .trend-item .thumb,
    body.page-ui-home #newsList .trend-item .news-thumb-img {
        width: 64px !important;
        min-width: 64px !important;
    }
    body.page-ui-home #homeDigitalGrid .home-digital-card {
        grid-template-columns: 94px minmax(0, 1fr) !important;
    }
    body.page-ui-home #homeDigitalGrid .home-digital-media {
        width: 94px !important;
        min-width: 94px !important;
    }
}

/* Digital topics v24: two direct destinations instead of one ambiguous
   combined link. Icons remain vector-only and the controls stay one-row. */
.page-ui-home .home-digital-topic-links {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 6px;
}
.page-ui-home .home-digital-topic-links a {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    gap: 5px;
    padding: 6px 9px;
    border: 1px solid rgba(30,82,136,.14);
    border-radius: 999px;
    background: #f7fbff;
    color: #1e5288;
    font-size: 10px;
    font-weight: 850;
    line-height: 1;
    text-decoration: none;
}
.page-ui-home .home-digital-topic-links a:active { transform: scale(.97); }
@media (max-width: 560px) {
    .page-ui-home .home-digital-topic-links { gap: 4px; }
    .page-ui-home .home-digital-topic-links a {
        width: 34px;
        min-width: 34px;
        min-height: 34px;
        justify-content: center;
        padding: 0;
        font-size: 15px;
    }
    .page-ui-home .home-digital-topic-links a span {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }
}

/* Mobile home app hierarchy v7: prioritize resident tasks and the three core
   products, reduce nested-card density, and keep the desktop /web composition
   unchanged. The phone home is a compact one-pane feed with stable app tabs. */
@media (max-width: 767px) {
    body.page-ui-home .main-wrap {
        padding-top: 6px !important;
    }

    body.page-ui-home .content-layout,
    body.page-ui-home .main-column {
        gap: 0 !important;
    }

    body.page-ui-home .main-column {
        display: flex !important;
        min-width: 0;
        flex-direction: column;
    }

    body.page-ui-home .main-column > .home-weather-strip { order: 10; }
    body.page-ui-home .main-column > .home-util-strip { order: 20; }
    body.page-ui-home .main-column > .home-mobile-priority-nav { order: 30; }
    body.page-ui-home .main-column > #diem-tin { order: 40; }
    body.page-ui-home .main-column > #kham-pha-ban-dia { order: 50; }
    body.page-ui-home .main-column > #cho-lao-cai { order: 60; }
    body.page-ui-home .main-column > #cam-nang-nong-nghiep { order: 70; }
    body.page-ui-home .main-column > #chuyen-doi-so { order: 80; }

    body.page-ui-home .home-weather-strip {
        gap: 4px !important;
        margin-bottom: 7px !important;
        padding: 6px 7px 5px !important;
        border-radius: 16px !important;
        box-shadow: 0 4px 14px rgba(20, 58, 102, .055) !important;
    }

    body.page-ui-home .home-weather-locate,
    body.page-ui-home .home-weather-link {
        min-height: 40px !important;
    }

    body.page-ui-home .home-weather-location-note {
        margin-top: -5px !important;
        font-size: 8.75px !important;
    }

    body.page-ui-home .home-util-strip {
        min-height: 46px;
        margin-bottom: 7px !important;
        padding: 4px 8px !important;
        border-radius: 14px !important;
        box-shadow: 0 3px 12px rgba(120, 63, 4, .045) !important;
    }

    body.page-ui-home .home-util-item,
    body.page-ui-home .home-util-out {
        min-width: 0;
        flex: 1 1 0;
        justify-content: flex-start;
    }

    body.page-ui-home .home-util-copy {
        min-width: 0;
        flex-direction: column;
        align-items: flex-start;
        gap: 0;
        line-height: 1.05;
    }

    body.page-ui-home .home-util-label {
        display: block !important;
        overflow: hidden;
        color: #7b8794;
        font-size: 8px;
        font-weight: 800;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.page-ui-home .home-util-value {
        overflow: hidden;
        max-width: 100%;
        font-size: 10.5px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.page-ui-home .home-util-sep {
        height: 25px;
    }

    body.page-ui-home #tin.trend-card {
        padding: 5px 9px 4px !important;
        border-radius: 16px !important;
        box-shadow: 0 4px 14px rgba(15, 45, 75, .04) !important;
    }

    body.page-ui-home #newsList .trend-item:nth-child(n+3),
    body.page-ui-home #newsList .trend-primary-mobile:nth-child(n+3) {
        display: none !important;
    }

    body.page-ui-home #newsList .trend-item .thumb,
    body.page-ui-home #newsList .trend-item .news-thumb-img,
    body.page-ui-home #newsList .trend-primary-mobile .thumb,
    body.page-ui-home #newsList .trend-primary-mobile .news-thumb-img {
        width: 50px !important;
        min-width: 50px !important;
        height: 50px !important;
        min-height: 50px !important;
        border-radius: 10px !important;
    }

    body.page-ui-home #newsList .trend-item b,
    body.page-ui-home #newsList .trend-primary-mobile b {
        font-size: 12.5px !important;
        line-height: 1.24 !important;
    }

    body.page-ui-home .home-digital-section,
    body.page-ui-home #kham-pha-ban-dia,
    body.page-ui-home #cho-lao-cai,
    body.page-ui-home .home-agri-section {
        margin-bottom: 7px !important;
        padding: 7px !important;
        border-radius: 16px !important;
        box-shadow: 0 4px 14px rgba(15, 45, 75, .04) !important;
    }

    body.page-ui-home .home-showcase-head {
        min-height: 36px !important;
        margin-bottom: 4px !important;
        gap: 7px !important;
    }

    body.page-ui-home .home-showcase-icon {
        width: 30px !important;
        height: 30px !important;
        flex: 0 0 30px !important;
        border-radius: 9px !important;
        font-size: 14px !important;
        box-shadow: none !important;
    }

    body.page-ui-home .home-showcase-heading .market-home-title {
        font-size: 15px !important;
        letter-spacing: -.025em !important;
    }

    body.page-ui-home .home-showcase-link {
        width: 36px !important;
        min-width: 36px !important;
        height: 36px !important;
        min-height: 36px !important;
        border-radius: 11px !important;
    }

    body.page-ui-home #homeDigitalGrid .home-digital-card,
    body.page-ui-home #kham-pha-ban-dia .home-explore-card,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card {
        flex-basis: calc(100% - 38px) !important;
        width: calc(100% - 38px) !important;
        max-width: calc(100% - 38px) !important;
        min-height: 92px !important;
        height: 92px !important;
        border-radius: 13px !important;
    }

    body.page-ui-home #kham-pha-ban-dia .home-explore-meta > span:nth-child(2),
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card__body > span:last-child {
        display: none !important;
    }

    body.page-ui-home #kham-pha-ban-dia .home-explore-card h3,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card h3,
    body.page-ui-home #homeDigitalGrid .home-digital-card h3 {
        font-size: 12.5px !important;
        line-height: 1.28 !important;
        -webkit-line-clamp: 2 !important;
    }

    body.page-ui-home .home-digital-guide-strip {
        display: none !important;
    }

    body.page-ui-home #cho-lao-cai .market-highlight {
        margin-top: 4px !important;
    }

    body.page-ui-home #homeMarketGrid > .market-empty {
        min-height: 58px !important;
        grid-template-columns: 34px minmax(0, 1fr) auto !important;
        gap: 7px !important;
        padding: 7px !important;
        border-radius: 13px !important;
    }

    body.page-ui-home .market-empty__icon {
        width: 34px !important;
        height: 34px !important;
        border-radius: 10px !important;
        font-size: 16px !important;
    }

    body.page-ui-home .market-empty__copy b {
        font-size: 11.5px !important;
        line-height: 1.2 !important;
    }

    body.page-ui-home .market-empty__cta {
        width: auto !important;
        min-height: 40px !important;
        grid-column: auto !important;
        padding: 0 11px !important;
        font-size: 0 !important;
    }

    body.page-ui-home .market-empty__cta i {
        margin: 0 !important;
        font-size: 17px !important;
    }

    body.page-ui-home .right-column.home-about-column {
        margin: 0 0 7px !important;
    }

    body.page-ui-home .home-about-card {
        display: flex !important;
        min-height: 48px;
        align-items: center;
        justify-content: space-between;
        gap: 7px;
        padding: 2px 7px !important;
        border-radius: 14px !important;
        box-shadow: none !important;
    }

    body.page-ui-home .home-about-card h2,
    body.page-ui-home .home-about-card p,
    body.page-ui-home .home-about-link:first-child {
        display: none !important;
    }

    body.page-ui-home .home-about-badge {
        min-height: 34px;
        flex: 0 0 auto;
        padding: 0 9px;
        font-size: 8.5px;
    }

    body.page-ui-home .home-about-links {
        display: block !important;
        min-width: 0;
        flex: 1 1 auto;
        margin: 0 !important;
    }

    body.page-ui-home .home-about-link--feedback {
        min-height: 44px !important;
        justify-content: center;
        padding: 0 10px !important;
        border-radius: 11px !important;
        font-size: 10.5px !important;
    }
}

@media (max-width: 359px) {
    body.page-ui-home .home-weather-stat span {
        font-size: 8.25px !important;
    }

    body.page-ui-home #homeMarketGrid > .market-empty {
        grid-template-columns: 32px minmax(0, 1fr) 40px !important;
    }
}

/* Mobile home top shell v5: keep the first screen as one compact app dashboard.
   The four risk levels and both weather actions remain native links/controls. */
@media (max-width: 767px) {
    body.page-ui-home .home-weather-strip {
        gap: 4px !important;
        padding: 7px 8px !important;
    }
    body.page-ui-home .home-weather-head {
        min-height: 36px;
    }
    body.page-ui-home .home-weather-main {
        display: flex;
        min-width: 0;
        align-items: center;
        gap: 6px;
    }
    body.page-ui-home .home-weather-title {
        min-width: 0;
        flex: 1 1 auto;
    }
    body.page-ui-home .home-weather-title h2 {
        min-width: 0;
        flex: 0 1 auto;
        font-size: 14.5px;
    }
    body.page-ui-home .home-weather-overview {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        padding: 0;
        overflow: hidden;
        border: 0;
        clip: rect(0 0 0 0);
        clip-path: inset(50%);
        white-space: nowrap;
    }
    body.page-ui-home .home-weather-temp b {
        font-size: 17px;
    }
    body.page-ui-home .home-weather-temp b.is-pending {
        max-width: none;
        font-size: 11px;
        white-space: nowrap;
    }
    body.page-ui-home .home-weather-stat {
        min-width: 0;
        min-height: 48px;
        gap: 2px;
        padding: 3px 2px;
    }
    body.page-ui-home .home-weather-stat span {
        display: block;
        width: 100%;
        overflow: hidden;
        font-size: clamp(9px, 2.45vw, 10px);
        line-height: 1.05;
        text-align: center;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    body.page-ui-home .home-weather-stat b {
        font-size: 13px;
    }
    body.page-ui-home .home-weather-actions {
        min-height: 44px;
    }
    body.page-ui-home .home-weather-cta {
        gap: 6px;
    }
    body.page-ui-home .home-weather-location-note,
    body.page-ui-home .home-weather-location-status {
        min-width: 0;
        overflow: hidden;
        font-size: 10px;
        line-height: 1.2;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    body.page-ui-home .home-weather-saved {
        min-height: 52px;
        padding: 6px 8px;
    }
}

/* Mobile home app density v6: use one flat, grouped feed instead of cards
   inside cards. This mirrors native news lists, brings the core hubs into the
   first swipe and leaves desktop /web untouched. */
@media (max-width: 767px) {
    body.page-ui-home #tin.trend-card {
        width: 100% !important;
        min-height: 0 !important;
        max-height: none !important;
        padding: 8px 10px 6px !important;
        overflow: hidden !important;
        border: 1px solid rgba(30, 82, 136, .09) !important;
        border-radius: 18px !important;
        background: #fff !important;
        box-shadow: 0 5px 16px rgba(15, 45, 75, .045) !important;
    }

    body.page-ui-home #tin .trend-head {
        min-height: 42px !important;
        margin: 0 !important;
        padding: 0 2px 6px !important;
        border-bottom: 1px solid #edf1f5 !important;
    }

    body.page-ui-home #tin .trend-head-title {
        gap: 7px !important;
        font-size: 14px !important;
        letter-spacing: -.02em;
    }

    body.page-ui-home #tin .trend-head .trend-top-link {
        min-height: 42px !important;
        padding: 0 2px 0 8px !important;
        font-size: 10.5px !important;
    }

    body.page-ui-home #newsList.trend-list {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        background: transparent !important;
    }

    body.page-ui-home #newsList .trend-item,
    body.page-ui-home #newsList .trend-primary-mobile {
        display: grid !important;
        grid-template-columns: 56px minmax(0, 1fr) !important;
        gap: 9px !important;
        min-height: 68px !important;
        height: 68px !important;
        align-items: center !important;
        margin: 0 !important;
        padding: 6px 2px !important;
        overflow: hidden !important;
        border: 0 !important;
        border-bottom: 1px solid #edf1f5 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    body.page-ui-home #newsList .trend-item:active,
    body.page-ui-home #newsList .trend-primary-mobile:active {
        background: #f6f9fc !important;
        transform: scale(.992) !important;
    }

    body.page-ui-home #newsList .trend-item .thumb,
    body.page-ui-home #newsList .trend-item .news-thumb-img,
    body.page-ui-home #newsList .trend-primary-mobile .thumb,
    body.page-ui-home #newsList .trend-primary-mobile .news-thumb-img {
        width: 56px !important;
        min-width: 56px !important;
        height: 56px !important;
        min-height: 56px !important;
        border-radius: 11px !important;
        object-fit: cover !important;
    }

    body.page-ui-home #newsList .trend-item > div,
    body.page-ui-home #newsList .trend-primary-mobile > div {
        display: flex !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        flex-direction: column !important;
        justify-content: center !important;
        gap: 2px !important;
    }

    body.page-ui-home #newsList .trend-item small,
    body.page-ui-home #newsList .trend-primary-mobile small {
        overflow: hidden !important;
        margin: 0 !important;
        color: #758396 !important;
        font-size: 9.5px !important;
        line-height: 1.2 !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    body.page-ui-home #newsList .trend-item b,
    body.page-ui-home #newsList .trend-primary-mobile b {
        display: -webkit-box !important;
        min-height: 0 !important;
        max-height: calc(1.28em * 2) !important;
        margin: 0 !important;
        overflow: hidden !important;
        color: #18283b !important;
        font-size: 13px !important;
        font-weight: 850 !important;
        line-height: 1.28 !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
    }

    body.page-ui-home .home-digital-section,
    body.page-ui-home #kham-pha-ban-dia,
    body.page-ui-home #cho-lao-cai,
    body.page-ui-home .home-agri-section {
        margin-bottom: 10px !important;
        padding: 9px !important;
        border-radius: 18px !important;
    }

    body.page-ui-home .home-showcase-head {
        min-height: 38px !important;
        margin-bottom: 6px !important;
        gap: 8px !important;
    }

    body.page-ui-home .home-showcase-icon {
        width: 32px !important;
        height: 32px !important;
        flex: 0 0 32px !important;
        border-radius: 10px !important;
        font-size: 15px !important;
    }

    body.page-ui-home .home-showcase-kicker {
        display: none !important;
    }

    body.page-ui-home .home-showcase-heading .market-home-title {
        font-size: 16px !important;
        line-height: 1.15 !important;
    }

    body.page-ui-home .home-showcase-link {
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        border-radius: 12px !important;
    }

    body.page-ui-home #homeDigitalGrid .home-digital-card {
        flex-basis: calc(100% - 24px) !important;
        width: calc(100% - 24px) !important;
        max-width: calc(100% - 24px) !important;
        min-height: 96px !important;
        height: 96px !important;
        grid-template-columns: 96px minmax(0, 1fr) !important;
    }

    body.page-ui-home #homeDigitalGrid .home-digital-media {
        width: 96px !important;
        min-width: 96px !important;
        height: 96px !important;
        min-height: 96px !important;
    }

    body.page-ui-home #homeDigitalGrid .home-digital-body {
        height: 96px !important;
        min-height: 96px !important;
        padding: 7px 8px !important;
    }

    body.page-ui-home .home-digital-guide-strip {
        min-height: 40px !important;
        margin-top: 6px !important;
        padding: 6px 8px !important;
    }

    body.page-ui-home #kham-pha-ban-dia .home-explore-card,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card {
        flex-basis: calc(100% - 24px) !important;
        width: calc(100% - 24px) !important;
        max-width: calc(100% - 24px) !important;
        min-height: 104px !important;
        height: 104px !important;
    }

    body.page-ui-home #kham-pha-ban-dia .home-explore-media,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card > img,
    body.page-ui-home #kham-pha-ban-dia .home-explore-body,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card__body {
        height: 104px !important;
        min-height: 104px !important;
    }
}

@media (max-width: 359px) {
    body.page-ui-home #newsList .trend-item,
    body.page-ui-home #newsList .trend-primary-mobile {
        grid-template-columns: 52px minmax(0, 1fr) !important;
        gap: 8px !important;
    }

    body.page-ui-home #newsList .trend-item .thumb,
    body.page-ui-home #newsList .trend-item .news-thumb-img,
    body.page-ui-home #newsList .trend-primary-mobile .thumb,
    body.page-ui-home #newsList .trend-primary-mobile .news-thumb-img {
        width: 52px !important;
        min-width: 52px !important;
        height: 52px !important;
        min-height: 52px !important;
    }
}

/* Mobile home app hierarchy v7 live final: later legacy density rules remain
   as rollback history; this final phone-only layer is authoritative. */
@media (max-width: 767px) {
    body.page-ui-home .home-weather-strip { gap: 3px !important; padding: 6px 7px 5px !important; }
    body.page-ui-home .home-weather-head { min-height: 31px !important; }
    body.page-ui-home .home-weather-title h2 { font-size: 14px !important; }
    body.page-ui-home .home-weather-temp b { font-size: 16px !important; }
    body.page-ui-home .home-weather-grid { gap: 3px !important; }
    body.page-ui-home .home-weather-stat {
        min-height: 44px !important;
        padding: 3px 1px !important;
        border-radius: 11px !important;
    }
    body.page-ui-home .home-weather-stat span { font-size: clamp(8.5px, 2.35vw, 9.5px) !important; }
    body.page-ui-home .home-weather-stat b { font-size: 12px !important; }
    body.page-ui-home .home-weather-actions { min-height: 40px !important; }
    body.page-ui-home #tin.trend-card { padding: 5px 9px 4px !important; border-radius: 16px !important; }
    body.page-ui-home #tin .trend-head { min-height: 36px !important; padding-bottom: 3px !important; }
    body.page-ui-home #tin .trend-head .trend-top-link { min-height: 36px !important; }
    body.page-ui-home #newsList .trend-item,
    body.page-ui-home #newsList .trend-primary-mobile {
        grid-template-columns: 50px minmax(0, 1fr) !important;
        gap: 8px !important;
        min-height: 60px !important;
        height: 60px !important;
        padding: 5px 1px !important;
    }
    body.page-ui-home #newsList .trend-item .thumb,
    body.page-ui-home #newsList .trend-item .news-thumb-img,
    body.page-ui-home #newsList .trend-primary-mobile .thumb,
    body.page-ui-home #newsList .trend-primary-mobile .news-thumb-img {
        width: 50px !important;
        min-width: 50px !important;
        height: 50px !important;
        min-height: 50px !important;
    }

    body.page-ui-home .home-digital-section,
    body.page-ui-home #kham-pha-ban-dia,
    body.page-ui-home #cho-lao-cai,
    body.page-ui-home .home-agri-section {
        margin-bottom: 7px !important;
        padding: 7px !important;
        border-radius: 16px !important;
    }
    body.page-ui-home .home-showcase-head { min-height: 36px !important; margin-bottom: 4px !important; }
    body.page-ui-home .home-showcase-icon {
        width: 30px !important;
        height: 30px !important;
        flex: 0 0 30px !important;
        border-radius: 9px !important;
        font-size: 14px !important;
    }
    body.page-ui-home .home-showcase-heading .market-home-title { font-size: 15px !important; }
    body.page-ui-home .home-showcase-link {
        width: 36px !important;
        min-width: 36px !important;
        height: 36px !important;
        min-height: 36px !important;
    }
    body.page-ui-home #homeDigitalGrid .home-digital-card,
    body.page-ui-home #kham-pha-ban-dia .home-explore-card,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card {
        flex-basis: calc(100% - 38px) !important;
        width: calc(100% - 38px) !important;
        max-width: calc(100% - 38px) !important;
        min-height: 92px !important;
        height: 92px !important;
    }
    body.page-ui-home #homeDigitalGrid .home-digital-card { grid-template-columns: 92px minmax(0, 1fr) !important; }
    body.page-ui-home #homeDigitalGrid .home-digital-media,
    body.page-ui-home #kham-pha-ban-dia .home-explore-media,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card > img {
        width: 92px !important;
        min-width: 92px !important;
        height: 92px !important;
        min-height: 92px !important;
    }
    body.page-ui-home #homeDigitalGrid .home-digital-body,
    body.page-ui-home #kham-pha-ban-dia .home-explore-body,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card__body {
        height: 92px !important;
        min-height: 92px !important;
        padding: 7px 8px !important;
    }
}

/* Mobile home app density v8: one calm, native-style content plane.
   Keep every core destination and weather risk action available, while moving
   secondary explanations off the first screen and removing nested-card bulk. */
@media (max-width: 767px) {
    body.page-ui-home .main-wrap {
        padding: 5px 10px 62px !important;
    }

    body.page-ui-home .main-column {
        gap: 0 !important;
    }

    body.page-ui-home .home-weather-strip {
        gap: 3px !important;
        padding: 5px 6px !important;
        border: 1px solid rgba(30, 82, 136, .10) !important;
        border-radius: 14px !important;
        box-shadow: 0 3px 12px rgba(15, 45, 75, .045) !important;
    }

    body.page-ui-home .home-weather-head {
        min-height: 29px !important;
    }

    body.page-ui-home .home-weather-title h2 {
        font-size: 13.5px !important;
        letter-spacing: -.025em !important;
    }

    body.page-ui-home .home-weather-temp b {
        font-size: 15px !important;
    }

    body.page-ui-home .home-weather-grid {
        gap: 2px !important;
    }

    body.page-ui-home .home-weather-stat {
        min-height: 44px !important;
        padding: 2px 1px !important;
        border-radius: 9px !important;
        box-shadow: none !important;
    }

    body.page-ui-home .home-weather-stat span {
        font-size: clamp(8px, 2.2vw, 9px) !important;
    }

    body.page-ui-home .home-weather-stat b {
        font-size: 11.5px !important;
    }

    body.page-ui-home .home-weather-actions {
        min-height: 38px !important;
    }

    body.page-ui-home .home-weather-locate,
    body.page-ui-home .home-weather-link {
        min-height: 38px !important;
        padding: 4px 7px !important;
        border-radius: 10px !important;
        font-size: 11px !important;
    }

    body.page-ui-home .home-weather-location-note {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        margin: -1px !important;
        padding: 0 !important;
        overflow: hidden !important;
        clip: rect(0 0 0 0) !important;
        clip-path: inset(50%) !important;
        white-space: nowrap !important;
    }

    body.page-ui-home .home-util-strip {
        min-height: 52px !important;
        height: auto !important;
        margin-bottom: 6px !important;
        padding: 4px 8px !important;
        border-radius: 12px !important;
        box-shadow: none !important;
    }

    body.page-ui-home .home-util-strip__item {
        gap: 5px !important;
    }

    body.page-ui-home #tin.trend-card {
        padding: 4px 8px 3px !important;
        border-radius: 14px !important;
        box-shadow: 0 3px 12px rgba(15, 45, 75, .04) !important;
    }

    body.page-ui-home #tin .trend-head {
        min-height: 32px !important;
        padding: 0 1px 2px !important;
    }

    body.page-ui-home #tin .trend-head-title {
        font-size: 13.5px !important;
    }

    body.page-ui-home #tin .trend-head .trend-top-link {
        min-height: 32px !important;
        font-size: 10px !important;
    }

    body.page-ui-home #newsList .trend-item,
    body.page-ui-home #newsList .trend-primary-mobile {
        grid-template-columns: 44px minmax(0, 1fr) !important;
        gap: 8px !important;
        min-height: 54px !important;
        height: 54px !important;
        padding: 4px 1px !important;
    }

    /* Home is a dashboard, not the News archive: preview one current headline.
       The News page, feed and content pipeline remain unchanged. */
    body.page-ui-home #newsList .trend-item:nth-child(n+2),
    body.page-ui-home #newsList .trend-primary-mobile:nth-child(n+2) {
        display: none !important;
    }

    body.page-ui-home #newsList .trend-item .thumb,
    body.page-ui-home #newsList .trend-item .news-thumb-img,
    body.page-ui-home #newsList .trend-primary-mobile .thumb,
    body.page-ui-home #newsList .trend-primary-mobile .news-thumb-img {
        width: 44px !important;
        min-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        border-radius: 9px !important;
    }

    body.page-ui-home #newsList .trend-item small,
    body.page-ui-home #newsList .trend-primary-mobile small {
        font-size: 9px !important;
    }

    body.page-ui-home #newsList .trend-item b,
    body.page-ui-home #newsList .trend-primary-mobile b {
        font-size: 12.5px !important;
    }

    body.page-ui-home .home-digital-section,
    body.page-ui-home #kham-pha-ban-dia,
    body.page-ui-home #cho-lao-cai,
    body.page-ui-home .home-agri-section {
        width: 100% !important;
        margin: 0 0 6px !important;
        padding: 6px !important;
        border: 1px solid rgba(30, 82, 136, .09) !important;
        border-radius: 14px !important;
        box-shadow: 0 3px 12px rgba(15, 45, 75, .04) !important;
    }

    body.page-ui-home .home-showcase-head {
        min-height: 30px !important;
        margin-bottom: 2px !important;
        gap: 6px !important;
    }

    body.page-ui-home .home-showcase-icon {
        width: 26px !important;
        height: 26px !important;
        flex: 0 0 26px !important;
        border-radius: 8px !important;
        font-size: 12px !important;
    }

    body.page-ui-home .home-showcase-heading .market-home-title {
        font-size: 14.5px !important;
        letter-spacing: -.025em !important;
    }

    body.page-ui-home .home-showcase-link {
        position: relative !important;
        width: 32px !important;
        min-width: 32px !important;
        height: 32px !important;
        min-height: 32px !important;
        border-radius: 10px !important;
        box-shadow: none !important;
    }

    body.page-ui-home #homeDigitalGrid .home-digital-card,
    body.page-ui-home #kham-pha-ban-dia .home-explore-card,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card {
        flex-basis: calc(100% - 30px) !important;
        width: calc(100% - 30px) !important;
        max-width: calc(100% - 30px) !important;
        min-height: 78px !important;
        height: 78px !important;
        border-radius: 11px !important;
        box-shadow: none !important;
    }

    body.page-ui-home #homeDigitalGrid .home-digital-card {
        grid-template-columns: 78px minmax(0, 1fr) !important;
    }

    body.page-ui-home #homeDigitalGrid .home-digital-media,
    body.page-ui-home #kham-pha-ban-dia .home-explore-media,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card > img {
        width: 78px !important;
        min-width: 78px !important;
        height: 78px !important;
        min-height: 78px !important;
        border-radius: 10px 0 0 10px !important;
    }

    body.page-ui-home #homeDigitalGrid .home-digital-body,
    body.page-ui-home #kham-pha-ban-dia .home-explore-body,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card__body {
        height: 78px !important;
        min-height: 78px !important;
        padding: 5px 7px !important;
    }

    body.page-ui-home #kham-pha-ban-dia .home-explore-card h3,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card h3,
    body.page-ui-home #homeDigitalGrid .home-digital-card h3 {
        font-size: 12.5px !important;
        line-height: 1.25 !important;
        -webkit-line-clamp: 2 !important;
    }

    body.page-ui-home #kham-pha-ban-dia .home-explore-meta,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card__body > span,
    body.page-ui-home #homeDigitalGrid .home-digital-meta {
        font-size: 9px !important;
    }

    body.page-ui-home #cho-lao-cai .market-highlight {
        margin-top: 2px !important;
    }

    body.page-ui-home #homeMarketGrid > .market-empty {
        min-height: 54px !important;
        grid-template-columns: 28px minmax(0, 1fr) 36px !important;
        gap: 6px !important;
        padding: 5px 6px !important;
        border-radius: 11px !important;
        box-shadow: none !important;
    }

    body.page-ui-home .market-empty__icon {
        width: 28px !important;
        height: 28px !important;
        font-size: 13px !important;
    }

    body.page-ui-home .market-empty__copy b {
        font-size: 11.5px !important;
    }

    body.page-ui-home .market-empty__copy small {
        display: none !important;
    }

    body.page-ui-home .market-empty__cta {
        width: 36px !important;
        min-width: 36px !important;
        height: 36px !important;
        min-height: 36px !important;
        padding: 0 !important;
        border-radius: 11px !important;
        font-size: 0 !important;
    }

    body.page-ui-home .market-empty__cta i {
        margin: 0 !important;
        font-size: 15px !important;
    }

    body.page-ui-home .home-digital-guide-strip {
        min-height: 34px !important;
        margin-top: 3px !important;
        padding: 4px 6px !important;
        border-radius: 10px !important;
        font-size: 9.5px !important;
    }
}

@media (max-width: 359px) {
    body.page-ui-home .main-wrap { padding-right: 8px !important; padding-left: 8px !important; }
    body.page-ui-home .home-weather-stat span { font-size: 7.8px !important; }
}

/* Mobile app readability v9: preserve the compact first screen without
   shrinking essential labels below a comfortable app reading floor. */
@media (max-width: 767px) {
    body.page-ui-home .home-weather-stat span,
    body.page-ui-home .home-weather-stat .hw-stat-unit { font-size: 10.5px !important; }
    body.page-ui-home .home-weather-location-note,
    body.page-ui-home .home-weather-location-status { font-size: 11px !important; }
    body.page-ui-home .home-util-label { font-size: 10.5px !important; }
    body.page-ui-home .home-util-value { font-size: 11.5px !important; }
    body.page-ui-home .home-util-strip {
        /* The two separator spans and the chevron are hidden on phones, so
           only three live cells participate in layout. Give the two price
           ranges equal room and keep the shorter outage status compact. */
        grid-template-columns: minmax(0, 1.15fr) minmax(0, 1.15fr) minmax(0, .7fr) !important;
    }
    body.page-ui-home .home-util-go { display: none !important; }
    body.page-ui-home .home-digital-topic,
    body.page-ui-home .home-digital-meta,
    body.page-ui-home .home-explore-meta,
    body.page-ui-home .home-agri-card small,
    body.page-ui-home .home-agri-card__body > span,
    body.page-ui-home #cho-lao-cai .market-post-meta { font-size: 10.5px !important; }
    body.page-ui-home #homeMarketGrid > .market-empty {
        grid-template-columns: 28px minmax(0, 1fr) 44px !important;
    }
    body.page-ui-home .market-empty__cta {
        width: 44px !important;
        min-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
    }
}

/* Mobile home native hierarchy v10: one strong weather surface, borderless
   shortcuts and flat content groups. This is intentionally the final phone
   layer so / and /web share the same app shell below 768px while desktop is
   unchanged. */
@media (max-width: 767px) {
    body.page-ui-home .main-wrap {
        padding: 4px 12px calc(64px + env(safe-area-inset-bottom, 0px)) !important;
    }

    body.page-ui-home .home-weather-strip {
        margin-bottom: 6px !important;
        padding: 6px 7px !important;
        border-radius: 16px !important;
        box-shadow: 0 5px 18px rgba(15, 45, 75, .055) !important;
    }

    body.page-ui-home .home-weather-actions {
        min-height: 44px !important;
    }

    body.page-ui-home .home-weather-locate,
    body.page-ui-home .home-weather-link {
        min-height: 44px !important;
    }

    body.page-ui-home .home-util-strip {
        min-height: 52px !important;
        height: auto !important;
        margin-bottom: 4px !important;
        border-radius: 12px !important;
    }

    /* A feed group should read as a native list, not as a card nested inside
       another card. The item keeps its own subtle boundary and tap feedback. */
    body.page-ui-home #tin.trend-card,
    body.page-ui-home .home-digital-section,
    body.page-ui-home #kham-pha-ban-dia,
    body.page-ui-home #cho-lao-cai,
    body.page-ui-home .home-agri-section {
        margin: 0 0 7px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    body.page-ui-home #tin .trend-head,
    body.page-ui-home .home-showcase-head {
        min-height: 34px !important;
        height: 34px !important;
        margin: 0 !important;
        padding: 0 3px 3px !important;
    }

    body.page-ui-home .home-showcase-icon {
        width: 27px !important;
        height: 27px !important;
        flex: 0 0 27px !important;
        border-radius: 9px !important;
        font-size: 13px !important;
    }

    body.page-ui-home .home-showcase-heading .market-home-title,
    body.page-ui-home #tin .trend-head-title {
        font-size: 15px !important;
        line-height: 1.15 !important;
    }

    body.page-ui-home .home-showcase-link {
        width: 32px !important;
        min-width: 32px !important;
        height: 32px !important;
        min-height: 32px !important;
        border: 1px solid rgba(30, 82, 136, .10) !important;
        background: rgba(255, 255, 255, .78) !important;
    }

    body.page-ui-home #tin .trend-head .trend-top-link {
        min-height: 44px !important;
        margin: -5px -2px -5px 0 !important;
        padding: 0 4px 0 10px !important;
        font-size: 10.5px !important;
    }

    body.page-ui-home #newsList .trend-item,
    body.page-ui-home #newsList .trend-primary-mobile {
        grid-template-columns: 52px minmax(0, 1fr) !important;
        gap: 9px !important;
        min-height: 62px !important;
        height: 62px !important;
        padding: 5px 7px !important;
        border: 1px solid rgba(30, 82, 136, .09) !important;
        border-radius: 13px !important;
        background: #fff !important;
        box-shadow: 0 2px 10px rgba(15, 45, 75, .035) !important;
    }

    body.page-ui-home #newsList .trend-item .thumb,
    body.page-ui-home #newsList .trend-item .news-thumb-img,
    body.page-ui-home #newsList .trend-primary-mobile .thumb,
    body.page-ui-home #newsList .trend-primary-mobile .news-thumb-img {
        width: 52px !important;
        min-width: 52px !important;
        height: 52px !important;
        min-height: 52px !important;
        border-radius: 10px !important;
    }

    body.page-ui-home #newsList .trend-item b,
    body.page-ui-home #newsList .trend-primary-mobile b {
        font-size: 13.5px !important;
        line-height: 1.25 !important;
    }

    body.page-ui-home #homeDigitalGrid .home-digital-card,
    body.page-ui-home #kham-pha-ban-dia .home-explore-card,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card {
        flex-basis: calc(100% - 32px) !important;
        width: calc(100% - 32px) !important;
        max-width: calc(100% - 32px) !important;
        min-height: 86px !important;
        height: 86px !important;
        border: 1px solid rgba(30, 82, 136, .09) !important;
        border-radius: 13px !important;
        background: #fff !important;
        box-shadow: 0 2px 10px rgba(15, 45, 75, .035) !important;
    }

    body.page-ui-home #homeDigitalGrid .home-digital-card {
        grid-template-columns: 86px minmax(0, 1fr) !important;
    }

    body.page-ui-home #homeDigitalGrid .home-digital-media,
    body.page-ui-home #kham-pha-ban-dia .home-explore-media,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card > img {
        width: 86px !important;
        min-width: 86px !important;
        height: 86px !important;
        min-height: 86px !important;
        border-radius: 12px 0 0 12px !important;
    }

    body.page-ui-home #homeDigitalGrid .home-digital-body,
    body.page-ui-home #kham-pha-ban-dia .home-explore-body,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card__body {
        height: 86px !important;
        min-height: 86px !important;
        padding: 7px 9px !important;
    }

    body.page-ui-home #kham-pha-ban-dia .home-explore-card h3,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card h3,
    body.page-ui-home #homeDigitalGrid .home-digital-card h3 {
        font-size: 14px !important;
        line-height: 1.28 !important;
        letter-spacing: -.012em !important;
    }

    body.page-ui-home #kham-pha-ban-dia .home-explore-meta,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card__body > span,
    body.page-ui-home #homeDigitalGrid .home-digital-meta,
    body.page-ui-home .home-digital-topic {
        font-size: 11px !important;
        line-height: 1.2 !important;
    }

    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card small {
        display: block !important;
        min-width: 0 !important;
        overflow: hidden !important;
        font-size: 11px !important;
        line-height: 1.2 !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    body.page-ui-home #homeMarketGrid > .market-empty {
        min-height: 56px !important;
        margin: 0 !important;
        padding: 6px 7px !important;
        border: 1px solid rgba(221, 121, 0, .12) !important;
        border-radius: 13px !important;
        background: rgba(255, 251, 244, .9) !important;
        box-shadow: 0 2px 10px rgba(120, 75, 15, .03) !important;
    }

    body.page-ui-home #homeMarketGrid {
        display: flex !important;
        grid-template-columns: none !important;
        grid-auto-flow: initial !important;
        gap: 7px !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        overscroll-behavior-inline: contain;
        scroll-snap-type: inline mandatory;
        scrollbar-width: none;
        touch-action: pan-x pan-y;
        -webkit-overflow-scrolling: touch;
    }

    body.page-ui-home #homeMarketGrid::-webkit-scrollbar {
        display: none;
    }

    body.page-ui-home #cho-lao-cai .market-post-card {
        display: grid !important;
        flex: 0 0 calc(100% - 32px) !important;
        width: calc(100% - 32px) !important;
        max-width: calc(100% - 32px) !important;
        min-height: 96px !important;
        height: 96px !important;
        grid-template-columns: 96px minmax(0, 1fr) !important;
        gap: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        border: 1px solid rgba(221, 121, 0, .12) !important;
        border-radius: 13px !important;
        background: #fff !important;
        box-shadow: 0 2px 10px rgba(120, 75, 15, .03) !important;
        scroll-snap-align: start;
    }

    body.page-ui-home #cho-lao-cai .market-post-image,
    body.page-ui-home #cho-lao-cai .market-post-body {
        width: 96px !important;
        min-width: 96px !important;
        height: 96px !important;
        min-height: 96px !important;
    }

    body.page-ui-home #cho-lao-cai .market-post-body {
        width: auto !important;
        min-width: 0 !important;
        padding: 7px 8px !important;
    }

    body.page-ui-home #cho-lao-cai .market-post-card h3 {
        display: -webkit-box !important;
        min-height: 0 !important;
        margin: 0 !important;
        overflow: hidden !important;
        font-size: 13.5px !important;
        line-height: 1.25 !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
    }

    body.page-ui-home #cho-lao-cai .market-post-card .price {
        margin-top: 3px !important;
        font-size: 13px !important;
    }

    body.page-ui-home #cho-lao-cai .market-post-trust,
    body.page-ui-home #cho-lao-cai .market-post-meta > span:nth-child(2) {
        display: none !important;
    }

    body.page-ui-home #cho-lao-cai .market-post-meta,
    body.page-ui-home #cho-lao-cai .market-post-meta > span:first-child {
        display: block !important;
        min-width: 0 !important;
        margin-top: 3px !important;
        overflow: hidden !important;
        font-size: 11px !important;
        line-height: 1.2 !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    body.page-ui-home #cho-lao-cai .market-post-cate {
        right: 6px !important;
        bottom: 6px !important;
        left: 6px !important;
        max-width: calc(100% - 12px) !important;
        overflow: hidden !important;
        font-size: 9.5px !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    body.page-ui-home #cho-lao-cai .lc-save-floating b {
        display: none !important;
    }

    body.page-ui-home .home-digital-guide-strip {
        min-height: 40px !important;
        margin-top: 5px !important;
        padding: 5px 8px !important;
        font-size: 11px !important;
    }
}

@media (max-width: 359px) {
    body.page-ui-home .main-wrap {
        padding-right: 9px !important;
        padding-left: 9px !important;
    }

    body.page-ui-home #homeDigitalGrid .home-digital-card,
    body.page-ui-home #kham-pha-ban-dia .home-explore-card,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card {
        flex-basis: calc(100% - 24px) !important;
        width: calc(100% - 24px) !important;
        max-width: calc(100% - 24px) !important;
    }
}

/* Mobile home narrow hierarchy v11: use the width of two resident shortcuts
   instead of stacking tiny labels, and give live utility values more room on
   360-390px phones. Data, routes and the desktop surface stay unchanged. */
@media (max-width: 390px) {
    body.page-ui-home .home-weather-title h2 {
        font-size: 14.5px !important;
    }

    body.page-ui-home .home-util-item,
    body.page-ui-home .home-util-out {
        gap: 3px !important;
        padding-right: 4px !important;
        padding-left: 4px !important;
    }

    body.page-ui-home .home-util-item i,
    body.page-ui-home .home-util-out i {
        font-size: 14px !important;
    }

}

/* Mobile home touch v14: legacy compact rule retained for cascade history. */
@media (max-width: 767px) {
    body.page-ui-home .home-showcase-head {
        min-height: 34px !important;
        height: 34px !important;
    }

    body.page-ui-home .home-showcase-link {
        width: 32px !important;
        min-width: 32px !important;
        height: 32px !important;
        min-height: 32px !important;
        flex: 0 0 32px !important;
        justify-content: center !important;
    }

}

/* Mobile home native target v15: the anchor itself is 44x44. The previous
   negative hit slop was clipped by compact section cards in real webviews,
   leaving a smaller hit-test area even though the arrow looked correct. */
@media (max-width: 767px) {
    body.page-ui-home .home-showcase-head {
        min-height: 44px !important;
        height: auto !important;
    }

    body.page-ui-home .home-showcase-link {
        position: relative !important;
        isolation: isolate;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 44px !important;
        min-width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        flex: 0 0 44px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 14px !important;
        background: transparent !important;
        box-shadow: none !important;
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
        transition: transform .12s ease !important;
    }

    body.page-ui-home .home-showcase-link::before {
        position: absolute !important;
        z-index: -1;
        inset: 6px !important;
        content: "" !important;
        border: 1px solid rgba(30, 82, 136, .10) !important;
        border-radius: 10px !important;
        background: rgba(255, 255, 255, .82) !important;
        pointer-events: none;
    }

    body.page-ui-home .home-showcase-link i {
        position: relative;
        z-index: 1;
        font-size: 14px !important;
    }

    body.page-ui-home .home-showcase-link:focus-visible {
        outline: 3px solid rgba(8, 120, 207, .28) !important;
        outline-offset: 0 !important;
    }
}

@media (max-width: 767px) and (prefers-reduced-motion: no-preference) {
    body.page-ui-home .home-showcase-link:active {
        transform: scale(.96) !important;
    }
}

/* Mobile home tactile shell v12: preserve native-size targets while making
   tap acknowledgement immediate. This is additive to the shared responsive
   view; it does not introduce a second mobile template or alter desktop. */
@media (max-width: 767px) {
    body.page-ui-home .home-weather-stat,
    body.page-ui-home .home-util-strip {
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
    }
}

@media (max-width: 767px) and (prefers-reduced-motion: no-preference) {
    body.page-ui-home .home-weather-stat:active,
    body.page-ui-home .home-util-strip:active {
        transform: scale(.985) !important;
    }
}

@media (max-width: 359px) {
    /* Four live status targets still retain their visible number and full
       aria-label; hiding the repeated unit prevents 320px overflow. */
    body.page-ui-home .home-weather-stat .hw-stat-unit {
        display: none !important;
    }

    /* On 320px phones the two range values are more useful than the repeated
       decorative icons. Reclaim that width so neither price is ellipsized. */
    body.page-ui-home .home-util-item > i,
    body.page-ui-home .home-util-out > i {
        display: none !important;
    }

    body.page-ui-home .home-util-copy {
        width: 100% !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.page-ui-home .home-weather-stat:active,
    body.page-ui-home .home-util-strip:active {
        transform: none !important;
    }
}

@media (max-width: 359px) {
    /* Keep all four risk names readable on 320px webviews. Wrapping the two
       word labels is clearer than ellipsizing them or shrinking the type. */
    body.page-ui-home .home-weather-stat span {
        min-height: 21px !important;
        align-items: center !important;
        justify-content: center !important;
        overflow: visible !important;
        line-height: 1.05 !important;
        text-align: center !important;
        text-overflow: clip !important;
        white-space: normal !important;
    }
}

/* The shared mobile shell reserves the fixed app dock on the outer .main.
   Home is loaded after mobile-app.css, so reset its legacy second dock gap. */
@media (max-width: 991px) {
    html body.page-ui-home .main-wrap {
        padding-bottom: 8px !important;
    }
}

/* Home surface v19: one calm visual language for the complete resident feed.
   Desktop gets useful section context; phone/PWA keeps the same content in a
   denser app rhythm with no duplicate template or paint-heavy effects. */
.home-showcase-summary {
    margin: 4px 0 0;
    color: #64748b;
    font-size: 12px;
    font-weight: 650;
    line-height: 1.35;
}

/* Home launchpad v20: retained as a compatibility marker for tests and cache
   diagnostics. Phone launcher geometry now lives only in consolidated v34. */

@media (min-width: 768px) {
    body.page-ui-home .home-showcase-head {
        align-items: center;
        padding-bottom: 12px;
        border-bottom: 1px solid rgba(30, 82, 136, .08);
    }

    body.page-ui-home .home-showcase-heading {
        align-items: center;
    }

    body.page-ui-home .home-digital-section,
    body.page-ui-home #kham-pha-ban-dia,
    body.page-ui-home #cho-lao-cai,
    body.page-ui-home .home-agri-section {
        border: 1px solid rgba(30, 82, 136, .09);
        box-shadow: 0 12px 32px rgba(15, 45, 75, .055);
    }
}

@media (max-width: 767px) {
    body.page-ui-home {
        background: linear-gradient(180deg, #edf6ff 0, #f6f9fc 300px, #f2f5f8 100%);
    }

    body.page-ui-home .home-showcase-summary {
        display: none;
    }

    body.page-ui-home #tin.trend-card,
    body.page-ui-home .home-digital-section,
    body.page-ui-home #kham-pha-ban-dia,
    body.page-ui-home #cho-lao-cai,
    body.page-ui-home .home-agri-section {
        position: relative;
        padding: 0 0 2px !important;
    }

    body.page-ui-home .home-showcase-heading {
        min-width: 0;
    }

    body.page-ui-home .home-showcase-heading > div {
        min-width: 0;
    }

    body.page-ui-home .home-showcase-heading .market-home-title {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    body.page-ui-home #newsList .trend-item,
    body.page-ui-home #newsList .trend-primary-mobile,
    body.page-ui-home #homeDigitalGrid .home-digital-card,
    body.page-ui-home #kham-pha-ban-dia .home-explore-card,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card,
    body.page-ui-home #homeMarketGrid > .market-empty,
    body.page-ui-home #cho-lao-cai .market-post-card {
        border-color: rgba(30, 82, 136, .085) !important;
        box-shadow: 0 3px 12px rgba(15, 45, 75, .045) !important;
    }

    body.page-ui-home :where(
        #homeDigitalGrid,
        #kham-pha-ban-dia .home-explore-grid,
        #cam-nang-nong-nghiep .home-agri-grid,
        #homeMarketGrid
    ) {
        scroll-padding-inline: 1px;
        overscroll-behavior-inline: contain;
    }
}

/* Mobile home clarity v20: keep the compact dashboard rhythm while restoring
   an app-readable type floor and familiar forward chevrons. No section grows
   taller, so the first screen keeps weather, daily tools and a current story. */
@media (max-width: 767px) {
    body.page-ui-home .home-weather-title h2 {
        font-size: 15.5px !important;
    }

    body.page-ui-home .home-weather-overview {
        font-size: 10.5px !important;
    }

    body.page-ui-home .home-weather-stat b {
        font-size: 14.5px !important;
    }

    body.page-ui-home .home-showcase-heading .market-home-title,
    body.page-ui-home #tin .trend-head-title {
        font-size: 15.5px !important;
    }

    body.page-ui-home #newsList .trend-item b,
    body.page-ui-home #newsList .trend-primary-mobile b {
        font-size: 14px !important;
    }

    body.page-ui-home .home-showcase-link i {
        font-size: 16px !important;
    }
}

/* Mobile home compact feed v21: five current headlines, then uniform
   small-image rails. This is the authoritative phone/app layer. It replaces
   older preview caps without changing the News, Explore, Market or Agri data. */
@media (max-width: 991.98px) {
    body.page-ui-home #newsList.trend-list {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 0 !important;
        margin: 0 10px 8px !important;
        overflow: hidden !important;
        border: 1px solid rgba(30, 82, 136, .09) !important;
        border-radius: 15px !important;
        background: #fff !important;
        box-shadow: 0 3px 12px rgba(15, 45, 75, .04) !important;
    }

    body.page-ui-home #newsList .trend-item:nth-child(-n+5),
    body.page-ui-home #newsList .trend-primary-mobile:nth-child(-n+5) {
        display: grid !important;
    }

    body.page-ui-home #newsList .trend-item:nth-child(n+6),
    body.page-ui-home #newsList .trend-primary-mobile:nth-child(n+6) {
        display: none !important;
    }

    body.page-ui-home #newsList .trend-item,
    body.page-ui-home #newsList .trend-primary-mobile {
        grid-template-columns: 62px minmax(0, 1fr) !important;
        min-height: 62px !important;
        height: 62px !important;
        gap: 9px !important;
        align-items: center !important;
        padding: 7px 9px !important;
        border: 0 !important;
        border-bottom: 1px solid rgba(30, 82, 136, .075) !important;
        border-radius: 0 !important;
        background: #fff !important;
        box-shadow: none !important;
    }

    body.page-ui-home #newsList .trend-item:last-child,
    body.page-ui-home #newsList .trend-primary-mobile:last-child {
        border-bottom: 0 !important;
    }

    body.page-ui-home #newsList .trend-item .thumb,
    body.page-ui-home #newsList .trend-item .news-thumb-img,
    body.page-ui-home #newsList .trend-primary-mobile .thumb,
    body.page-ui-home #newsList .trend-primary-mobile .news-thumb-img {
        width: 62px !important;
        height: 48px !important;
        min-height: 48px !important;
        border-radius: 9px !important;
    }

    body.page-ui-home #newsList .trend-item b,
    body.page-ui-home #newsList .trend-primary-mobile b {
        display: -webkit-box !important;
        overflow: hidden !important;
        margin: 0 !important;
        font-size: 13px !important;
        font-weight: 800 !important;
        line-height: 1.28 !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
    }

    body.page-ui-home #newsList :where(.trend-type, small, .trend-desc) {
        display: none !important;
    }

    body.page-ui-home :where(
        #homeDigitalGrid,
        #kham-pha-ban-dia .home-explore-grid,
        #cam-nang-nong-nghiep .home-agri-grid,
        #homeMarketGrid
    ) {
        display: grid !important;
        grid-template-columns: none !important;
        grid-auto-flow: column !important;
        grid-auto-columns: min(82vw, 304px) !important;
        gap: 8px !important;
        margin: 0 !important;
        padding: 0 10px 9px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scroll-snap-type: inline mandatory !important;
        scrollbar-width: none !important;
    }

    body.page-ui-home :where(
        #homeDigitalGrid,
        #kham-pha-ban-dia .home-explore-grid,
        #cam-nang-nong-nghiep .home-agri-grid,
        #homeMarketGrid
    )::-webkit-scrollbar { display: none !important; }

    body.page-ui-home :where(
        #homeDigitalGrid .home-digital-card,
        #kham-pha-ban-dia .home-explore-card,
        #cam-nang-nong-nghiep .home-agri-card,
        #cho-lao-cai .market-post-card
    ) {
        width: auto !important;
        min-width: 0 !important;
        height: 82px !important;
        min-height: 82px !important;
        grid-template-columns: 78px minmax(0, 1fr) !important;
        scroll-snap-align: start !important;
        overflow: hidden !important;
        border-radius: 14px !important;
        background: #fff !important;
    }

    body.page-ui-home #homeDigitalGrid .home-digital-media,
    body.page-ui-home #kham-pha-ban-dia .home-explore-media,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card > img,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card__photo-pending,
    body.page-ui-home #cho-lao-cai .market-post-image {
        width: 78px !important;
        height: 82px !important;
        min-height: 82px !important;
        aspect-ratio: auto !important;
        border-radius: 0 !important;
    }

    body.page-ui-home #homeDigitalGrid .home-digital-body,
    body.page-ui-home #kham-pha-ban-dia .home-explore-body,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card__body,
    body.page-ui-home #cho-lao-cai .market-post-body {
        min-width: 0 !important;
        min-height: 0 !important;
        padding: 8px 9px !important;
    }

    body.page-ui-home #homeDigitalGrid .home-digital-card h3,
    body.page-ui-home #kham-pha-ban-dia .home-explore-card h3,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card h3,
    body.page-ui-home #cho-lao-cai .market-post-card h3 {
        display: -webkit-box !important;
        overflow: hidden !important;
        margin: 0 !important;
        font-size: 12.5px !important;
        font-weight: 800 !important;
        line-height: 1.25 !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
    }

    body.page-ui-home #kham-pha-ban-dia .home-explore-meta span:nth-child(n+2),
    body.page-ui-home #kham-pha-ban-dia .home-explore-body > p,
    body.page-ui-home #cam-nang-nong-nghiep .home-agri-card__body > span:last-child,
    body.page-ui-home #cho-lao-cai :where(.lc-save-floating, .market-post-cate, .market-post-trust),
    body.page-ui-home #cho-lao-cai .market-post-meta > span:nth-child(n+2) {
        display: none !important;
    }

    body.page-ui-home #homeDigitalGrid .home-digital-skeleton {
        animation: none !important;
        background: #edf3f8 !important;
    }
}

/* App home compact controls v23: five icon-first destinations and a single
   weather action row. Kept paint-cheap for low-end Android devices. */
@media (max-width: 991.98px) {
    body.page-ui-home .home-weather-overview { display: none !important; }
    body.page-ui-home .home-weather-actions {
        display: grid !important;
        grid-template-columns: minmax(0, auto) minmax(0, 1fr) !important;
        align-items: center !important;
        gap: 7px !important;
        width: 100% !important;
        min-height: 40px !important;
        margin: 0 !important;
    }
    body.page-ui-home .home-weather-source {
        display: inline-flex !important;
        min-width: 0 !important;
        font-size: 10px !important;
    }
    body.page-ui-home .home-weather-cta {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
        gap: 6px !important;
        min-width: 0 !important;
    }
    body.page-ui-home .home-weather-locate,
    body.page-ui-home .home-weather-link {
        min-width: 0 !important;
        min-height: 40px !important;
        padding: 5px 7px !important;
        white-space: nowrap !important;
    }
    body.page-ui-home .home-weather-location-note {
        display: block !important;
        margin: -1px 0 0 !important;
        overflow: hidden !important;
        font-size: 9.5px !important;
        line-height: 1.2 !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }
}

/* Mobile weather action clarity v24: the live refresh timestamp owns one
   short row; GPS and the 99-area directory share the next row. Keeping three
   independent controls in one shrinking grid caused real 360-390px phones to
   paint labels on top of each other while weather was refreshing. */
@media (max-width: 767px) {
    body.page-ui-home .home-weather-actions {
        display: flex !important;
        min-height: 0 !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 3px !important;
    }
    body.page-ui-home .home-weather-source {
        display: flex !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 13px !important;
        font-size: 9.5px !important;
        line-height: 1.2 !important;
    }
    body.page-ui-home .home-weather-source > span {
        display: block !important;
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }
    body.page-ui-home .home-weather-cta {
        display: grid !important;
        width: 100% !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 6px !important;
    }
    body.page-ui-home .home-weather-locate,
    body.page-ui-home .home-weather-link {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 44px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }
    body.page-ui-home .home-weather-source,
    body.page-ui-home .home-weather-location-note {
        font-size: 10.5px !important;
        line-height: 1.25 !important;
    }
}

@media (max-width: 374px) {
    body.page-ui-home .home-weather-actions { grid-template-columns: 1fr !important; gap: 4px !important; }
    body.page-ui-home .home-weather-source { justify-content: center !important; }
}

@media (max-width: 359px) {
    body.page-ui-home :where(
        #homeDigitalGrid,
        #kham-pha-ban-dia .home-explore-grid,
        #cam-nang-nong-nghiep .home-agri-grid,
        #homeMarketGrid
    ) { grid-auto-columns: 86vw !important; }
}

/* Mobile/app homepage launcher-only v22: Explore, Market and Agriculture are
   already first-screen destinations. Do not repeat their article/product
   previews farther down the app homepage; desktop keeps the full showcases. */
@media (max-width: 991.98px) {
    body.page-ui-home .home-mobile-priority-nav {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    body.page-ui-home .home-discovery-section,
    body.page-ui-home .home-market-section,
    body.page-ui-home .home-agri-section {
        display: none !important;
    }
}
/* Lào Cai Số service pictograms: one lightweight SVG language for app and web.
   The translucent accent is a vector fill, not a bitmap or live blur, so the
   launchpad stays sharp and cheap to paint in Android/iOS web wrappers. */
.home-primary-action__icon svg {
    display: block;
    width: 23px;
    height: 23px;
    overflow: visible;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
    shape-rendering: geometricPrecision;
}
.home-primary-action__icon svg :where(path, circle, rect) { vector-effect: non-scaling-stroke; }
.home-primary-action__icon .lc-service-icon__accent {
    fill: currentColor;
    stroke: none;
    opacity: .11;
}
@media (max-width: 767px) {
    body.page-ui-home .home-primary-action__icon {
        box-sizing: border-box !important;
        border: 1px solid rgba(30, 82, 136, .07) !important;
    }
}
@media (prefers-reduced-motion: reduce) {
    .home-primary-action__icon svg { shape-rendering: geometricPrecision; }
}

/* Mobile/app six-service launcher v29: compatibility marker. Phone geometry
   was consolidated into v34; only the tablet six-column adaptation remains. */

@media (min-width: 768px) and (max-width: 991.98px) {
    body.page-ui-home .home-mobile-priority-nav {
        grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
        grid-auto-rows: 68px !important;
        min-height: 80px !important;
    }

    body.page-ui-home .home-primary-action {
        min-height: 68px !important;
        height: 68px !important;
    }
}

/* Mobile Home launcher v35 / Mobile Home category polish v36: six resident
   services in one calm, app-like 3-by-2 surface. Each item is a generous touch
   target with a distinct local duotone pictogram and a single short label. */
@media (max-width: 767.98px) {
    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] {
        display: grid !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: 187px !important;
        height: auto !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        grid-template-rows: repeat(2, 84px) !important;
        grid-auto-rows: 84px !important;
        gap: 6px !important;
        margin-bottom: 10px !important;
        padding: 7px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
        contain: layout paint !important;
        border: 1px solid rgba(30, 82, 136, .08) !important;
        border-radius: 22px !important;
        background: linear-gradient(180deg, #ffffff 0%, #f7faff 100%) !important;
        box-shadow: 0 8px 22px rgba(15, 45, 75, .045) !important;
    }

    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] > .home-primary-action {
        position: relative !important;
        isolation: isolate !important;
        display: flex !important;
        grid-column: span 1 !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: 84px !important;
        height: 84px !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 5px !important;
        padding: 6px 4px 5px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
        border: 1px solid rgba(30, 82, 136, .055) !important;
        border-radius: 16px !important;
        --lc-tile-surface: linear-gradient(150deg, #f3f8fe 0%, #ffffff 72%);
        background: #f8fafc !important;
        background: var(--lc-tile-surface) !important;
        color: #233a50 !important;
        font-size: clamp(11.5px, 3.2vw, 12.5px) !important;
        font-weight: 800 !important;
        line-height: 1.15 !important;
        text-align: center !important;
        text-decoration: none !important;
        touch-action: manipulation !important;
        -webkit-tap-highlight-color: transparent !important;
        box-shadow: 0 2px 7px rgba(28, 63, 94, .035) !important;
        transition: transform .12s ease-out, background-color .12s ease-out, box-shadow .12s ease-out !important;
    }

    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] > :nth-child(2) {
        --lc-tile-surface: linear-gradient(150deg, #eefaf4 0%, #ffffff 72%);
    }
    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] > :nth-child(3) {
        --lc-tile-surface: linear-gradient(150deg, #fff6e9 0%, #ffffff 72%);
    }
    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] > :nth-child(4) {
        --lc-tile-surface: linear-gradient(150deg, #f1f9e9 0%, #ffffff 72%);
    }
    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] > :nth-child(5) {
        --lc-tile-surface: linear-gradient(150deg, #ebf9f7 0%, #ffffff 72%);
    }
    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] > :nth-child(6) {
        --lc-tile-surface: linear-gradient(150deg, #f3f1fb 0%, #ffffff 72%);
    }

    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] .home-primary-action__icon {
        position: relative !important;
        display: grid !important;
        width: 46px !important;
        height: 46px !important;
        flex: 0 0 46px !important;
        place-items: center !important;
        box-sizing: border-box !important;
        border: 1px solid rgba(255, 255, 255, .88) !important;
        border-radius: 15px !important;
        box-shadow: 0 4px 10px rgba(28, 63, 94, .08), inset 0 1px 0 rgba(255, 255, 255, .88) !important;
    }

    html body.page-ui-home .home-primary-action--news .home-primary-action__icon {
        background: linear-gradient(145deg, #e2efff 0%, #f1f7ff 100%) !important;
        color: #205fa8 !important;
    }
    html body.page-ui-home .home-primary-action--explore .home-primary-action__icon {
        background: linear-gradient(145deg, #d9f4e7 0%, #eefaf5 100%) !important;
        color: #08795f !important;
    }
    html body.page-ui-home .home-primary-action--market .home-primary-action__icon {
        background: linear-gradient(145deg, #ffe6c6 0%, #fff5e8 100%) !important;
        color: #b95612 !important;
    }
    html body.page-ui-home .home-primary-action--agri .home-primary-action__icon {
        background: linear-gradient(145deg, #e1f1d3 0%, #f3faed 100%) !important;
        color: #34733a !important;
    }
    html body.page-ui-home .home-primary-action--map .home-primary-action__icon {
        background: linear-gradient(145deg, #d5f2ee 0%, #edf9f7 100%) !important;
        color: #08766e !important;
    }
    html body.page-ui-home .home-primary-action--map .home-primary-action__badge { position: absolute; top: -5px; right: -7px; display: grid; min-width: 22px; height: 18px; place-items: center; padding: 0 5px; border: 2px solid #fff; border-radius: 99px; background: #08766e; color: #fff; font-size: 9px; font-weight: 900; line-height: 1; }
    html body.page-ui-home .home-primary-action--utilities .home-primary-action__icon {
        background: linear-gradient(145deg, #e7e2f9 0%, #f5f3fc 100%) !important;
        color: #5a49a8 !important;
    }

    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] .home-primary-action__icon svg {
        width: 29px !important;
        height: 29px !important;
        stroke-width: 1.65 !important;
    }

    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] > .home-primary-action > span:last-child {
        display: -webkit-box !important;
        width: 100% !important;
        min-height: 15px !important;
        max-height: 29px !important;
        overflow: hidden !important;
        line-height: 1.15 !important;
        text-align: center !important;
        white-space: normal !important;
        text-overflow: ellipsis !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        word-break: normal !important;
        color: #20384f !important;
        letter-spacing: -.012em !important;
    }

    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] > .home-primary-action:active {
        border-color: rgba(30, 82, 136, .10) !important;
        background: #eef4f8 !important;
        box-shadow: inset 0 0 0 1px rgba(30, 82, 136, .08) !important;
        transform: scale(.97) !important;
    }

    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] > .home-primary-action:focus-visible {
        outline: 3px solid rgba(8, 120, 207, .34) !important;
        outline-offset: -3px !important;
    }

    html body.page-ui-home .right-column.home-about-column {
        display: none !important;
    }

    html body.page-ui-home .home-digital-topic-links > a {
        width: 44px !important;
        min-width: 44px !important;
        min-height: 44px !important;
    }

    html body.page-ui-home #homeDigitalGrid {
        scroll-snap-type: inline proximity !important;
    }

    html body.page-ui-home #diem-tin {
        display: block !important;
        margin-bottom: 8px !important;
    }
    html body.page-ui-home #diem-tin > .hero-news {
        display: none !important;
    }
    html body.page-ui-home #diem-tin > .side-stack,
    html body.page-ui-home #diem-tin #tin.trend-card {
        width: 100% !important;
        max-width: 100% !important;
    }
    html body.page-ui-home #newsList.trend-list > .trend-item:nth-child(-n+5),
    html body.page-ui-home #newsList.trend-list > .trend-primary-mobile:nth-child(-n+5) {
        display: grid !important;
    }
    html body.page-ui-home #newsList.trend-list > .trend-item:nth-child(n+6),
    html body.page-ui-home #newsList.trend-list > .trend-primary-mobile:nth-child(n+6) {
        display: none !important;
    }
    html body.page-ui-home #newsList.trend-list > .trend-item,
    html body.page-ui-home #newsList.trend-list > .trend-primary-mobile {
        grid-template-columns: 54px minmax(0, 1fr) !important;
        gap: 9px !important;
        min-height: 66px !important;
        height: 66px !important;
        padding: 5px 2px !important;
    }
    html body.page-ui-home #newsList.trend-list > .trend-item .thumb,
    html body.page-ui-home #newsList.trend-list > .trend-primary-mobile .thumb {
        width: 54px !important;
        min-width: 54px !important;
        height: 54px !important;
        min-height: 54px !important;
        border-radius: 11px !important;
    }
    html body.page-ui-home #tin > .trend-more-link {
        display: none !important;
    }
    html body.page-ui-home #homeDigitalGrid > .home-digital-fallback {
        display: grid !important;
        grid-template-columns: 58px minmax(0, 1fr) !important;
        width: calc(100% - 28px) !important;
        min-width: calc(100% - 28px) !important;
        min-height: 88px !important;
        height: 88px !important;
        align-items: center !important;
        background: linear-gradient(145deg, #f6faff, #edf5fc) !important;
    }
    html body.page-ui-home #homeDigitalGrid .home-digital-fallback__icon {
        display: grid !important;
        width: 46px !important;
        height: 46px !important;
        place-items: center !important;
        margin-left: 8px !important;
        border-radius: 15px !important;
        background: #e4f0ff !important;
        color: #245fa7 !important;
        font-size: 22px !important;
    }
    html body.page-ui-home #homeDigitalGrid > .home-digital-fallback .home-digital-body {
        min-height: 88px !important;
        height: 88px !important;
        justify-content: center !important;
        padding: 9px 10px !important;
    }
}

@media (max-width: 350px) {
    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] {
        min-height: 175px !important;
        grid-template-rows: repeat(2, 78px) !important;
        grid-auto-rows: 78px !important;
        gap: 5px !important;
        padding: 6px !important;
    }
    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] > .home-primary-action {
        min-height: 78px !important;
        height: 78px !important;
        font-size: 11px !important;
    }
    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] .home-primary-action__icon {
        width: 42px !important;
        height: 42px !important;
        flex-basis: 42px !important;
    }
}

@media (min-width: 360px) and (max-width: 430px) {
    html body.page-ui-home .main-wrap,
    html body.page-ui-home .main-column,
    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] {
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
}

@media (max-width: 767.98px) and (prefers-reduced-motion: reduce) {
    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] > .home-primary-action,
    html body.page-ui-home .home-mobile-priority-nav[data-home-primary-nav] > .home-primary-action:active {
        transition: none !important;
        transform: none !important;
    }
}
