/*
 * Lao Cai So shared stylesheet
 * Static CSS consolidated from layout and UI views.
 * Keep database-driven/custom CSS in app/views/index.php inline.
 */

/* ========================================================================== */
/* Source: app/views/index.php block 1 */
:root {
            --lc-bg: #f4f8fb;
            --lc-card: #ffffff;
            --lc-text: #172033;
            --lc-muted: #667085;
            --lc-line: #e4ebf2;
            --lc-brand: #0b7a65;
            --lc-brand-2: #16a878;
            --lc-red: #ef4444;
            --lc-radius: 24px;
            --lc-shadow: 0 18px 48px rgba(15, 23, 42, .075);
            --lc-shadow-soft: 0 10px 28px rgba(15, 23, 42, .055);
        }

        * { box-sizing: border-box; }
        html { scroll-behavior: smooth; }
        html,
        body { min-height: 100%; }
        body {
            min-height: 100vh;
            margin: 0;
            padding-top: env(safe-area-inset-top, 0px);
            padding-bottom: env(safe-area-inset-bottom, 0px);
            color: var(--lc-text);
            font-family: "Be Vietnam Pro", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
            font-size: 15px;
            font-weight: 400;
            line-height: 1.55;
            text-rendering: optimizeLegibility;
            -webkit-font-smoothing: antialiased;
            background:
                    radial-gradient(circle at 8% -8%, rgba(16, 185, 129, .18), transparent 30%),
                    radial-gradient(circle at 88% 2%, rgba(37, 99, 235, .10), transparent 26%),
                    linear-gradient(180deg, #f7fbff 0%, var(--lc-bg) 52%, #f8fafc 100%);
        }
        a { color: inherit; text-decoration: none; }
        a:hover { color: inherit; }
        svg, i { flex-shrink: 0; }
        .container-xxl { max-width: 1920px; }
        .main, .main-wrap { background: transparent; }
        .main-wrap { padding-bottom: 92px; }
        body.news-modal-open,
        body.video-modal-open { overflow: hidden; }

        .lc-header {
            position: sticky;
            top: 0;
            z-index: 1030;
            margin-top: calc(env(safe-area-inset-top, 0px) * -1);
            padding-top: env(safe-area-inset-top, 0px);
            background: rgba(247, 251, 255, .88);
            backdrop-filter: blur(18px);
            border-bottom: 1px solid rgba(226, 232, 240, .78);
        }
        .lc-topbar { min-height: 78px; }
        .brand-link {
            min-width: 240px;
            display: inline-flex;
            align-items: center;
            gap: 13px;
            color: var(--lc-text);
        }
        .brand-logo-wrap {
            width: 58px;
            height: 58px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 22px;
        }
        .brand-logo-img {
            width: 48px;
            height: 48px;
            border-radius: 50%;
            object-fit: cover;
            background: #fff;
        }
        .brand-title {
            display: block;
            margin: 0;
            color: var(--lc-brand);
            font-size: 20px;
            font-weight: 700;
            line-height: 1.08;
            letter-spacing: -.25px;
        }
        .brand-slogan {
            display: block;
            margin-top: 4px;
            color: #667085;
            font-size: 12.5px;
            font-weight: 500;
            letter-spacing: .01em;
        }

        .top-search {
            height: 52px;
            max-width: 820px;
            border-radius: 999px;
            border: 1px solid rgba(203, 213, 225, .86);
            background: rgba(255, 255, 255, .92);
            box-shadow: var(--lc-shadow-soft);
            transition: .18s ease;
        }
        .top-search:focus-within {
            border-color: rgba(11, 122, 101, .35);
            box-shadow: 0 16px 36px rgba(11, 122, 101, .12);
        }
        .top-search i { color: #64748b; font-size: 19px; }
        .top-search input {
            min-width: 0;
            border: 0;
            outline: 0;
            background: transparent;
            color: var(--lc-text);
            font-weight: 400;
            box-shadow: none !important;
        }
        .top-search input::placeholder { color: #7a8494; }
        .mobile-search { display: none; }

        .btn-brand {
            border: 0;
            color: #fff;
            background: linear-gradient(135deg, var(--lc-brand), var(--lc-brand-2));
            box-shadow: 0 14px 30px rgba(11, 122, 101, .22);
        }
        .btn-brand:hover { color: #fff; filter: brightness(.98); }
        .btn, .dropdown-item { font-weight: 600; letter-spacing: -.02em; }
        .topbar-actions { flex: 0 0 auto; }
        .round-btn,
        .avatar-btn {
            border: 1px solid var(--lc-line);
            background: rgba(255, 255, 255, .94);
            box-shadow: var(--lc-shadow-soft);
        }
        .round-btn {
            width: 48px;
            height: 48px;
            position: relative;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            color: var(--lc-text);
        }
        .round-btn i { font-size: 19px; }
        .notify-dot {
            position: absolute;
            top: 11px;
            right: 12px;
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background: var(--lc-red);
            box-shadow: 0 0 0 3px #fff;
        }
        .avatar-btn {
            height: 48px;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 4px 8px 4px 4px;
            border-radius: 999px;
        }
        .avatar-photo {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            object-fit: cover;
            border: 2px solid #fff;
            box-shadow: 0 7px 18px rgba(15, 23, 42, .16);
        }
        .user-menu {
            width: 292px;
            margin-top: 12px !important;
            padding: 8px;
            border: 1px solid rgba(226, 232, 240, .94);
            border-radius: 24px;
            box-shadow: 0 24px 70px rgba(15, 23, 42, .16);
        }
        .user-head {
            display: flex;
            gap: 12px;
            align-items: center;
            padding: 13px;
            border-radius: 18px;
            background: linear-gradient(135deg, #f8fafc, #ecfdf5);
        }
        .user-head .avatar-photo { width: 48px; height: 48px; }
        .user-name { display: block; font-size: 16px; font-weight: 700; color: var(--lc-text); }
        .user-sub { display: block; margin-top: 2px; color: var(--lc-muted); font-size: 12.5px; }
        .user-menu .dropdown-item {
            display: flex;
            align-items: center;
            gap: 11px;
            margin-top: 3px;
            padding: 11px 12px;
            border-radius: 15px;
            color: #253047;
            font-size: 14px;
            font-weight: 500;
        }
        .user-menu .dropdown-item i { width: 20px; color: var(--lc-brand); font-size: 16px; }
        .user-menu .dropdown-item:hover { color: var(--lc-brand); background: #f1f8f5; }
        .eyrok-connect-wrap {
            min-height: 44px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }

        .app-card {
            border: 1px solid rgba(226, 232, 240, .92);
            border-radius: var(--lc-radius);
            background: rgba(255, 255, 255, .94);
            box-shadow: var(--lc-shadow);
        }
        .section-head {
            display: flex;
            align-items: end;
            justify-content: space-between;
            gap: 14px;
            margin-bottom: 16px;
        }
        .section-title { margin: 0; font-size: 22px; font-weight: 700; letter-spacing: -.35px; }
        .section-desc { margin: 4px 0 0; color: var(--lc-muted); font-size: 14px; }
        .section-link { color: var(--lc-brand); font-size: 14px; font-weight: 600; white-space: nowrap; }

        .super-dock {
            padding: 18px;
            border-radius: 28px;
            background: linear-gradient(135deg, rgba(255, 255, 255, .96), rgba(236, 253, 245, .74));
        }
        .service-grid {
            display: grid;
            grid-template-columns: repeat(8, minmax(0, 1fr));
            gap: 12px;
        }
        .service-item {
            min-height: 108px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 8px;
            padding: 12px 8px;
            border: 1px solid #edf2f7;
            border-radius: 22px;
            color: var(--lc-text);
            background: rgba(255, 255, 255, .86);
            box-shadow: 0 10px 24px rgba(15, 23, 42, .035);
            transition: .16s ease;
        }
        .service-item:hover {
            transform: translateY(-3px);
            border-color: #dbe6ee;
            background: #fff;
            box-shadow: 0 18px 38px rgba(15, 23, 42, .08);
        }
        .service-icon {
            width: 42px;
            height: 42px;
            flex: 0 0 auto;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 17px;
            font-size: 19px;
        }
        .service-item b { font-size: 13.5px; font-weight: 600; letter-spacing: -.1px; }
        .service-item small { margin-top: -5px; color: var(--lc-muted); font-size: 11.5px; }
        .ico-green { color:#0b7a65; background:#ecfdf5; }
        .ico-blue { color:#2563eb; background:#eff6ff; }
        .ico-orange { color:#ea580c; background:#fff7ed; }
        .ico-red { color:#e11d48; background:#fff1f2; }
        .ico-violet { color:#7c3aed; background:#f5f3ff; }
        .ico-gold { color:#b7791f; background:#fffbeb; }
        .ico-slate { color:#475569; background:#f1f5f9; }
        .ico-pink { color:#db2777; background:#fdf2f8; }

        .content-layout {
            display: grid;
            grid-template-columns: minmax(0, 1fr) 333px;
            gap: 18px;
            align-items: start;
        }
        .top-layout {
            display: grid;
            grid-template-columns: minmax(0, 1.2fr) minmax(340px, .8fr);
            gap: 18px;
        }
        .hero-news {
            position: relative;
            min-height: 432px;
            overflow: hidden;
            border-radius: 32px;
            color: #fff;
            background: #0f172a;
            box-shadow: var(--lc-shadow);
        }
        .hero-news-bg {
            position: absolute;
            inset: 0;
            background:
                    linear-gradient(180deg, rgba(15, 23, 42, .05), rgba(15, 23, 42, .82)),
                    url('https://images.unsplash.com/photo-1500534314209-a25ddb2bd429?auto=format&fit=crop&w=1600&q=86') center/cover no-repeat;
            transform: scale(1.02);
        }
        .hero-news-bg::after,
        .hero-news-overlay {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(180deg, rgba(15, 23, 42, .06), rgba(15, 23, 42, .86));
        }
        .hero-news::after {
            content: "";
            position: absolute;
            inset: auto 24px 24px 24px;
            height: 110px;
            border-radius: 999px;
            background: rgba(16, 185, 129, .22);
            filter: blur(42px);
        }
        .hero-content {
            position: absolute;
            inset: auto 0 0 0;
            z-index: 1;
            padding: 30px;
        }
        .soft-pill {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            min-height: 34px;
            padding: 0 12px;
            border-radius: 999px;
            color: inherit;
            background: rgba(255, 255, 255, .16);
            border: 1px solid rgba(255, 255, 255, .20);
            backdrop-filter: blur(16px);
            font-size: 12.5px;
            font-weight: 600;
        }
        .hero-title {
            max-width: 800px;
            margin: 15px 0 12px;
            font-size: 20px;
            font-weight: 600;
            line-height: 1.06;
            letter-spacing: -1.2px;
            overflow: hidden;
            height: 65px;
            line-height: 33px;
            color: #fff;
        }
        .hero-desc { max-width: 690px; margin: 0 0 16px; color: rgba(255,255,255,.82); font-size: 15.5px; }
        .hero-meta { display: flex; flex-wrap: wrap; gap: 8px; }
        .hero-meta span {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            min-height: 34px;
            padding: 0 11px;
            border-radius: 999px;
            color: rgba(255, 255, 255, .88);
            background: rgba(15, 23, 42, .42);
            border: 1px solid rgba(255, 255, 255, .12);
            font-size: 12.5px;
        }

        .side-stack { display: grid; gap: 14px; }
        .weather-card {
            padding: 18px;
            background: linear-gradient(135deg, #ffffff, #eefdf6);
        }
        .weather-temp { font-size: 42px; font-weight: 700; letter-spacing: -1px; line-height: 1; }
        .weather-orb,
        .weather-icon-real {
            width: 68px;
            height: 68px;
            flex: 0 0 auto;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
        }
        .weather-orb {
            background: radial-gradient(circle at 30% 28%, #fde68a, #f59e0b 58%, #ea580c 100%);
            box-shadow: 0 0 0 12px rgba(245, 158, 11, .14), 0 16px 30px rgba(245, 158, 11, .16);
        }
        .weather-live .weather-icon-real svg { max-width: 72px; max-height: 72px; }
        .weather-days,
        .weather-live-days {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 8px;
            margin-top: 14px;
        }
        .weather-days span,
        .weather-live-days span {
            display: block;
            padding: 8px 6px;
            border: 1px solid #edf2f7;
            border-radius: 16px;
            background: rgba(255,255,255,.78);
            text-align: center;
            color: #475569;
            font-size: 12px;
        }
        .weather-days span svg,
        .weather-live-days span svg { display: block; width: 26px; height: 26px; margin: 4px auto 2px; }
        .weather-days span b,
        .weather-live-days span b { display: block; color: var(--lc-text); font-size: 13px; }
        .weather-days span small,
        .weather-live-days span small { display: block; color: var(--lc-muted); font-size: 11px; }

        .trend-card { padding: 18px; }
        .trend-list { display: grid; gap: 15px; }
        .trend-item {
            display: grid;
            grid-template-columns: 68px 1fr;
            gap: 12px;
            align-items: center;
            padding: 9px;
            border-radius: 18px;
            color: var(--lc-text);
            background: #f8fafc;
            border: 1px solid #edf2f7;
            transition: .16s ease;
        }
        .trend-item:hover { background: #fff; box-shadow: 0 12px 26px rgba(15,23,42,.06); }
        .thumb,
        .news-thumb-img {
            width: 68px;
            height: 58px;
            border-radius: 15px;
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            background-color: #eef2f7;
        }
        .trend-item b {
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
            font-size: 14px;
            font-weight: 600;
            line-height: 1.35;
            overflow: hidden;
            height: 39px;
        }
        .trend-item small {
            display: -webkit-box;
            -webkit-line-clamp: 1;
            -webkit-box-orient: vertical;
            overflow: hidden;
            color: var(--lc-muted);
            font-size: 12px;
        }

        .section-card { padding: 24px; }
        .home-core-grid {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 10px;
        }
        .home-core-card {
            position: relative;
            min-height: 128px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            gap: 8px;
            padding: 14px 13px;
            border-radius: 18px;
            border: 1px solid #edf2f7;
            background: #f8fafc;
            color: var(--lc-text);
            transition: .16s ease;
        }
        .home-core-card:hover {
            transform: translateY(-2px);
            background: #fff;
            box-shadow: 0 14px 30px rgba(15, 23, 42, .08);
        }
        .home-core-card span {
            min-width: 0;
        }
        .home-core-card b { display: block; font-size: 15px; line-height: 1.28; font-weight: 700; }
        .home-core-card small {
            margin-top: 4px;
            display: block;
            color: var(--lc-muted);
            font-size: 12px;
            line-height: 1.45;
            overflow-wrap: anywhere;
        }
        .home-core-icon {
            width: 34px;
            height: 34px;
            flex: 0 0 auto;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 12px;
            font-size: 18px;
        }
        .home-core-arrow {
            color: var(--lc-muted);
            position: absolute;
            right: 12px;
            bottom: 10px;
            width: 24px;
            height: 24px;
            border-radius: 50%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border: 1px solid #e5e7eb;
            background: #fff;
            font-size: 16px;
        }
        .home-quick-grid {
            margin-top: 12px;
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 10px;
        }
        .home-quick-item {
            min-height: 110px;
            display: grid;
            grid-template-rows: auto auto;
            gap: 7px;
            align-content: center;
            padding: 12px;
            border-radius: 14px;
            border: 1px solid #edf2f7;
            background: #fff;
            color: var(--lc-text);
            transition: .16s ease;
        }
        .home-quick-item:hover {
            transform: translateY(-2px);
            box-shadow: 0 12px 28px rgba(15, 23, 42, .08);
            border-color: #dbeafe;
            background: #f8fbff;
        }
        .home-quick-icon {
            width: 34px;
            height: 34px;
            border-radius: 10px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 17px;
        }
        .home-quick-title {
            margin: 0 0 4px;
            font-size: 17px;
            font-weight: 700;
            letter-spacing: -0.2px;
        }
        .home-quick-sub {
            margin: 0;
            color: var(--lc-muted);
            font-size: 13px;
            line-height: 1.35;
        }
        .home-quick-label {
            line-height: 1.25;
            display: block;
            font-size: 14px;
            font-weight: 700;
        }
        .home-quick-desc {
            font-size: 12px;
            color: var(--lc-muted);
            line-height: 1.45;
            margin-top: auto;
        }
        .feature-grid,
        .listing-grid,
        .video-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
        .feature-card {
            min-height: 210px;
            position: relative;
            overflow: hidden;
            display: flex;
            align-items: flex-end;
            padding: 18px;
            border-radius: 24px;
            color: #fff;
            background-size: cover;
            background-position: center;
            box-shadow: inset 0 -120px 90px rgba(15,23,42,.72);
        }
        .feature-card h3 { margin: 10px 0 6px; font-size: 18px; line-height: 1.28; font-weight: 700; }
        .feature-card p { margin: 0; color: rgba(255,255,255,.78); font-size: 13px; }
        .tour { background-image: url('https://images.unsplash.com/photo-1544735716-392fe2489ffa?auto=format&fit=crop&w=900&q=82'); }
        .food { background-image: url('https://images.unsplash.com/photo-1543353071-873f17a7a088?auto=format&fit=crop&w=900&q=82'); }
        .farm { background-image: url('https://images.unsplash.com/photo-1500595046743-cd271d694d30?auto=format&fit=crop&w=900&q=82'); }

        .listing-card,
        .video-card {
            border-radius: 22px;
            border: 1px solid #edf2f7;
            background: #fff;
            box-shadow: 0 10px 22px rgba(15,23,42,.035);
            transition: .16s ease;
        }
        .listing-card {
            padding: 15px;
        }
        .listing-card:hover,
        .video-card:hover { transform: translateY(-2px); box-shadow: 0 18px 34px rgba(15,23,42,.08); }
        .listing-card h3 { margin: 9px 0 5px; font-size: 16px; font-weight: 650; line-height: 1.35; }
        .listing-card p { margin: 0 0 10px; color: var(--lc-muted); font-size: 13px; }
        .price { color: var(--lc-brand); font-weight: 700; }
        .mini-badge {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            min-height: 28px;
            padding: 0 10px;
            border-radius: 999px;
            font-size: 12px;
            font-weight: 600;
            background: #f8fafc;
            color: #475569;
        }

        .right-column { position: sticky; top: 104px; align-self: start; display: grid; gap: 14px; }
        .info-card { padding: 16px; }
        .compact-list { display: grid; gap: 10px; }
        .compact-item {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 9px;
            border-radius: 18px;
            border: 1px solid #edf2f7;
            background: #f8fafc;
            transition: .16s ease;
        }
        .compact-item:hover { background:#fff; box-shadow:0 12px 26px rgba(15,23,42,.06); }
        .compact-item b { display: block; font-size: 14px; font-weight: 600; line-height: 1.35; }
        .compact-item small { display: block; color: var(--lc-muted); font-size: 12px; }
        .compact-thumb {
            width: 48px;
            height: 48px;
            flex: 0 0 auto;
            border-radius: 17px;
            background-size: cover;
            background-position: center;
        }

        .video-card {
            cursor: pointer;
            padding: 12px;
        }
        .video-thumb {
            min-height: 148px;
            position: relative;
            border-radius: 18px;
            overflow: hidden;
            background-size: cover;
            background-position: center;
            background-color: #e2e8f0;
        }
        .video-thumb::after {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(180deg, transparent, rgba(15,23,42,.52));
        }
        .video-thumb button {
            position: absolute;
            left: 14px;
            bottom: 14px;
            z-index: 1;
            width: 42px;
            height: 42px;
            border: 0;
            border-radius: 50%;
            color: var(--lc-brand);
            background: #fff;
        }
        .video-thumb span {
            position: absolute;
            right: 12px;
            bottom: 18px;
            z-index: 1;
            color: #fff;
            font-size: 12px;
            font-weight: 600;
        }
        .video-card h3 { margin: 11px 0 5px; font-size: 15px; font-weight: 650; line-height: 1.35; }
        .video-card small { color: var(--lc-muted); }
        .video-empty {
            grid-column: 1 / -1;
            padding: 18px;
            border-radius: 18px;
            background: #f8fafc;
            color: var(--lc-muted);
            font-weight: 600;
        }

        .video-modal {
            position: fixed;
            inset: 0;
            z-index: 1100;
            display: none;
            align-items: center;
            justify-content: center;
            padding: 18px;
        }
        .video-modal.active { display: flex; }
        .video-modal-backdrop {
            position: absolute;
            inset: 0;
            background: rgba(15,23,42,.72);
            backdrop-filter: blur(10px);
        }
        .video-modal-box {
            position: relative;
            z-index: 1;
            width: min(960px, 100%);
            overflow: hidden;
            border-radius: 24px;
            background: #fff;
            box-shadow: 0 30px 90px rgba(0,0,0,.32);
        }
        .video-modal-frame { position: relative; padding-top: 56.25%; background:#000; }
        .video-modal-frame iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
        .video-modal-close {
            position: absolute;
            top: 10px;
            right: 10px;
            z-index: 2;
            width: 38px;
            height: 38px;
            border: 0;
            border-radius: 50%;
            color: #fff;
            background: rgba(15,23,42,.65);
            font-size: 24px;
            line-height: 1;
        }
        .video-modal-info { padding: 14px 18px; }
        .video-modal-info h3 { margin: 0 0 3px; font-size: 17px; font-weight: 700; }
        .video-modal-info small { color: var(--lc-muted); }

        .news-modal {
            position: fixed;
            inset: 0;
            z-index: 1200;
            display: none;
            align-items: center;
            justify-content: center;
            padding: 18px;
        }
        .news-modal.active { display: flex; }
        .news-modal-backdrop {
            position: absolute;
            inset: 0;
            background: rgba(15, 23, 42, .76);
            backdrop-filter: blur(12px);
        }
        .news-modal-box {
            position: relative;
            z-index: 2;
            display: grid;
            grid-template-columns: minmax(360px, .92fr) minmax(420px, 1.08fr);
            width: min(1180px, 100%);
            max-width: 100%;
            height: min(88vh, 820px);
            overflow: hidden;
            border: 1px solid rgb(166 166 166);
            border-radius: 32px;
            background: #fff;
            box-shadow: 0 30px 100px rgba(15, 23, 42, .38);
        }
        .news-modal-close {
            position: absolute;
            top: 14px;
            right: 14px;
            z-index: 10;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 44px;
            height: 44px;
            border: 1px solid rgba(255, 255, 255, .64);
            border-radius: 999px;
            background: rgba(15, 23, 42, .74);
            color: #fff;
            font-size: 28px;
            font-weight: 800;
            line-height: 1;
            cursor: pointer;
            box-shadow: 0 14px 34px rgba(0, 0, 0, .22);
            backdrop-filter: blur(12px);
        }
        .news-modal-image-wrap {
            position: relative;
            min-height: 0;
            height: 100%;
            overflow: hidden;
            background: #020617;
        }
        .news-modal-image-bg {
            position: absolute;
            inset: 0;
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            filter: blur(24px);
            transform: scale(1.14);
            opacity: .58;
        }
        .news-modal-image-wrap::after {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(circle at center, rgba(15, 23, 42, .04), rgba(2, 6, 23, .62)), linear-gradient(180deg, rgba(2, 6, 23, .08), rgba(2, 6, 23, .36));
            pointer-events: none;
        }
        .news-modal-image-main {
            position: relative;
            z-index: 2;
            width: 100%;
            height: 100%;
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
        }
        .news-modal-body {
            overflow-y: auto;
            padding: 34px 36px 32px;
        }
        .news-modal-tags {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            max-width: calc(100% - 56px);
            margin: 0 0 18px;
        }
        .news-pill {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
            min-height: 30px;
            max-width: 100%;
            padding: 5px 10px;
            border-radius: 999px;
            font-size: 12px;
            line-height: 1;
            font-weight: 800;
            letter-spacing: .18px;
            white-space: nowrap;
        }
        .news-modal-tags .news-pill { min-height: 34px; padding: 7px 12px; font-size: 13px; }
        .news-modal-tags svg,
        .pill-view svg { width: 16px; height: 16px; flex: 0 0 auto; }
        .pill-category,
        .pill-area { background: #eff6ff; color: #2563eb; }
        .pill-time { color: #64748b; }
        .pill-view {
            color: #15803d;
            position: relative;
            top: -3px;
            margin-top: 10px;
            font-size: 15px;
        }
        .news-modal-body h2 {
            max-width: 820px;
            margin: 0;
            color: #0f172a;
            font-size: clamp(30px, 3vw, 44px);
            line-height: 1.12;
            font-weight: 800;
            letter-spacing: -.85px;
            overflow-wrap: anywhere;
            display: inline;
        }
        .news-modal-body > p {
            max-width: 820px;
            margin: 14px 0 0;
            color: #64748b;
            font-size: 17px;
            line-height: 1.72;
            font-weight: 600;
            overflow-wrap: anywhere;
        }
        .news-modal-foot,
        .news-modal-source-row {
            display: grid;
            grid-template-columns: auto minmax(0, 1fr) auto;
            align-items: center;
            gap: 5px;
            min-width: 0;
            max-width: 100%;
            margin-top: 16px;
            padding: 13px 14px;
            border: 1px solid #e2e8f0;
            border-radius: 18px;
            background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
            color: #64748b;
            font-size: 14px;
            font-weight: 700;
        }

        .news-modal-foot b,
        .news-modal-source-row b {
            color: #94a3b8 !important;
            font-size: 12px;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .25px;
        }
        .news-modal-source-link {
            min-width: 0;
            max-width: 100%;
            color: #2563eb;
            font-size: 14px;
            font-weight: 800;
            text-decoration: none;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .news-modal-source-open {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 34px;
            height: 34px;
            border-radius: 999px;
            background: #eff6ff;
            color: #2563eb;
        }
        .news-modal-source-link:hover { text-decoration: underline; }
        .news-modal-full {
            grid-column: 1 / -1;
            min-width: 0;
            margin-top: 0px;
        }
        .news-detail-loading {
            display: flex;
            gap: 10px;
            align-items: flex-start;
            padding: 15px 16px;
            border: 1px solid #e2e8f0;
            border-radius: 18px;
            background: #f8fafc;
            color: #64748b;
            font-size: 14px;
            line-height: 1.65;
            font-weight: 700;
        }
        .news-quick-read-wrap {
            margin-top: 0px;
            padding: 0;
            border-radius: 22px;
            background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
        }
        .news-quick-toolbar {
            display: flex;
            justify-content: center;
            align-items: center;
            gap: 14px;
        }
        .news-quick-title { display: none; }
        .news-quick-read-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 9px;
            min-height: 50px;
            padding: 0 24px;
            border: 0;
            border-radius: 999px;
            background: #0f172a;
            color: #fff;
            font-size: 14px;
            font-weight: 800;
            white-space: nowrap;
            cursor: pointer;
            box-shadow: 0 16px 34px rgba(15, 23, 42, .18);
        }
        .news-quick-read-btn:hover { background: #1e293b; }
        .news-quick-read-box {
            margin-top: 0px;
            padding: 16px;
            border: 1px solid #c6e692e0;
            border-radius: 2px;
            background: #fff;
            position: relative;
        }
        .news-quick-read-head {
            display: flex;
            align-items: center;
            gap: 12px;
            margin-bottom: 12px;
        }
        .news-quick-read-head b {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            color: #2563eb;
            font-size: 12px;
            line-height: 1;
            font-weight: 800;
        }
        .news-quick-read-head b svg { width: 15px; height: 15px; }
        .news-quick-read-p,
        .news-quick-read-answer {
            margin: 0 0 12px;
            color: #1e293b;
            font-size: 16px;
            line-height: 1.82;
            font-weight: 500;
            white-space: pre-line;
        }
        .news-quick-read-p:last-child { margin-bottom: 0; }
        .news-quick-read-p.is-typing::after {
            content: "▍";
            display: inline-block;
            margin-left: 2px;
            color: #2563eb;
            animation: quickCursorBlink .8s infinite;
        }
        @keyframes quickCursorBlink {
            0%, 45% { opacity: 1; }
            46%, 100% { opacity: 0; }
        }

        .bottom-nav {
            position: fixed;
            left: 12px;
            right: 12px;
            bottom: 12px;
            z-index: 1040;
            display: none;
            padding: 8px;
            border-radius: 24px;
            border: 1px solid rgba(226, 232, 240, .94);
            background: rgba(255, 255, 255, .94);
            box-shadow: 0 18px 50px rgba(15, 23, 42, .18);
            backdrop-filter: blur(18px);
        }
        .bottom-nav a {
            flex: 1;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 2px;
            min-height: 50px;
            border-radius: 18px;
            color: var(--lc-muted);
            font-size: 11px;
            font-weight: 600;
        }
        .bottom-nav i { font-size: 18px; }
        .bottom-nav a.active { color: var(--lc-brand); background: #ecfdf5; }
        .floating-post {
            position: fixed;
            right: 18px;
            bottom: 88px;
            z-index: 1040;
            min-width: 54px;
            height: 54px;
            align-items: center;
            justify-content: center;
            gap: 8px;
            padding: 0 18px;
            border: 0;
            border-radius: 20px;
            color: #fff;
            background: linear-gradient(135deg, var(--lc-brand), var(--lc-brand-2));
            box-shadow: 0 18px 36px rgba(15, 138, 95, .28);
        }
        .floating-ai-shortcut {
            position: fixed;
            right: 18px;
            bottom: 152px;
            z-index: 1039;
            min-width: 54px;
            height: 54px;
            display: none;
            align-items: center;
            justify-content: center;
            gap: 8px;
            padding: 0 18px;
            border: 0;
            border-radius: 20px;
            color: #fff;
            background: linear-gradient(135deg, #0369a1, #0284c7);
            box-shadow: 0 18px 36px rgba(2, 132, 199, .28);
            text-decoration: none;
        }

        @media (max-width: 1199px) {
            .brand-link { min-width: 218px; }
            .service-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
            .top-layout,
            .content-layout { grid-template-columns: 1fr; }
            .right-column { position: static; }
        }
        @media (max-width: 991px) {
            .topbar-actions .post-btn { display: none !important; }
            .top-search { display: none !important; }
            .mobile-search { display: flex !important; }
            .lc-topbar { min-height: 72px; }
        }
        @media (max-width: 767px) {
            body { font-size: 14px; }
            .main-wrap { padding-bottom: 92px; }
            .lc-topbar { min-height: 66px; }
            .brand-link { min-width: auto; gap: 10px; }
            .brand-logo-wrap { width: 48px; height: 48px; border-radius: 18px; }
            .brand-logo-img { width: 40px; height: 40px; }
            .brand-title { font-size: 16px; letter-spacing: -.15px; }
            .brand-slogan { font-size: 11.5px; margin-top: 2px; }
            .round-btn { width: 43px; height: 43px; }
            .avatar-btn { height: 43px; padding-right: 5px; }
            .avatar-photo { width: 35px; height: 35px; }
            .avatar-btn .bi-chevron-down { display: none; }
            .super-dock { padding: 14px; border-radius: 24px; }
            .service-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
            .service-item { min-height: 88px; padding: 10px 4px; border-radius: 18px; }
            .service-icon { width: 38px; height: 38px; border-radius: 15px; font-size: 17px; }
            .service-item b { font-size: 12px; }
            .service-item small { display: none; }
            .hero-news { min-height: 372px; border-radius: 28px; }
            .hero-content { padding: 22px; }
            .hero-title { font-size: 20px; letter-spacing: -.75px; }
            .hero-desc { font-size: 14px; }
            .section-card,
            .trend-card,
            .weather-card,
            .info-card { padding: 16px; border-radius: 22px; }
            .section-title { font-size: 20px; }
            .section-head { gap: 10px; align-items: flex-start; margin-bottom: 12px; }
            .section-link { font-size: 13px; }
            .home-core-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
            .home-core-card { min-height: 136px; padding: 12px; border-radius: 16px; }
            .home-core-card b { font-size: 13.8px; }
            .home-core-card small { font-size: 11px; line-height: 1.38; }
            .home-core-icon { width: 32px; height: 32px; font-size: 17px; }
            .home-core-arrow { width: 22px; height: 22px; font-size: 14px; right: 10px; bottom: 8px; }
            .home-quick-head { display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; }
            .home-quick-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
            .home-quick-item { min-height: 98px; padding: 10px; border-radius: 12px; }
            .home-quick-label { font-size: 12.8px; }
            .home-quick-desc { font-size: 11.2px; }
            .feature-grid,
            .listing-grid,
            .video-row { grid-template-columns: 1fr; }
            .feature-card { min-height: 178px; }
            .home-quick-title { font-size: 16px; }
            .home-quick-sub { font-size: 12px; }
            .home-quick-label { font-size: 13px; }
            .trend-item { grid-template-columns: 62px 1fr; }
            .thumb,
            .news-thumb-img { width: 62px; height: 54px; }
            .bottom-nav { display: flex; }
            .floating-ai-shortcut { display: none !important; }
            .floating-post { width: 54px; padding: 0; border-radius: 20px; }
            .floating-post span { display: none; }
            .news-modal { padding: 10px; align-items: flex-end; }
            .news-modal-box {
                display: block;
                width: 100%;
                height: min(92vh, 860px);
                border-radius: 24px 24px 0 0;
                overflow-y: auto;
            }
            .news-modal-image-wrap { height: 230px; }
            .news-modal-body { padding: 20px; overflow: visible; }
            .news-modal-tags { max-width: calc(100% - 46px); margin-bottom: 12px; }
            .news-modal-body h2 { font-size: 24px; letter-spacing: -.35px; }
            .news-modal-body > p { font-size: 15px; line-height: 1.62; }
            .news-modal-foot,
            .news-modal-source-row { grid-template-columns: 1fr auto; }
            .news-modal-foot > b,
            .news-modal-source-row > b { grid-column: 1 / -1; }
            .news-modal-source-link { font-size: 13px; }
            .news-quick-read-btn { width: 100%; }
            .news-quick-toolbar { display: block; }
            .news-quick-read-p,
            .news-quick-read-answer { font-size: 15px; line-height: 1.76; }
            .video-modal { padding: 10px; }
            .video-modal-box { border-radius: 20px; }
        }
        @media (max-width: 420px) {
            .brand-title { font-size: 14.5px; }
            .brand-slogan { font-size: 10.5px; }
            .service-grid { gap: 7px; }
            .service-item b { font-size: 11.5px; }
        }

        :root {
            --lc-bg: #f4f8fb;
            --lc-card: #ffffff;
            --lc-text: #172033;
            --lc-soft-text: #344054;
            --lc-muted: #667085;
            --lc-line: #e4ebf2;
            --lc-brand: #0b7a65;
            --lc-brand-2: #16a878;
            --lc-blue: #2563eb;
            --lc-orange: #f59e0b;
            --lc-red: #ef4444;
            --lc-violet: #7c3aed;
            --lc-pink: #db2777;
            --lc-radius: 24px;
            --lc-shadow: 0 18px 48px rgba(15, 23, 42, .075);
            --lc-shadow-soft: 0 10px 28px rgba(15, 23, 42, .055);
        }
        * { box-sizing: border-box; }
        html { scroll-behavior: smooth; }
        body {
            min-height: 100vh;
            margin: 0;
            color: var(--lc-text);
            font-family: "Be Vietnam Pro", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
            font-size: 15px;
            font-weight: 400;
            line-height: 1.55;
            text-rendering: optimizeLegibility;
            -webkit-font-smoothing: antialiased;
            background:
                    radial-gradient(circle at 8% -8%, rgba(16, 185, 129, .18), transparent 30%),
                    radial-gradient(circle at 88% 2%, rgba(37, 99, 235, .10), transparent 26%),
                    linear-gradient(180deg, #f7fbff 0%, var(--lc-bg) 52%, #f8fafc 100%);
        }
        a { color: inherit; text-decoration: none; }
        a:hover { color: inherit; }
        .container-xxl { max-width: 1920px; }
        .main, .main-wrap { background: transparent; }
        .main-wrap { padding-bottom: 92px; }

        .lc-header {
            position: sticky;
            top: 0;
            z-index: 1030;
            background: rgba(247, 251, 255, .88);
            backdrop-filter: blur(18px);
            border-bottom: 1px solid rgba(226, 232, 240, .78);
        }
        .lc-topbar { min-height: 78px; }
        .brand-link {
            min-width: 240px;
            display: inline-flex;
            align-items: center;
            gap: 13px;
            color: var(--lc-text);
        }
        .brand-logo-wrap {
            width: 58px;
            height: 58px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 22px;
        }
        .brand-logo-img {
            width: 48px;
            height: 48px;
            border-radius: 50%;
            object-fit: cover;
            background: #fff;
        }
        .brand-title {
            display: block;
            margin: 0;
            color: var(--lc-brand);
            font-size: 20px;
            font-weight: 700;
            line-height: 1.08;
            letter-spacing: -.25px;
        }
        .brand-slogan {
            display: block;
            margin-top: 4px;
            color: #667085;
            font-size: 12.5px;
            font-weight: 500;
            letter-spacing: .01em;
        }

        .top-search {
            height: 52px;
            max-width: 820px;
            border-radius: 999px;
            border: 1px solid rgba(203, 213, 225, .86);
            background: rgba(255, 255, 255, .92);
            box-shadow: var(--lc-shadow-soft);
            transition: .18s ease;
        }
        .top-search:focus-within {
            border-color: rgba(11, 122, 101, .35);
            box-shadow: 0 16px 36px rgba(11, 122, 101, .12);
        }
        .top-search i { color: #64748b; font-size: 19px; }
        .top-search input {
            min-width: 0;
            border: 0;
            outline: 0;
            background: transparent;
            color: var(--lc-text);
            font-weight: 400;
            box-shadow: none !important;
        }
        .top-search input::placeholder { color: #7a8494; }
        .btn-brand {
            border: 0;
            color: #fff;
            background: linear-gradient(135deg, var(--lc-brand), var(--lc-brand-2));
            box-shadow: 0 14px 30px rgba(11, 122, 101, .22);
        }
        .btn-brand:hover { color: #fff; filter: brightness(.98); }
        .btn-soft {
            border: 1px solid var(--lc-line);
            color: var(--lc-text);
            background: rgba(255, 255, 255, .94);
        }
        .btn-soft:hover { border-color: #d5e0eb; background: #fff; }
        .btn, .dropdown-item { font-weight: 600; letter-spacing: -.02em; }
        .topbar-actions { flex: 0 0 auto; }
        .round-btn {
            width: 48px;
            height: 48px;
            position: relative;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            border: 1px solid var(--lc-line);
            color: var(--lc-text);
            background: rgba(255, 255, 255, .94);
            box-shadow: var(--lc-shadow-soft);
        }
        .round-btn i { font-size: 19px; }
        .notify-dot {
            position: absolute;
            top: 11px;
            right: 12px;
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background: var(--lc-red);
            box-shadow: 0 0 0 3px #fff;
        }
        .avatar-btn {
            height: 48px;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 4px 8px 4px 4px;
            border-radius: 999px;
            border: 1px solid var(--lc-line);
            background: rgba(255, 255, 255, .94);
            box-shadow: var(--lc-shadow-soft);
        }
        .avatar-photo {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            object-fit: cover;
            border: 2px solid #fff;
            box-shadow: 0 7px 18px rgba(15, 23, 42, .16);
        }
        .user-menu {
            width: 292px;
            margin-top: 12px !important;
            padding: 8px;
            border: 1px solid rgba(226, 232, 240, .94);
            border-radius: 24px;
            box-shadow: 0 24px 70px rgba(15, 23, 42, .16);
        }
        .user-head {
            display: flex;
            gap: 12px;
            align-items: center;
            padding: 13px;
            border-radius: 18px;
            background: linear-gradient(135deg, #f8fafc, #ecfdf5);
        }
        .user-head .avatar-photo { width: 48px; height: 48px; }
        .user-name { display: block; font-size: 16px; font-weight: 700; color: var(--lc-text); }
        .user-sub { display: block; margin-top: 2px; color: var(--lc-muted); font-size: 12.5px; }
        .user-menu .dropdown-item {
            display: flex;
            align-items: center;
            gap: 11px;
            margin-top: 3px;
            padding: 11px 12px;
            border-radius: 15px;
            color: #253047;
            font-size: 14px;
            font-weight: 500;
        }
        .user-menu .dropdown-item i { width: 20px; color: var(--lc-brand); font-size: 16px; }
        .user-menu .dropdown-item:hover { color: var(--lc-brand); background: #f1f8f5; }
        .eyrok-connect-wrap {
            min-height: 44px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }

        .app-card {
            border: 1px solid rgba(226, 232, 240, .92);
            border-radius: var(--lc-radius);
            background: rgba(255, 255, 255, .94);
            box-shadow: var(--lc-shadow);
        }
        .section-head {
            display: flex;
            align-items: end;
            justify-content: space-between;
            gap: 14px;
            margin-bottom: 16px;
        }
        .section-title { margin: 0; font-size: 22px; font-weight: 700; letter-spacing: -.35px; }
        .section-desc { margin: 4px 0 0; color: var(--lc-muted); font-size: 14px; }
        .section-link { color: var(--lc-brand); font-size: 14px; font-weight: 600; white-space: nowrap; }

        .mobile-search { display: none; }
        .super-dock {
            padding: 18px;
            border-radius: 28px;
            background:
                    linear-gradient(135deg, rgba(255, 255, 255, .96), rgba(236, 253, 245, .74));
        }
        .service-grid {
            display: grid;
            grid-template-columns: repeat(8, minmax(0, 1fr));
            gap: 12px;
        }
        .service-item {
            min-height: 108px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 8px;
            padding: 12px 8px;
            border: 1px solid #edf2f7;
            border-radius: 22px;
            color: var(--lc-text);
            background: rgba(255, 255, 255, .86);
            box-shadow: 0 10px 24px rgba(15, 23, 42, .035);
            transition: .16s ease;
        }
        .service-item:hover {
            transform: translateY(-3px);
            border-color: #dbe6ee;
            background: #fff;
            box-shadow: 0 18px 38px rgba(15, 23, 42, .08);
        }
        .service-icon {
            width: 42px;
            height: 42px;
            flex: 0 0 auto;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 17px;
            font-size: 19px;
        }
        .service-item b { font-size: 13.5px; font-weight: 600; letter-spacing: -.1px; }
        .service-item small { margin-top: -5px; color: var(--lc-muted); font-size: 11.5px; }
        .ico-green { color:#0b7a65; background:#ecfdf5; }
        .ico-blue { color:#2563eb; background:#eff6ff; }
        .ico-orange { color:#ea580c; background:#fff7ed; }
        .ico-red { color:#e11d48; background:#fff1f2; }
        .ico-violet { color:#7c3aed; background:#f5f3ff; }
        .ico-gold { color:#b7791f; background:#fffbeb; }
        .ico-slate { color:#475569; background:#f1f5f9; }
        .ico-pink { color:#db2777; background:#fdf2f8; }

        .content-layout {
            display: grid;
            grid-template-columns: minmax(0, 1fr) 333px;
            gap: 18px;
            align-items: start;
        }
        .top-layout {
            display: grid;
            grid-template-columns: minmax(0, 1.2fr) minmax(340px, .8fr);
            gap: 18px;
        }
        .hero-news {
            position: relative;
            min-height: 432px;
            overflow: hidden;
            border-radius: 32px;
            color: #fff;
            background: #0f172a;
            box-shadow: var(--lc-shadow);
        }
        .hero-news-bg {
            position: absolute;
            inset: 0;
            background:
                    linear-gradient(180deg, rgba(15, 23, 42, .05), rgba(15, 23, 42, .82)),
                    url('https://images.unsplash.com/photo-1500534314209-a25ddb2bd429?auto=format&fit=crop&w=1600&q=86') center/cover no-repeat;
            transform: scale(1.02);
        }
        .hero-news-bg::after,
        .hero-news-overlay {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(180deg, rgba(15, 23, 42, .06), rgba(15, 23, 42, .86));
        }
        .hero-news::after {
            content: "";
            position: absolute;
            inset: auto 24px 24px 24px;
            height: 110px;
            border-radius: 999px;
            background: rgba(16, 185, 129, .22);
            filter: blur(42px);
        }
        .hero-content {
            position: absolute;
            inset: auto 0 0 0;
            z-index: 1;
            padding: 30px;
        }
        .soft-pill {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            min-height: 34px;
            padding: 0 12px;
            border-radius: 999px;
            color: inherit;
            background: rgba(255, 255, 255, .16);
            border: 1px solid rgba(255, 255, 255, .20);
            backdrop-filter: blur(16px);
            font-size: 12.5px;
            font-weight: 600;
        }
        .hero-title {
            max-width: 800px;
            margin: 15px 0 12px;
            font-size: 20px;
            font-weight: 600;
            line-height: 1.06;
            letter-spacing: -1.2px;
            overflow: hidden;
            height: 65px;
            line-height: 33px;
            color: #fff;
        }
        .hero-desc { max-width: 690px; margin: 0 0 16px; color: rgba(255,255,255,.82); font-size: 15.5px; }
        .hero-meta { display: flex; flex-wrap: wrap; gap: 8px; }
        .hero-meta span {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            min-height: 34px;
            padding: 0 11px;
            border-radius: 999px;
            color: rgba(255, 255, 255, .88);
            background: rgba(15, 23, 42, .42);
            border: 1px solid rgba(255, 255, 255, .12);
            font-size: 12.5px;
        }
        .side-stack { display: grid; gap: 14px; }
        .weather-card {
            padding: 18px;
            background: linear-gradient(135deg, #ffffff, #eefdf6);
        }
        .weather-temp { font-size: 42px; font-weight: 700; letter-spacing: -1px; line-height: 1; }
        .weather-orb,
        .weather-icon-real {
            width: 68px;
            height: 68px;
            flex: 0 0 auto;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
        }
        .weather-orb {
            background: radial-gradient(circle at 30% 28%, #fde68a, #f59e0b 58%, #ea580c 100%);
            box-shadow: 0 0 0 12px rgba(245, 158, 11, .14), 0 16px 30px rgba(245, 158, 11, .16);
        }
        .weather-live .weather-icon-real svg { max-width: 72px; max-height: 72px; }
        .weather-days,
        .weather-live-days {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 8px;
            margin-top: 14px;
        }
        .weather-days span,
        .weather-live-days span,
        .day-pill {
            display: block;
            padding: 8px 6px;
            border: 1px solid #edf2f7;
            border-radius: 16px;
            background: rgba(255,255,255,.78);
            text-align: center;
            color: #475569;
            font-size: 12px;
        }
        .weather-days span svg,
        .weather-live-days span svg { display: block; width: 26px; height: 26px; margin: 4px auto 2px; }
        .weather-days span b,
        .weather-live-days span b,
        .day-pill b { display: block; color: var(--lc-text); font-size: 13px; }
        .weather-days span small,
        .weather-live-days span small { display: block; color: var(--lc-muted); font-size: 11px; }

        .trend-card { padding: 18px; }
        .trend-list { display: grid; gap: 10px; }
        .trend-item {
            display: grid;
            grid-template-columns: 68px 1fr;
            gap: 12px;
            align-items: center;
            padding: 9px;
            border-radius: 18px;
            color: var(--lc-text);
            background: #f8fafc;
            border: 1px solid #edf2f7;
            transition: .16s ease;
        }
        .trend-item:hover { background: #fff; box-shadow: 0 12px 26px rgba(15,23,42,.06); }
        .thumb {
            width: 68px;
            height: 58px;
            border-radius: 15px;
            background-size: cover;
            background-position: center;
        }
        .trend-item b { display: block; font-size: 14px; font-weight: 600; line-height: 1.35; }
        .trend-item small { color: var(--lc-muted); font-size: 12px; }

        .section-card { padding: 24px; }
        .feature-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
        .feature-card {
            min-height: 210px;
            position: relative;
            overflow: hidden;
            display: flex;
            align-items: flex-end;
            padding: 18px;
            border-radius: 24px;
            color: #fff;
            background-size: cover;
            background-position: center;
            box-shadow: inset 0 -120px 90px rgba(15,23,42,.72);
        }
        .feature-card h3 { margin: 10px 0 6px; font-size: 18px; line-height: 1.28; font-weight: 700; }
        .feature-card p { margin: 0; color: rgba(255,255,255,.78); font-size: 13px; }
        .tour { background-image: url('https://images.unsplash.com/photo-1544735716-392fe2489ffa?auto=format&fit=crop&w=900&q=82'); }
        .food { background-image: url('https://images.unsplash.com/photo-1543353071-873f17a7a088?auto=format&fit=crop&w=900&q=82'); }
        .farm { background-image: url('https://images.unsplash.com/photo-1500595046743-cd271d694d30?auto=format&fit=crop&w=900&q=82'); }

        .listing-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
        .listing-card {
            padding: 15px;
            border-radius: 22px;
            border: 1px solid #edf2f7;
            background: #fff;
            box-shadow: 0 10px 22px rgba(15,23,42,.035);
            transition: .16s ease;
        }
        .listing-card:hover { transform: translateY(-2px); box-shadow: 0 18px 34px rgba(15,23,42,.08); }
        .listing-card h3 { margin: 9px 0 5px; font-size: 16px; font-weight: 650; line-height: 1.35; }
        .listing-card p { margin: 0 0 10px; color: var(--lc-muted); font-size: 13px; }
        .price { color: var(--lc-brand); font-weight: 700; }
        .mini-badge {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            min-height: 28px;
            padding: 0 10px;
            border-radius: 999px;
            font-size: 12px;
            font-weight: 600;
            background: #f8fafc;
            color: #475569;
        }
        .right-column { position: sticky; top: 104px; align-self: start; display: grid; gap: 14px; }
        .info-card { padding: 16px; }
        .compact-list { display: grid; gap: 10px; }
        .compact-item {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 9px;
            border-radius: 18px;
            border: 1px solid #edf2f7;
            background: #f8fafc;
            transition: .16s ease;
        }
        .compact-item:hover { background:#fff; box-shadow:0 12px 26px rgba(15,23,42,.06); }
        .compact-item b { display: block; font-size: 14px; font-weight: 600; line-height: 1.35; }
        .compact-item small { display: block; color: var(--lc-muted); font-size: 12px; }
        .compact-thumb {
            width: 48px;
            height: 48px;
            flex: 0 0 auto;
            border-radius: 17px;
            background-size: cover;
            background-position: center;
        }
        .video-row {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 14px;
        }
        .video-card {
            cursor: pointer;
            border-radius: 22px;
            border: 1px solid #edf2f7;
            background: #fff;
            padding: 12px;
            box-shadow: 0 10px 22px rgba(15,23,42,.035);
        }
        .video-thumb {
            min-height: 148px;
            position: relative;
            border-radius: 18px;
            overflow: hidden;
            background-size: cover;
            background-position: center;
            background-color: #e2e8f0;
        }
        .video-thumb::after {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(180deg, transparent, rgba(15,23,42,.52));
        }
        .video-thumb button {
            position: absolute;
            left: 14px;
            bottom: 14px;
            z-index: 1;
            width: 42px;
            height: 42px;
            border: 0;
            border-radius: 50%;
            color: var(--lc-brand);
            background: #fff;
        }
        .video-thumb span {
            position: absolute;
            right: 12px;
            bottom: 18px;
            z-index: 1;
            color: #fff;
            font-size: 12px;
            font-weight: 600;
        }
        .video-card h3 { margin: 11px 0 5px; font-size: 15px; font-weight: 650; line-height: 1.35; }
        .video-card small { color: var(--lc-muted); }

        .video-modal {
            position: fixed;
            inset: 0;
            z-index: 1100;
            display: none;
            align-items: center;
            justify-content: center;
            padding: 18px;
        }
        .video-modal.active { display: flex; }
        .video-modal-backdrop {
            position: absolute;
            inset: 0;
            background: rgba(15,23,42,.72);
            backdrop-filter: blur(10px);
        }
        .video-modal-box {
            position: relative;
            z-index: 1;
            width: min(960px, 100%);
            overflow: hidden;
            border-radius: 24px;
            background: #fff;
            box-shadow: 0 30px 90px rgba(0,0,0,.32);
        }
        .video-modal-frame { position: relative; padding-top: 56.25%; background:#000; }
        .video-modal-frame iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
        .video-modal-close {
            position: absolute;
            top: 10px;
            right: 10px;
            z-index: 2;
            width: 38px;
            height: 38px;
            border: 0;
            border-radius: 50%;
            color: #fff;
            background: rgba(15,23,42,.65);
            font-size: 24px;
            line-height: 1;
        }
        .video-modal-info { padding: 14px 18px; }
        .video-modal-info h3 { margin: 0 0 3px; font-size: 17px; font-weight: 700; }
        .video-modal-info small { color: var(--lc-muted); }

        .bottom-nav {
            position: fixed;
            left: 12px;
            right: 12px;
            bottom: 12px;
            z-index: 1040;
            display: none;
            padding: 8px;
            border-radius: 24px;
            border: 1px solid rgba(226, 232, 240, .94);
            background: rgba(255, 255, 255, .94);
            box-shadow: 0 18px 50px rgba(15, 23, 42, .18);
            backdrop-filter: blur(18px);
        }
        .bottom-nav a {
            flex: 1;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 2px;
            min-height: 50px;
            border-radius: 18px;
            color: var(--lc-muted);
            font-size: 11px;
            font-weight: 600;
        }
        .bottom-nav i { font-size: 18px; }
        .bottom-nav a.active { color: var(--lc-brand); background: #ecfdf5; }
        .floating-post {
            position: fixed;
            right: 18px;
            bottom: 88px;
            z-index: 1040;
            min-width: 54px;
            height: 54px;
            display: none;
            align-items: center;
            justify-content: center;
            gap: 8px;
            padding: 0 18px;
            border: 0;
            border-radius: 20px;
            color: #fff;
            background: linear-gradient(135deg, var(--lc-brand), var(--lc-brand-2));
            box-shadow: 0 18px 36px rgba(15, 138, 95, .28);
        }

        @media (max-width: 1199px) {
            .brand-link { min-width: 218px; }
            .service-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
            .top-layout, .content-layout { grid-template-columns: 1fr; }
            .right-column { position: static; }
        }
        @media (max-width: 991px) {
            .topbar-actions .post-btn { display: none !important; }
            .top-search { display: none !important; }
            .mobile-search { display: flex !important; }
            .lc-topbar { min-height: 72px; }
        }
        @media (max-width: 767px) {
            body { font-size: 14px; }
            .main-wrap { padding-bottom: 92px; }
            .lc-topbar { min-height: 66px; }
            .brand-link { min-width: auto; gap: 10px; }
            .brand-logo-wrap { width: 48px; height: 48px; border-radius: 18px; }
            .brand-logo-img { width: 40px; height: 40px; }
            .brand-title { font-size: 16px; letter-spacing: -.15px; }
            .brand-slogan { font-size: 11.5px; margin-top: 2px; }
            .round-btn { width: 43px; height: 43px; }
            .avatar-btn { height: 43px; padding-right: 5px; }
            .avatar-photo { width: 35px; height: 35px; }
            .avatar-btn .bi-chevron-down { display: none; }
            .super-dock { padding: 14px; border-radius: 24px; }
            .service-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
            .service-item { min-height: 88px; padding: 10px 4px; border-radius: 18px; }
            .service-icon { width: 38px; height: 38px; border-radius: 15px; font-size: 17px; }
            .service-item b { font-size: 12px; }
            .service-item small { display: none; }
            .hero-news { min-height: 250px; border-radius: 28px; }
            .hero-content { padding: 22px; }
            .hero-title { font-size: 20px; letter-spacing: -.75px; }
            .hero-desc { font-size: 14px; }
            .section-card, .trend-card, .weather-card, .info-card { padding: 16px; border-radius: 22px; }
            .section-title { font-size: 20px; }
            .feature-grid, .listing-grid, .video-row { grid-template-columns: 1fr; }
            .feature-card { min-height: 178px; }
            .trend-item { grid-template-columns: 62px 1fr; }
            .thumb { width: 62px; height: 54px; }
            .bottom-nav, .floating-post { display: flex; }
            .floating-post { width: 54px; padding: 0; border-radius: 20px; }
            .floating-post span { display: none; }
        }
        @media (max-width: 420px) {
            .brand-title { font-size: 14.5px; }
            .brand-slogan { font-size: 10.5px; }
            .service-grid { gap: 7px; }
            .service-item b { font-size: 11.5px; }
            .weather-card { display: none; }
        }
        .section-kicker {
            display: inline-flex;
            margin-bottom: 5px;
            color: var(--lc-brand);
            font-size: 12px;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .08em;
        }

        .section-link {
            display: inline-flex;
            align-items: center;
            gap: 4px;
        }

        .market-category-grid {
            display: grid;
            grid-template-columns: repeat(6, minmax(0, 1fr));
            gap: 12px;
        }

        .market-category {
            min-width: 0;
            display: flex;
            flex-direction: column;
            gap: 10px;
            padding: 14px;
            border: 1px solid #edf2f7;
            border-radius: 22px;
            background: #fff;
            box-shadow: 0 10px 22px rgba(15, 23, 42, .035);
            transition: .16s ease;
        }

        .market-category:hover {
            transform: translateY(-2px);
            border-color: rgba(11, 122, 101, .18);
            box-shadow: 0 18px 34px rgba(15, 23, 42, .075);
        }

        .market-icon {
            width: 44px;
            height: 44px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 17px;
            font-size: 20px;
        }

        .market-category b {
            display: block;
            color: var(--lc-text);
            font-size: 14px;
            font-weight: 800;
            line-height: 1.25;
        }

        .market-category small {
            display: block;
            margin-top: 4px;
            color: var(--lc-muted);
            font-size: 12px;
            font-weight: 500;
            line-height: 1.35;
        }

        .market-highlight {
            margin-top: 16px;
            padding-top: 16px;
            border-top: 1px solid rgba(226, 232, 240, .9);
        }

        .market-highlight-head {
            display: flex;
            align-items: end;
            justify-content: space-between;
            gap: 14px;
            margin-bottom: 13px;
        }

        .market-highlight-head h3 {
            margin: 0;
            color: var(--lc-text);
            font-size: 18px;
            font-weight: 800;
            letter-spacing: -.25px;
        }

        .market-highlight-head p {
            margin: 4px 0 0;
            color: var(--lc-muted);
            font-size: 13px;
        }

        .market-highlight-head a {
            flex: 0 0 auto;
            color: var(--lc-brand);
            font-size: 13px;
            font-weight: 800;
        }

        .market-listing-grid {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 12px;
        }

        .market-listing-card {
            min-width: 0;
            padding: 15px;
            border: 1px solid #edf2f7;
            border-radius: 22px;
            background: #fff;
            box-shadow: 0 10px 22px rgba(15, 23, 42, .035);
        }

        .market-listing-card h3 {
            margin: 10px 0 6px;
            color: var(--lc-text);
            font-size: 15px;
            font-weight: 800;
            line-height: 1.35;
            letter-spacing: -.15px;
        }

        .market-listing-card p {
            min-height: 42px;
            margin: 0 0 12px;
            color: var(--lc-muted);
            font-size: 13px;
            line-height: 1.55;
        }

        .market-card-foot {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
        }

        .market-card-foot small {
            color: var(--lc-muted);
            font-size: 12px;
            white-space: nowrap;
        }

        .local-feature-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        @media (max-width: 1199px) {
            .market-category-grid {
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }

            .market-listing-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }

        @media (max-width: 767px) {
            .market-category-grid {
                grid-template-columns: repeat(3, minmax(0, 1fr));
                gap: 8px;
            }

            .market-category {
                align-items: center;
                text-align: center;
                padding: 11px 6px;
                border-radius: 18px;
            }

            .market-icon {
                width: 38px;
                height: 38px;
                border-radius: 15px;
                font-size: 17px;
            }

            .market-category b {
                font-size: 12px;
            }

            .market-category small {
                display: none;
            }

            .market-highlight-head {
                align-items: flex-start;
            }

            .market-listing-grid,
            .local-feature-grid {
                grid-template-columns: 1fr;
            }

            .market-listing-card p {
                min-height: 0;
            }
        }

        /* view css */
        :root {
            --lc-primary: var(--lc-brand);
            --lc-green: #16a34a;
            --lc-orange: #f97316;
            --lc-blue: #2563eb;
            --lc-border: rgba(226, 232, 240, .86);
        }

        /* home */
        .section-kicker {
            display: inline-flex;
            margin-bottom: 5px;
            color: var(--lc-brand);
            font-size: 12px;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .08em;
        }

        .section-link {
            display: inline-flex;
            align-items: center;
            gap: 4px;
        }

        .home-market .section-title {
            margin-top: 2px;
        }

        .market-category-grid {
            display: grid;
            grid-template-columns: repeat(6, minmax(0, 1fr));
            gap: 12px;
        }

        .market-category {
            min-width: 0;
            position: relative;
            display: flex;
            flex-direction: column;
            gap: 10px;
            padding: 14px;
            border: 1px solid #edf2f7;
            border-radius: 22px;
            background: #fff;
            box-shadow: 0 10px 22px rgba(15, 23, 42, .035);
            transition: .16s ease;
        }

        .market-category:hover {
            transform: translateY(-2px);
            border-color: rgba(11, 122, 101, .18);
            box-shadow: 0 18px 34px rgba(15, 23, 42, .075);
        }

        .market-category.is-demo::after {
            content: "Sắp mở";
            position: absolute;
            top: 10px;
            right: 10px;
            padding: 3px 7px;
            border-radius: 999px;
            background: #f8fafc;
            color: #64748b;
            font-size: 10px;
            font-weight: 800;
            letter-spacing: -.02em;
        }

        .market-icon {
            width: 44px;
            height: 44px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 17px;
            font-size: 20px;
        }

        .market-category b {
            display: block;
            color: var(--lc-text);
            font-size: 14px;
            font-weight: 800;
            line-height: 1.25;
        }

        .market-category small {
            display: block;
            margin-top: 4px;
            color: var(--lc-muted);
            font-size: 12px;
            font-weight: 500;
            line-height: 1.35;
        }

        .market-highlight {
            margin-top: 16px;
            padding-top: 16px;
            border-top: 1px solid rgba(226, 232, 240, .9);
        }

        .market-highlight-head {
            display: flex;
            align-items: end;
            justify-content: space-between;
            gap: 14px;
            margin-bottom: 13px;
        }

        .market-highlight-head h3 {
            margin: 0;
            color: var(--lc-text);
            font-size: 18px;
            font-weight: 800;
            letter-spacing: -.25px;
        }

        .market-highlight-head p {
            margin: 4px 0 0;
            color: var(--lc-muted);
            font-size: 13px;
        }

        .market-highlight-head a {
            flex: 0 0 auto;
            color: var(--lc-brand);
            font-size: 13px;
            font-weight: 800;
        }

        .market-listing-grid {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 12px;
        }

        .market-listing-card {
            min-width: 0;
            position: relative;
            padding: 15px;
            border: 1px solid #edf2f7;
            border-radius: 22px;
            background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,250,252,.96));
            box-shadow: 0 10px 22px rgba(15, 23, 42, .035);
        }

        .market-listing-card h3 {
            margin: 10px 0 6px;
            color: #334155;
            font-size: 15px;
            font-weight: 800;
            line-height: 1.35;
            letter-spacing: -.15px;
        }

        .market-listing-card p {
            min-height: 42px;
            margin: 0 0 12px;
            color: var(--lc-muted);
            font-size: 13px;
            line-height: 1.55;
        }

        .market-card-foot {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
        }

        .market-card-foot small {
            color: var(--lc-muted);
            font-size: 12px;
            white-space: nowrap;
        }

        .local-feature-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        @media (max-width: 1199px) {
            .market-category-grid {
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }

            .market-listing-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }

        @media (max-width: 767px) {
            .market-category-grid {
                grid-template-columns: repeat(3, minmax(0, 1fr));
                gap: 8px;
            }

            .market-category {
                align-items: center;
                text-align: center;
                padding: 11px 6px;
                border-radius: 18px;
            }

            .market-category.is-demo::after {
                display: none;
            }

            .market-icon {
                width: 38px;
                height: 38px;
                border-radius: 15px;
                font-size: 17px;
            }

            .market-category b {
                font-size: 12px;
            }

            .market-category small {
                display: none;
            }

            .market-highlight-head {
                align-items: flex-start;
            }

            .market-listing-grid,
            .local-feature-grid {
                grid-template-columns: 1fr;
            }

            .market-listing-card p {
                min-height: 0;
            }
        }

        /* news */
        .news-page *,
        .news-modal *,
        .news-page *::before,
        .news-modal *::before,
        .news-page *::after,
        .news-modal *::after {
            box-sizing: border-box;
        }

        :where(.news-page, .news-modal) a {
            color: inherit;
        }

        :where(.news-page, .news-modal) svg {
            flex: 0 0 auto;
        }

        .news-page {
            width: 100%; padding: 18px 12px 56px; overflow-x: hidden;
        }

        :where(.news-page, .news-modal) .news-shell {
            display: grid; gap: 18px; min-width: 0;
        }

        :where(.news-page, .news-modal) .news-filter-bar {
            position: sticky;
            top: 8px;
            z-index: 80;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 14px;
            min-width: 0;
            padding: 10px;
            border: 1px solid rgba(255, 255, 255, .88);
            border-radius: 24px;
            background: rgba(255, 255, 255, .88);
            backdrop-filter: blur(16px);
            box-shadow: 0 12px 34px rgba(15, 23, 42, .06);
        }

        :where(.news-page, .news-modal) .news-filter-label {
            display: inline-flex;
            align-items: center;
            gap: 9px;
            flex: 0 0 auto;
            padding: 0 8px;
            color: #475569;
            font-size: 13px;
            font-weight: 950;
            white-space: nowrap;
        }

        :where(.news-page, .news-modal) .news-filter-label svg {
            width: 18px; height: 18px;
        }

        .news-page-filter {
            display: flex;
            justify-content: flex-end;
            gap: 8px;
            flex-wrap: wrap;
            min-width: 0;
        }

        :where(.news-page, .news-modal) .news-filter-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 40px;
            border: 0;
            border-radius: 999px;
            padding: 0 15px;
            background: #fff;
            color: #334155;
            font-size: 13px;
            font-weight: 900;
            box-shadow: inset 0 0 0 1px rgba(226, 232, 240, .9);
            cursor: pointer;
            transition: transform .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease;
        }

        :where(.news-page, .news-modal) .news-filter-btn:hover {
            transform: translateY(-1px); box-shadow: 0 10px 24px rgba(15, 23, 42, .08);
        }

        :where(.news-page, .news-modal) .news-filter-btn.active {
            background: #0f172a; color: #fff; box-shadow: 0 13px 28px rgba(15, 23, 42, .18);
        }

        :where(.news-page, .news-modal) .news-featured {
            display: grid;
            grid-template-columns: minmax(0, 1.38fr) minmax(360px, .82fr);
            gap: 20px;
            align-items: stretch;
            min-width: 0;
        }

        :where(.news-page, .news-modal) .news-hero-card {
            position: relative;
            min-width: 0;
            min-height: 500px;
            overflow: hidden;
            border-radius: 32px;
            background: #0f172a;
            color: #fff;
            text-decoration: none;
            display: flex;
            align-items: flex-end;
            box-shadow: var(--lc-shadow);
            isolation: isolate;
        }

        :where(.news-page, .news-modal) .news-hero-bg {
            position: absolute;
            inset: 0;
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            background-color: #e5e7eb;
            transform: scale(1.02);
            transition: transform .38s ease;
        }

        :where(.news-page, .news-modal) .news-hero-card:hover .news-hero-bg {
            transform: scale(1.055);
        }

        :where(.news-page, .news-modal) .news-hero-card::before {
            content: "";
            position: absolute;
            inset: 0;
            z-index: 1;
            background:
                    linear-gradient(180deg, rgba(15, 23, 42, .05) 0%, rgba(15, 23, 42, .26) 42%, rgba(15, 23, 42, .86) 100%),
                    linear-gradient(90deg, rgba(15, 23, 42, .38), transparent 70%);
        }

        :where(.news-page, .news-modal) .news-hero-content {
            position: relative;
            z-index: 2;
            width: 100%;
            min-width: 0;
            padding: 34px;
        }

        :where(.news-page, .news-modal) .news-hero-content h2 {
            margin: 0;
            max-width: 880px;
            color: #fff;
            font-size: clamp(34px, 3.7vw, 56px);
            line-height: 1.06;
            font-weight: 950;
            letter-spacing: -1.15px;
            overflow-wrap: anywhere;
            text-shadow: 0 2px 18px rgba(0, 0, 0, .22);
        }

        :where(.news-page, .news-modal) .news-hero-content p {
            display: none;
        }

        :where(.news-page, .news-modal) .news-meta {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            margin-top: 20px;
        }

        :where(.news-page, .news-modal) .news-badge,
        :where(.news-page, .news-modal) .news-meta span {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            min-height: 34px;
            max-width: 100%;
            padding: 7px 12px;
            border-radius: 999px;
            background: rgba(255, 255, 255, .17);
            color: rgba(255, 255, 255, .94);
            font-size: 13px;
            font-weight: 950;
            backdrop-filter: blur(12px);
            overflow-wrap: anywhere;
        }

        :where(.news-page, .news-modal) .news-meta svg,
        :where(.news-page, .news-modal) .news-card-tags svg,
        :where(.news-page, .news-modal) .news-side-meta svg,
        .news-modal-tags svg {
            width: 16px; height: 16px;
        }

        :where(.news-page, .news-modal) .news-side-panel {
            display: flex; flex-direction: column; gap: 12px; min-width: 0; min-height: 100%;
        }

        :where(.news-page, .news-modal) .news-panel-head,
        :where(.news-page, .news-modal) .news-section-title {
            display: flex;
            align-items: flex-end;
            justify-content: space-between;
            gap: 14px;
            min-width: 0;
            padding: 0 4px;
        }

        :where(.news-page, .news-modal) .news-panel-head {
            min-height: 46px;
        }

        :where(.news-page, .news-modal) .news-panel-head h2,
        :where(.news-page, .news-modal) .news-section-title h2 {
            margin: 0;
            color: #0f172a;
            font-weight: 950;
            letter-spacing: -.45px;
        }

        :where(.news-page, .news-modal) .news-panel-head h2 {
            font-size: 20px;
        }

        :where(.news-page, .news-modal) .news-section-title h2 {
            font-size: clamp(24px, 2.5vw, 34px);
        }

        :where(.news-page, .news-modal) .news-panel-head span,
        :where(.news-page, .news-modal) .news-section-title p {
            margin: 0;
            color: #64748b;
            font-size: 13px;
            font-weight: 850;
        }

        :where(.news-page, .news-modal) .news-section-title p {
            max-width: 620px; line-height: 1.55; font-size: 14px; font-weight: 700;
        }

        :where(.news-page, .news-modal) .news-side-list {
            display: grid; gap: 12px; min-width: 0;
        }

        :where(.news-page, .news-modal) .news-side-item {
            display: grid;
            grid-template-columns: 112px minmax(0, 1fr);
            align-items: center;
            gap: 13px;
            min-width: 0;
            min-height: 112px;
            padding: 10px;
            border: 1px solid var(--lc-border);
            border-radius: 24px;
            background: rgba(255,255,255,.94);
            color: inherit;
            text-decoration: none;
            box-shadow: var(--lc-shadow-soft);
            transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
        }

        :where(.news-page, .news-modal) .news-side-item:hover,
        :where(.news-page, .news-modal) .news-card:hover {
            transform: translateY(-3px); border-color: rgba(37, 99, 235, .20); box-shadow: 0 18px 44px rgba(15, 23, 42, .115);
        }

        :where(.news-page, .news-modal) .news-side-thumb {
            width: 112px;
            height: 88px;
            border-radius: 18px;
            background-size: cover;
            background-position: center;
            background-color: #eef2f7;
            flex: 0 0 auto;
        }

        :where(.news-page, .news-modal) .news-side-item > span:last-child {
            min-width: 0;
        }

        :where(.news-page, .news-modal) .news-side-item b,
        :where(.news-page, .news-modal) .news-card h3,
        :where(.news-page, .news-modal) .news-card p {
            display: -webkit-box;
            -webkit-box-orient: vertical;
            overflow: hidden;
            min-width: 0;
            overflow-wrap: anywhere;
        }

        :where(.news-page, .news-modal) .news-side-item b {
            -webkit-line-clamp: 2;
            color: #0f172a;
            font-size: 16px;
            line-height: 1.34;
            font-weight: 950;
            letter-spacing: -.15px;
        }

        :where(.news-page, .news-modal) .news-side-meta {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 5px;
            margin-top: 8px;
            color: #64748b;
            font-size: 12px;
            line-height: 1.35;
            font-weight: 550;
        }

        :where(.news-page, .news-modal) .news-side-meta span {
            display: inline-flex; align-items: center; gap: 4px; min-width: 0;
        }

        :where(.news-page, .news-modal) .news-side-meta .dot {
            width: 4px; height: 4px; border-radius: 50%; background: #cbd5e1;
        }

        :where(.news-page, .news-modal) .news-main-grid {
            display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; min-width: 0;
        }

        :where(.news-page, .news-modal) .news-card {
            display: flex;
            flex-direction: column;
            min-width: 0;
            overflow: hidden;
            border: 1px solid rgba(226, 232, 240, .88);
            border-radius: 28px;
            background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
            color: inherit;
            text-decoration: none;
            box-shadow: var(--lc-shadow-soft);
            transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
        }

        :where(.news-page, .news-modal) .news-card-thumb {
            position: relative;
            height: 210px;
            background-size: cover;
            background-position: center;
            background-color: #eef2f7;
        }

        :where(.news-page, .news-modal) .news-card-body {
            display: flex; flex-direction: column; padding: 18px 18px 17px;
        }

        :where(.news-page, .news-modal) .news-card h3 {
            -webkit-line-clamp: 2;
            min-height: 50px;
            margin: 0;
            color: #0f172a;
            font-size: 18px;
            line-height: 1.38;
            font-weight: 950;
            letter-spacing: -.25px;
        }

        :where(.news-page, .news-modal) .news-card p {
            -webkit-line-clamp: 2;
            min-height: 44px;
            margin: 10px 0 0;
            color: #64748b;
            font-size: 14px;
            line-height: 1.55;
            font-weight: 700;
        }

        :where(.news-page, .news-modal) .news-card-tags {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 8px;
            margin: 14px 0 0;
        }

        :where(.news-page, .news-modal) .news-pill {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
            min-height: 30px;
            max-width: 100%;
            padding: 5px 10px;
            border-radius: 999px;
            font-size: 12px;
            line-height: 1;
            font-weight: 950;
            letter-spacing: .28px;
            white-space: nowrap;
        }

        :where(.news-page, .news-modal) .pill-time {
            color: #64748b;
        }

        :where(.news-page, .news-modal) .pill-category {
            background: #eff6ff; color: #2563eb;
        }

        :where(.news-page, .news-modal) .pill-area {
            background: #eff6ff; color: #2563eb;
        }

        :where(.news-page, .news-modal) .pill-view {
            color: #15803d; position: relative; top: -3px; font-size: 15px;
        }

        :where(.news-page, .news-modal) .pill-source {
            background: #f8fafc; color: #64748b; border-color: #e2e8f0;
        }

        :where(.news-page, .news-modal) .news-card-foot {
            display: none;
        }

        :where(.news-page, .news-modal) .news-more-wrap {
            margin-top: 8px; text-align: center;
        }

        :where(.news-page, .news-modal) .news-more-btn {
            min-width: 230px;
            min-height: 50px;
            border: 0;
            border-radius: 999px;
            background: #0f172a;
            color: #fff;
            font-size: 15px;
            font-weight: 950;
            cursor: pointer;
            box-shadow: 0 14px 30px rgba(15, 23, 42, .18);
        }

        :where(.news-page, .news-modal) .news-more-btn:hover {
            background: #1e293b;
        }

        :where(.news-page, .news-modal) .news-more-btn:disabled {
            opacity: .56; cursor: wait;
        }

        :where(.news-page, .news-modal) .news-empty,
        :where(.news-page, .news-modal) .news-error {
            padding: 24px;
            border: 1px solid var(--lc-border);
            border-radius: 22px;
            background: #fff;
            color: #64748b;
            font-weight: 850;
            text-align: center;
        }

        .news-modal {
            position: fixed;
            inset: 0;
            z-index: 999999;
            display: none;
            align-items: center;
            justify-content: center;
            padding: 18px;
        }

        .news-modal.active {
            display: flex;
        }

        .news-modal-backdrop {
            position: absolute;
            inset: 0;
            background: rgba(15, 23, 42, .76);
            backdrop-filter: blur(12px);
        }

        .news-modal-box {
            position: relative;
            z-index: 2;
            display: grid;
            grid-template-columns: minmax(380px, .92fr) minmax(440px, 1.08fr);
            width: min(1180px, 100%);
            max-width: 100%;
            height: min(88vh, 820px);
            overflow: hidden;
            border: 1px solid rgb(166 166 166);
            border-radius: 32px;
            background: #fff;
            box-shadow: 0 30px 100px rgba(15, 23, 42, .38);
        }

        .news-modal-close {
            position: absolute;
            top: 14px;
            right: 14px;
            z-index: 10;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 44px;
            height: 44px;
            border: 1px solid rgba(255, 255, 255, .64);
            border-radius: 999px;
            background: rgba(15, 23, 42, .74);
            color: #fff;
            font-size: 28px;
            font-weight: 800;
            line-height: 1;
            cursor: pointer;
            box-shadow: 0 14px 34px rgba(0, 0, 0, .22);
            backdrop-filter: blur(12px);
            -webkit-tap-highlight-color: transparent;
            transition: transform .18s ease, background .18s ease;
        }

        .news-modal-close:hover {
            background: rgba(15, 23, 42, .92); transform: translateY(-1px);
        }

        .news-modal-close:active {
            transform: scale(.96);
        }

        .news-modal-image-wrap {
            position: relative;
            min-height: 0;
            height: 100%;
            overflow: hidden;
            background: #020617;
            box-shadow: inset -1px 0 0 rgba(15, 23, 42, .35);
        }

        .news-modal-image-bg {
            position: absolute;
            inset: 0;
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            filter: blur(24px);
            transform: scale(1.14);
            opacity: .58;
        }

        .news-modal-image-wrap::after {
            content: "";
            position: absolute;
            inset: 0;
            background:
                    radial-gradient(circle at center, rgba(15, 23, 42, .04), rgba(2, 6, 23, .62)),
                    linear-gradient(180deg, rgba(2, 6, 23, .08), rgba(2, 6, 23, .36));
            pointer-events: none;
        }

        .news-modal-image-main {
            position: relative;
            z-index: 2;
            width: 100%;
            height: 100%;
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
        }

        .news-modal-body {
            overflow-y: auto;
            padding: 34px 36px 32px;
        }

        .news-modal-tags {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            max-width: calc(100% - 56px);
            margin: 0 0 18px;
        }

        .news-modal-tags .news-pill {
            min-height: 34px; padding: 7px 12px; font-size: 13px;
        }

        .news-modal-tags #newsModalViews {
            font: inherit;
        }

        .news-modal-body h2 {
            max-width: 820px;
            margin: 0;
            color: #0f172a;
            font-size: clamp(30px, 3vw, 44px);
            line-height: 1.12;
            font-weight: 950;
            letter-spacing: -.85px;
            overflow-wrap: anywhere;
            display: inline;
        }

        .news-modal-body > p {
            max-width: 820px;
            margin: 14px 0 0;
            color: #64748b;
            font-size: 17px;
            line-height: 1.72;
            font-weight: 720;
            overflow-wrap: anywhere;
        }

        .news-modal-full {
            margin-top: 20px;
        }

        .news-modal-full p {
            margin: 0 0 15px; color: #1e293b; font-size: 16px; line-height: 1.78; font-weight: 500;
        }

        :where(.news-page, .news-modal) .news-detail-loading,
        :where(.news-page, .news-modal) .news-detail-note {
            display: flex;
            gap: 10px;
            align-items: flex-start;
            padding: 15px 16px;
            border: 1px solid #e2e8f0;
            border-radius: 18px;
            background: #f8fafc;
            color: #64748b;
            font-size: 14px;
            line-height: 1.65;
            font-weight: 850;
        }

        :where(.news-page, .news-modal) .news-detail-note::before {
            content: "i";
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 22px;
            height: 22px;
            border-radius: 999px;
            background: #f8eddd;
            color: #848383;
            font-size: 14px;
            font-weight: 500;
            flex: 0 0 auto;
        }

        .news-modal-foot,
        .news-modal-source-row {
            display: grid;
            grid-template-columns: auto minmax(0, 1fr) auto;
            align-items: center;
            gap: 10px;
            min-width: 0;
            max-width: 100%;
            margin-top: 16px;
            padding: 13px 14px;
            border: 1px solid #e2e8f0;
            border-radius: 18px;
            background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
            color: #64748b;
            font-size: 14px;
            font-weight: 850;
        }

        .news-modal-foot b,
        .news-modal-source-row b {
            color: #94a3b8 !important;
            font-size: 12px;
            font-weight: 950;
            text-transform: uppercase;
            letter-spacing: .25px;
        }

        .news-modal-source-link {
            min-width: 0;
            max-width: 100%;
            color: #2563eb;
            font-size: 14px;
            font-weight: 950;
            text-decoration: none;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .news-modal-source-open {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 34px;
            height: 34px;
            border-radius: 999px;
            background: #eff6ff;
            color: #2563eb;
        }

        .news-modal-source-link:hover {
            text-decoration: underline;
        }

        body.news-modal-open {
            overflow: hidden;
        }

        :where(.news-page, .news-modal) .news-article-images {
            display: grid; gap: 18px; margin: 20px 0;
        }

        :where(.news-page, .news-modal) .news-article-image,
        :where(.news-page, .news-modal) .news-article-block-image {
            margin: 20px 0;
        }

        :where(.news-page, .news-modal) .news-article-image img,
        :where(.news-page, .news-modal) .news-article-block-image img {
            display: block; width: 100%; max-height: 620px; object-fit: cover; border-radius: 18px; background: #eef2f7;
        }

        :where(.news-page, .news-modal) .news-article-image figcaption,
        :where(.news-page, .news-modal) .news-article-block-image figcaption {
            margin-top: 8px; color: #64748b; font-size: 14px; line-height: 1.55; font-weight: 650; text-align: center;
        }

        :where(.news-page, .news-modal) .news-quick-read-wrap {
            margin-top: 18px;
            padding: 16px;
            border-radius: 24px;
            background:
                    radial-gradient(circle at 0% 0%, rgba(37, 99, 235, .08), transparent 34%),
                    linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
            box-shadow: 0 12px 34px rgba(15, 23, 42, .06);
        }

        :where(.news-page, .news-modal) .news-quick-toolbar {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            align-items: center;
            gap: 14px;
        }

        :where(.news-page, .news-modal) .news-quick-title {
            min-width: 0;
            display: grid;
            gap: 4px;
        }

        :where(.news-page, .news-modal) .news-quick-title span,
        :where(.news-page, .news-modal) .news-quick-read-head b {
            display: inline-flex;
            align-items: center;
            width: fit-content;
            min-height: 28px;
            padding: 5px 10px;
            border-radius: 999px;
            background: transparent;
            color: #2563eb;
            font-size: 12px;
            line-height: 1;
            font-weight: 950;
        }

        :where(.news-page, .news-modal) .news-quick-title b {
            color: #0f172a;
            font-size: 20px;
            line-height: 1.25;
            font-weight: 950;
            letter-spacing: -.28px;
        }

        :where(.news-page, .news-modal) .news-quick-title small,
        :where(.news-page, .news-modal) .news-quick-read-head small {
            color: #64748b;
            font-size: 13px;
            line-height: 1.45;
            font-weight: 750;
        }

        :where(.news-page, .news-modal) .news-quick-read-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 44px;
            padding: 0 18px;
            border: 0;
            border-radius: 999px;
            background: #0f172a;
            color: #fff;
            font-size: 14px;
            font-weight: 950;
            white-space: nowrap;
            cursor: pointer;
            box-shadow: 0 12px 26px rgba(15, 23, 42, .16);
            transition: transform .18s ease, background .18s ease;
        }

        :where(.news-page, .news-modal) .news-quick-read-btn:hover {
            background: #1e293b; transform: translateY(-1px);
        }

        :where(.news-page, .news-modal) .news-quick-read-btn:active {
            transform: scale(.98);
        }

        :where(.news-page, .news-modal) .news-quick-read-box {
            margin-top: 14px;
            padding: 10px;
            border: 1px solid #e2e8f0;
            border-radius: 20px;
            background: rgba(255, 255, 255, .88);
        }

        :where(.news-page, .news-modal) .news-quick-read-head {
            display: flex;
            align-items: center;
            gap: 12px;
            margin-bottom: 12px;
        }

        :where(.news-page, .news-modal) .news-quick-read-p {
            margin: 0 0 12px;
            color: #1e293b;
            font-size: 16px;
            line-height: 1.82;
            font-weight: 620;
        }

        :where(.news-page, .news-modal) .news-quick-read-p:last-child {
            margin-bottom: 0;
        }

        :where(.news-page, .news-modal) .news-quick-read-p.is-typing::after {
            content: "▍";
            display: inline-block;
            margin-left: 2px;
            color: #2563eb;
            animation: quickCursorBlink .8s infinite;
        }

        @keyframes quickCursorBlink {
        :where(.news-page, .news-modal) 0%,
        :where(.news-page, .news-modal) 45% {
            opacity: 1;
        }

        :where(.news-page, .news-modal) 46%,
        :where(.news-page, .news-modal) 100% {
            opacity: 0;
        }
        }

        :where(.news-page, .news-modal) .news-quick-read-answer {
            color: #1e293b;
            font-size: 16px;
            line-height: 1.82;
            font-weight: 620;
            white-space: pre-line;
        }

        :where(.news-page, .news-modal) .news-quick-read-note {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 7px 10px;
            margin-top: 13px;
            padding-top: 12px;
            border-top: 1px solid #e2e8f0;
            color: #64748b;
            font-size: 13px;
            line-height: 1.55;
            font-weight: 700;
        }

        :where(.news-page, .news-modal) .news-quick-read-note[hidden] {
            display: none !important;
        }

        :where(.news-page, .news-modal) .news-quick-read-note a {
            color: #2563eb;
            font-weight: 850;
            text-decoration: none;
        }

        :where(.news-page, .news-modal) .news-quick-read-note a:hover {
            text-decoration: underline;
        }

        .news-modal-full {
            min-width: 0;
        }

        .news-modal .news-quick-read-wrap {
            margin: 14px 0 0;
            padding: 0;
            border-radius: 22px;
            border-color: rgba(15, 23, 42, .08);
            background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
            box-shadow: inset 0 1px 0 rgba(255,255,255,.95);
        }

        .news-modal .news-quick-toolbar {
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .news-modal .news-quick-title {
            display: none;
        }

        .news-modal .news-quick-read-btn {
            gap: 9px;
            min-height: 50px;
            padding: 0 24px;
            border-radius: 999px;
            background: #0f172a;
            font-size: 14px;
            letter-spacing: .15px;
            box-shadow: 0 16px 34px rgba(15, 23, 42, .18);
        }

        .news-modal .news-quick-read-btn svg {
            width: 18px;
            height: 18px;
        }

        .news-modal .news-quick-read-box {
            margin-top: 12px;
            border-radius: 0px;
            background: #fff;
        }

        :where(.news-page, .news-modal) .news-quick-read-head b {
            gap: 7px;
        }

        :where(.news-page, .news-modal) .news-quick-read-head b svg {
            width: 15px; height: 15px;
        }

        @media (max-width: 640px) {
            :where(.news-page, .news-modal) .news-quick-read-wrap {
                padding: 14px; border-radius: 20px;
            }

            :where(.news-page, .news-modal) .news-quick-toolbar {
                grid-template-columns: 1fr; align-items: stretch;
            }

            :where(.news-page, .news-modal) .news-quick-read-btn {
                width: 100%;
            }

            :where(.news-page, .news-modal) .news-quick-read-head {
                display: grid;
            }

            :where(.news-page, .news-modal) .news-quick-title b {
                font-size: 18px;
            }

            :where(.news-page, .news-modal) .news-quick-read-p,
            :where(.news-page, .news-modal) .news-quick-read-answer {
                font-size: 15px; line-height: 1.76;
            }
        }

        :where(.news-page, .news-modal) .news-ai-read {
            margin: 18px 0 0;
            padding: 18px;
            border: 1px solid rgba(37, 99, 235, .14);
            border-radius: 22px;
            background:
                    radial-gradient(circle at 0% 0%, rgba(37, 99, 235, .08), transparent 34%),
                    linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
            box-shadow: 0 12px 34px rgba(15, 23, 42, .06);
        }

        :where(.news-page, .news-modal) .news-ai-read-head {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 14px;
            margin-bottom: 12px;
        }

        :where(.news-page, .news-modal) .news-ai-read-kicker {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            min-height: 28px;
            padding: 5px 10px;
            border-radius: 999px;
            background: #eff6ff;
            color: #2563eb;
            font-size: 12px;
            font-weight: 950;
        }

        :where(.news-page, .news-modal) .news-ai-read h3 {
            margin: 8px 0 0;
            color: #0f172a;
            font-size: 22px;
            line-height: 1.2;
            font-weight: 950;
            letter-spacing: -.35px;
        }

        :where(.news-page, .news-modal) .news-ai-read-head p {
            max-width: 300px;
            margin: 4px 0 0;
            color: #64748b;
            font-size: 13px;
            line-height: 1.5;
            font-weight: 750;
            text-align: right;
        }

        :where(.news-page, .news-modal) .news-key-points {
            display: grid;
            gap: 10px;
            margin: 0;
            padding: 0;
            list-style: none;
            color: #1e293b;
        }

        :where(.news-page, .news-modal) .news-key-points li {
            position: relative;
            margin: 0;
            padding: 12px 13px 12px 42px;
            border: 1px solid rgba(226, 232, 240, .88);
            border-radius: 16px;
            background: rgba(255, 255, 255, .78);
            color: #1e293b;
            font-size: 15.5px;
            line-height: 1.65;
            font-weight: 700;
        }

        :where(.news-page, .news-modal) .news-key-points li::before {
            content: "";
            position: absolute;
            left: 14px;
            top: 18px;
            width: 11px;
            height: 11px;
            border-radius: 999px;
            background: #2563eb;
            box-shadow: 0 0 0 5px #eff6ff;
        }

        :where(.news-page, .news-modal) .news-ai-summary {
            margin: 0 0 12px;
            padding: 13px 14px;
            border-radius: 16px;
            background: #f8fafc;
            color: #334155;
            font-size: 15px;
            line-height: 1.65;
            font-weight: 720;
        }

        :where(.news-page, .news-modal) .news-ai-note {
            margin-top: 12px;
            color: #64748b;
            font-size: 13px;
            line-height: 1.55;
            font-weight: 750;
        }

        @media (max-width: 1180px) {
            :where(.news-page, .news-modal) .news-featured {
                grid-template-columns: 1fr;
            }

            :where(.news-page, .news-modal) .news-side-panel {
                min-height: auto;
            }

            :where(.news-page, .news-modal) .news-side-list {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            :where(.news-page, .news-modal) .news-main-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }

            .news-modal-box {
                grid-template-columns: minmax(340px, .9fr) minmax(390px, 1.1fr); height: min(88vh, 780px);
            }
        }

        @media (max-width: 768px) {
            .news-page {
                padding: 10px 12px 38px;
            }

            :where(.news-page, .news-modal) .news-shell {
                gap: 14px;
            }

            :where(.news-page, .news-modal) .news-filter-bar {
                position: relative;
                top: auto;
                align-items: stretch;
                flex-direction: column;
                gap: 9px;
                width: 100%;
                max-width: 100%;
                padding: 9px;
                border-radius: 20px;
                overflow: hidden;
            }

            :where(.news-page, .news-modal) .news-filter-label {
                padding: 4px 6px 0;
            }

            .news-page-filter {
                width: 100%;
                max-width: 100%;
                justify-content: flex-start;
                flex-wrap: nowrap;
                overflow-x: auto;
                overflow-y: hidden;
                padding: 0 2px 4px;
                -webkit-overflow-scrolling: touch;
                scrollbar-width: none;
            }

            .news-page-filter::-webkit-scrollbar {
                display: none;
            }

            :where(.news-page, .news-modal) .news-filter-btn {
                flex: 0 0 auto; min-height: 38px; padding: 0 13px; white-space: nowrap;
            }

            :where(.news-page, .news-modal) .news-featured {
                gap: 14px;
            }

            :where(.news-page, .news-modal) .news-hero-card {
                width: 100%; min-height: 390px; border-radius: 26px;
            }

            :where(.news-page, .news-modal) .news-hero-content {
                padding: 20px;
            }

            :where(.news-page, .news-modal) .news-hero-content h2 {
                font-size: 31px; line-height: 1.12; letter-spacing: -.65px;
            }

            :where(.news-page, .news-modal) .news-meta {
                gap: 8px; margin-top: 16px;
            }

            :where(.news-page, .news-modal) .news-badge,
            :where(.news-page, .news-modal) .news-meta span {
                min-height: 32px; padding: 6px 10px; font-size: 12px;
            }

            :where(.news-page, .news-modal) .news-side-list {
                grid-template-columns: 1fr; width: 100%;
            }

            :where(.news-page, .news-modal) .news-side-item {
                width: 100%; grid-template-columns: 96px minmax(0, 1fr); gap: 11px; min-height: 98px; padding: 9px; border-radius: 22px;
            }

            :where(.news-page, .news-modal) .news-side-thumb {
                width: 96px; height: 74px; border-radius: 16px;
            }

            :where(.news-page, .news-modal) .news-side-item b {
                font-size: 15px;
            }

            :where(.news-page, .news-modal) .news-section-title {
                display: block; padding: 0 2px;
            }

            :where(.news-page, .news-modal) .news-section-title p {
                max-width: 100%; margin-top: 6px;
            }

            :where(.news-page, .news-modal) .news-main-grid {
                grid-template-columns: 1fr; gap: 15px; width: 100%;
            }

            :where(.news-page, .news-modal) .news-card {
                width: 100%; border-radius: 24px;
            }

            :where(.news-page, .news-modal) .news-card-thumb {
                height: 196px;
            }

            :where(.news-page, .news-modal) .news-card-body {
                padding: 16px;
            }

            :where(.news-page, .news-modal) .news-card h3 {
                min-height: auto; font-size: 19px; line-height: 1.34;
            }

            :where(.news-page, .news-modal) .news-card p {
                min-height: auto; margin-top: 9px; font-size: 14px; line-height: 1.55;
            }

            :where(.news-page, .news-modal) .news-card-tags {
                gap: 8px; margin-top: 13px;
            }

            :where(.news-page, .news-modal) .news-pill {
                min-height: 29px; padding: 5px 9px; font-size: 12px;
            }

            :where(.news-page, .news-modal) .news-more-btn {
                width: 100%; min-width: 0; min-height: 52px; border-radius: 16px; font-size: 16px;
            }

            .news-modal {
                align-items: flex-start; padding: 10px;
            }

            .news-modal-box {
                display: block;
                width: 100%;
                max-width: 100%;
                height: auto;
                max-height: calc(100vh - 24px);
                max-height: calc(100dvh - 24px);
                margin-top: 0;
                border-radius: 24px;
                overflow-y: auto;
            }

            .news-modal-close {
                position: fixed;
                top: max(12px, calc(env(safe-area-inset-top) + 10px));
                right: max(12px, calc(env(safe-area-inset-right) + 10px));
                z-index: 1000002;
                width: 46px;
                height: 46px;
                font-size: 28px;
                background: rgba(15, 23, 42, .82);
                box-shadow: 0 14px 38px rgba(0, 0, 0, .28);
            }

            .news-modal-image-wrap {
                width: 100%;
                min-height: 0;
                height: min(58vw, 300px);
                box-shadow: inset 0 -1px 0 rgba(15, 23, 42, .35);
            }

            .news-modal-image-bg {
                filter: blur(18px);
                transform: scale(1.12);
                opacity: .52;
            }

            .news-modal-body {
                overflow: visible; padding: 18px;
            }

            .news-modal-tags {
                display: flex;
                flex-wrap: nowrap;
                align-items: center;
                gap: 6px;
                max-width: 100%;
                margin: 0 0 14px;
                padding: 0 2px 4px 0;
                overflow-x: auto;
                overflow-y: hidden;
                -webkit-overflow-scrolling: touch;
                scrollbar-width: none;
            }

            .news-modal-tags::-webkit-scrollbar {
                display: none;
            }

            .news-modal-tags .news-pill {
                flex: 0 0 auto;
                min-height: 28px;
                padding: 5px 8px;
                font-size: 11.5px;
                border-radius: 999px;
                box-shadow: none;
            }

            .news-modal-tags .pill-category {
                order: 1;
            }

            .news-modal-tags .pill-area {
                order: 2; max-width: 118px;
            }

            .news-modal-tags .pill-time {
                order: 3;
            }

            .news-modal-tags .pill-view {
                order: 4;
            }

            .news-modal-tags .news-pill svg {
                width: 14px;
                height: 14px;
                flex: 0 0 auto;
            }

            .news-modal-tags .news-pill b {
                min-width: 0;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }

            .news-modal-body h2 {
                font-size: 25px; line-height: 1.2; letter-spacing: -.45px;
            }

            .news-modal-body > p {
                margin-top: 11px; font-size: 15px; line-height: 1.65;
            }

            .news-modal-full {
                margin-top: 15px;
            }

            .news-modal-full p {
                font-size: 15px; line-height: 1.72;
            }

            :where(.news-page, .news-modal) .news-ai-read {
                margin-top: 15px; padding: 15px; border-radius: 20px;
            }

            :where(.news-page, .news-modal) .news-ai-read-head {
                display: block; margin-bottom: 11px;
            }

            :where(.news-page, .news-modal) .news-ai-read h3 {
                font-size: 20px;
            }

            :where(.news-page, .news-modal) .news-ai-read-head p {
                max-width: 100%; margin-top: 7px; text-align: left;
            }

            :where(.news-page, .news-modal) .news-key-points {
                gap: 8px;
            }

            :where(.news-page, .news-modal) .news-key-points li {
                padding: 10px 11px 10px 36px; font-size: 14.5px; line-height: 1.58; border-radius: 14px;
            }

            :where(.news-page, .news-modal) .news-key-points li::before {
                left: 13px; top: 16px; width: 9px; height: 9px; box-shadow: 0 0 0 4px #eff6ff;
            }

            :where(.news-page, .news-modal) .news-ai-note {
                font-size: 12.5px;
            }

            .news-modal-foot,
            .news-modal-source-row {
                grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; margin-top: 15px; padding: 12px;
            }

            .news-modal-source-link {
                font-size: 13px;
            }
        }

        @media (max-width: 390px) {
            :where(.news-page, .news-modal) .news-card-body {
                padding: 15px;
            }

            :where(.news-page, .news-modal) .news-card-tags {
                gap: 7px;
            }

            :where(.news-page, .news-modal) .news-pill {
                min-height: 28px; padding: 5px 8px; font-size: 11px;
            }

            .news-modal-tags {
                gap: 5px;
            }

            .news-modal-tags .news-pill {
                min-height: 26px; padding: 4px 7px; font-size: 11px;
            }

            .news-modal-tags .news-pill svg {
                width: 13px; height: 13px;
            }

            .news-modal-tags .pill-area {
                max-width: 104px;
            }

            :where(.news-page, .news-modal) .news-hero-content h2 {
                font-size: 28px;
            }

            .news-modal-body h2 {
                font-size: 23px;
            }
        }

        /* read */
        .read-page,
        .read-page * {
            box-sizing: border-box;
        }

        .read-page {
            width: min(1220px, calc(100% - 32px));
            margin: 0 auto;
            padding: 26px 0 86px;
            color: var(--lc-text);
        }

        .read-page a {
            color: inherit;
            text-decoration: none;
        }

        .read-page svg {
            width: 18px;
            height: 18px;
            flex: 0 0 auto;
        }

        .read-page .read-article {
            display: grid;
            gap: 18px;
        }

        .read-page .read-hero {
            display: grid;
            grid-template-columns: minmax(340px, .92fr) minmax(0, 1.08fr);
            min-height: 560px;
            overflow: hidden;
            border: 1px solid rgba(226, 232, 240, .92);
            border-radius: 34px;
            background: rgba(255, 255, 255, .94);
            box-shadow: var(--lc-shadow);
        }

        .read-page .read-cover-wrap {
            position: relative;
            min-height: 560px;
            overflow: hidden;
            background: #020617;
        }

        .read-page .read-cover-bg {
            position: absolute;
            inset: 0;
            background-size: cover;
            background-position: center;
            filter: blur(28px);
            transform: scale(1.16);
            opacity: .54;
        }

        .read-page .read-cover-wrap::after {
            content: "";
            position: absolute;
            inset: 0;
            background:
                    radial-gradient(circle at 50% 42%, rgba(15, 23, 42, .04), rgba(2, 6, 23, .48)),
                    linear-gradient(180deg, rgba(2, 6, 23, .04), rgba(2, 6, 23, .42));
            pointer-events: none;
        }

        .read-page .read-cover-main {
            position: relative;
            z-index: 1;
            width: 100%;
            height: 100%;
            min-height: 560px;
            background-size: contain;
            background-position: center;
            background-repeat: no-repeat;
        }

        .read-page .read-head {
            min-width: 0;
            display: flex;
            flex-direction: column;
            justify-content: center;
            padding: clamp(26px, 3vw, 42px);
        }

        .read-page .read-back {
            align-self: flex-start;
            display: inline-flex;
            align-items: center;
            gap: 7px;
            min-height: 38px;
            margin-bottom: 20px;
            padding: 0 13px 0 10px;
            border: 1px solid #e2e8f0;
            border-radius: 999px;
            background: #fff;
            color: #475569;
            font-size: 13px;
            font-weight: 800;
            box-shadow: 0 8px 22px rgba(15, 23, 42, .045);
            transition: .16s ease;
        }

        .read-page .read-back:hover {
            color: var(--lc-brand);
            border-color: rgba(11, 122, 101, .22);
            transform: translateX(-2px);
        }

        .read-page .read-tags {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin-bottom: 16px;
        }

        .read-page .read-pill {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 7px;
            min-height: 34px;
            max-width: 100%;
            padding: 7px 11px;
            border-radius: 999px;
            font-size: 12.5px;
            line-height: 1;
            font-weight: 800;
            letter-spacing: .05px;
            white-space: nowrap;
        }

        .read-page .read-pill svg {
            width: 16px;
            height: 16px;
        }

        .read-page .pill-category,
        .read-page .pill-area {
            color: #2563eb;
            background: #eff6ff;
        }

        .read-page .pill-time {
            color: #64748b;
            background: #f8fafc;
            border: 1px solid #e2e8f0;
        }

        .read-page .pill-view {
            align-self: flex-start;
            margin-top: 10px;
            color: #15803d;
            background: #ecfdf5;
            border: 1px solid #bbf7d0;
        }

        .read-page .read-head h1 {
            max-width: 820px;
            margin: 0;
            color: #0f172a;
            font-size: clamp(30px, 3.25vw, 48px);
            line-height: 1.12;
            font-weight: 850;
            letter-spacing: -.9px;
            overflow-wrap: anywhere;
        }

        .read-page .read-source-card {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            align-items: center;
            gap: 12px;
            width: 100%;
            margin-top: 22px;
            padding: 14px;
            border: 1px solid #e2e8f0;
            border-radius: 22px;
            background:
                    linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
            box-shadow: 0 12px 28px rgba(15, 23, 42, .045);
        }

        .read-page .read-source-main {
            min-width: 0;
            display: flex;
            align-items: center;
            gap: 12px;
        }

        .read-page .read-source-main > svg {
            width: 38px;
            height: 38px;
            padding: 9px;
            border-radius: 14px;
            color: var(--lc-brand);
            background: #ecfdf5;
        }

        .read-page .read-source-main small {
            display: block;
            margin-bottom: 3px;
            color: #94a3b8;
            font-size: 11.5px;
            line-height: 1;
            font-weight: 850;
            text-transform: uppercase;
            letter-spacing: .22px;
        }

        .read-page .read-source-main strong {
            display: block;
            min-width: 0;
            max-width: 100%;
            color: #334155;
            font-size: 13.5px;
            line-height: 1.35;
            font-weight: 800;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            width: 185px;
        }

        .read-page .read-source-card > a {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 7px;
            min-height: 40px;
            padding: 0 13px;
            border-radius: 999px;
            color: #2563eb;
            background: #eff6ff;
            font-size: 13px;
            font-weight: 850;
            white-space: nowrap;
            transition: .16s ease;
        }

        .read-page .read-source-card > a:hover {
            background: #dbeafe;
            transform: translateY(-1px);
        }

        .read-page .read-source-card > a svg {
            width: 17px;
            height: 17px;
        }

        .read-page .read-ai-box {
            grid-column: 1 / -1;
            min-width: 0;
            margin-top: 2px;
            padding-top: 12px;
            border-top: 1px solid #e2e8f0;
        }

        .read-page .read-quick-toolbar {
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .read-page .read-quick-title {
            display: none;
        }

        .read-page .read-quick-read-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 9px;
            min-height: 48px;
            padding: 0 22px;
            border: 0;
            border-radius: 999px;
            color: #fff;
            background: #0f172a;
            font-size: 13.5px;
            font-weight: 900;
            letter-spacing: .08px;
            white-space: nowrap;
            cursor: pointer;
            box-shadow: 0 16px 34px rgba(15, 23, 42, .18);
            transition: .16s ease;
        }

        .read-page .read-quick-read-btn:hover {
            background: #1e293b;
            transform: translateY(-1px);
        }

        .read-page .read-quick-read-btn svg {
            width: 18px;
            height: 18px;
        }

        .read-page .read-quick-read-content {
            margin-top: 12px;
            padding: 17px;
            border: 1px solid rgba(15, 23, 42, .08);
            border-radius: 18px;
            background: #fff;
            box-shadow: 0 10px 24px rgba(15, 23, 42, .035);
        }

        .read-page .read-quick-read-content[hidden] {
            display: none !important;
        }

        .read-page .read-ai-note[hidden] {
            display: none !important;
        }

        .read-page .read-ai-head {
            display: flex;
            align-items: center;
            gap: 10px;
            margin-bottom: 11px;
        }

        .read-page .read-ai-head span {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            color: var(--lc-blue);
            font-size: 12.5px;
            line-height: 1;
            font-weight: 900;
            letter-spacing: .12px;
        }

        .read-page .read-ai-head svg {
            width: 16px;
            height: 16px;
        }

        .read-page .read-ai-summary,
        .read-page .read-quick-answer {
            color: #1e293b;
            font-size: 16px;
            line-height: 1.82;
            font-weight: 500;
            white-space: pre-line;
        }

        .read-page .read-quick-p {
            margin: 0 0 12px;
        }

        .read-page .read-quick-p:last-child {
            margin-bottom: 0;
        }

        .read-page .read-ai-note {
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 7px 10px;
            margin: 13px 0 0;
            padding-top: 12px;
            border-top: 1px solid #e2e8f0;
            color: #64748b;
            font-size: 13px;
            line-height: 1.55;
            font-weight: 700;
        }

        .read-page .read-ai-note a {
            color: #2563eb;
            font-weight: 850;
            text-decoration: none;
        }

        .read-page .read-ai-note a:hover {
            text-decoration: underline;
        }

        .read-page .read-quick-p.is-typing::after {
            content: "▍";
            display: inline-block;
            margin-left: 2px;
            color: var(--lc-blue);
            animation: readCursorBlink .8s infinite;
        }

        @keyframes readCursorBlink {
        .read-page 0%,
        .read-page 45% {
            opacity: 1;
        }

        .read-page 46%,
        .read-page 100% {
            opacity: 0;
        }
        }

        .read-page .read-content-wrap {
            border: 1px solid rgba(226, 232, 240, .92);
            border-radius: 30px;
            background: rgba(255, 255, 255, .96);
            box-shadow: var(--lc-shadow);
        }

        .read-page .read-content {
            width: min(820px, 100%);
            margin: 0 auto;
            padding: clamp(24px, 4vw, 48px);
            color: #1e293b;
            font-size: 18px;
            line-height: 1.86;
            font-weight: 450;
        }

        .read-page .read-content p {
            margin: 0 0 20px;
        }

        .read-page .read-content p:last-child {
            margin-bottom: 0;
        }

        .read-page .read-content h2,
        .read-page .read-content h3 {
            margin: 30px 0 14px;
            color: #0f172a;
            line-height: 1.28;
            font-weight: 850;
            letter-spacing: -.35px;
        }

        .read-page .read-content h2 {
            font-size: 28px;
        }

        .read-page .read-content h3 {
            font-size: 22px;
        }

        .read-page .read-content a {
            color: #2563eb;
            font-weight: 750;
            text-decoration: underline;
            text-underline-offset: 3px;
        }

        .read-page .read-content img {
            display: block;
            max-width: 100%;
            height: auto;
            margin: 24px auto;
            border-radius: 22px;
            box-shadow: 0 18px 40px rgba(15, 23, 42, .10);
        }

        .read-page .read-content figure {
            margin: 26px 0;
        }

        .read-page .read-content figcaption {
            margin-top: 10px;
            color: #64748b;
            font-size: 14px;
            line-height: 1.55;
            text-align: center;
        }

        .read-page .read-content blockquote {
            margin: 24px 0;
            padding: 18px 20px;
            border-left: 4px solid var(--lc-brand);
            border-radius: 18px;
            background: #f1f8f5;
            color: #334155;
            font-weight: 650;
        }

        .read-page .read-content ul,
        .read-page .read-content ol {
            margin: 18px 0 22px;
            padding-left: 24px;
        }

        .read-page .read-content li {
            margin: 8px 0;
        }

        .read-page .read-related {
            margin-top: 22px;
            padding: 24px;
            border: 1px solid rgba(226, 232, 240, .92);
            border-radius: 30px;
            background: rgba(255, 255, 255, .94);
            box-shadow: var(--lc-shadow);
        }

        .read-page .read-related-head {
            display: flex;
            align-items: end;
            justify-content: space-between;
            gap: 14px;
            margin-bottom: 16px;
        }

        .read-page .read-related-head span {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            color: var(--lc-brand);
            font-size: 12px;
            font-weight: 900;
            text-transform: uppercase;
            letter-spacing: .18px;
        }

        .read-page .read-related-head h2 {
            margin: 5px 0 0;
            color: #0f172a;
            font-size: 24px;
            line-height: 1.2;
            font-weight: 850;
            letter-spacing: -.45px;
        }

        .read-page .read-related-head > a {
            color: var(--lc-brand);
            font-size: 14px;
            font-weight: 850;
            white-space: nowrap;
        }

        .read-page .read-related-grid {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 14px;
        }

        .read-page .read-related-card {
            min-width: 0;
            display: block;
            overflow: hidden;
            border: 1px solid #edf2f7;
            border-radius: 22px;
            background: #fff;
            box-shadow: 0 10px 22px rgba(15, 23, 42, .035);
            transition: .16s ease;
        }

        .read-page .read-related-card:hover {
            transform: translateY(-3px);
            box-shadow: 0 18px 36px rgba(15, 23, 42, .08);
        }

        .read-page .read-related-img {
            display: block;
            width: 100%;
            aspect-ratio: 16 / 10;
            background-color: #eef2f7;
            background-size: cover;
            background-position: center;
        }

        .read-page .read-related-body {
            display: block;
            padding: 13px;
        }

        .read-page .read-related-body b {
            display: -webkit-box;
            min-height: 44px;
            color: #172033;
            font-size: 14.5px;
            line-height: 1.45;
            font-weight: 800;
            overflow: hidden;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
        }

        .read-page .read-related-body small {
            display: flex;
            align-items: center;
            gap: 5px;
            margin-top: 8px;
            color: #64748b;
            font-size: 12px;
            line-height: 1.4;
            overflow: hidden;
        }

        .read-page .read-related-body small svg {
            width: 14px;
            height: 14px;
        }

        .read-page .read-empty {
            width: min(680px, 100%);
            margin: 70px auto;
            padding: 34px;
            border: 1px solid rgba(226, 232, 240, .92);
            border-radius: 30px;
            background: rgba(255, 255, 255, .96);
            box-shadow: var(--lc-shadow);
            text-align: center;
        }

        .read-page .read-empty h1 {
            margin: 0;
            color: #0f172a;
            font-size: 30px;
            line-height: 1.2;
            font-weight: 850;
            letter-spacing: -.45px;
        }

        .read-page .read-empty p {
            margin: 12px 0 22px;
            color: #64748b;
            font-size: 15px;
            line-height: 1.65;
            font-weight: 600;
        }

        .read-page .read-empty a {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 44px;
            padding: 0 18px;
            border-radius: 999px;
            color: #fff;
            background: linear-gradient(135deg, var(--lc-brand), var(--lc-brand-2));
            font-size: 14px;
            font-weight: 850;
            box-shadow: 0 14px 30px rgba(11, 122, 101, .22);
        }

        @media (max-width: 1100px) {
            .read-page {
                width: min(100% - 24px, 980px);
                padding-top: 18px;
            }

            .read-page .read-hero {
                grid-template-columns: 1fr;
                min-height: 0;
            }

            .read-page .read-cover-wrap,
            .read-page .read-cover-main {
                min-height: 430px;
            }

            .read-page .read-head {
                padding: 28px;
            }

            .read-page .read-related-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }

        @media (max-width: 767px) {
            .read-page {
                width: 100%;
                padding: 0 0 86px;
            }

            .read-page .read-hero {
                border-radius: 0 0 26px 26px;
                border-left: 0;
                border-right: 0;
            }

            .read-page .read-cover-wrap,
            .read-page .read-cover-main {
                min-height: 260px;
            }

            .read-page .read-head {
                padding: 20px 16px 22px;
            }

            .read-page .read-back {
                min-height: 36px;
                margin-bottom: 15px;
                font-size: 12.5px;
            }

            .read-page .read-tags {
                gap: 6px;
                margin-bottom: 13px;
            }

            .read-page .read-pill {
                min-height: 31px;
                padding: 6px 9px;
                font-size: 11.5px;
            }

            .read-page .read-head h1 {
                font-size: 25px;
                line-height: 1.18;
                letter-spacing: -.45px;
            }

            .read-page .read-source-card {
                grid-template-columns: 1fr;
                gap: 10px;
                margin-top: 17px;
                padding: 12px;
                border-radius: 18px;
            }

            .read-page .read-source-card > a {
                width: 100%;
            }

            .read-page .read-source-main strong {
                white-space: normal;
                word-break: break-word;
            }

            .read-page .read-quick-read-btn {
                width: 100%;
                min-height: 46px;
            }

            .read-page .read-quick-read-content {
                padding: 14px;
                border-radius: 16px;
            }

            .read-page .read-ai-summary,
            .read-page .read-quick-answer {
                font-size: 15px;
                line-height: 1.76;
            }

            .read-page .read-content-wrap {
                margin: 14px 12px 0;
                border-radius: 22px;
            }

            .read-page .read-content {
                padding: 20px 16px;
                font-size: 16px;
                line-height: 1.78;
            }

            .read-page .read-content p {
                margin-bottom: 16px;
            }

            .read-page .read-content h2 {
                font-size: 22px;
            }

            .read-page .read-content h3 {
                font-size: 19px;
            }

            .read-page .read-related {
                margin: 14px 12px 0;
                padding: 16px;
                border-radius: 22px;
            }

            .read-page .read-related-head {
                align-items: start;
                margin-bottom: 14px;
            }

            .read-page .read-related-head h2 {
                font-size: 21px;
            }

            .read-page .read-related-grid {
                grid-template-columns: 1fr;
                gap: 10px;
            }

            .read-page .read-related-card {
                display: grid;
                grid-template-columns: 112px minmax(0, 1fr);
                border-radius: 18px;
            }

            .read-page .read-related-img {
                height: 100%;
                min-height: 98px;
                aspect-ratio: auto;
            }

            .read-page .read-related-body {
                padding: 11px;
            }

            .read-page .read-related-body b {
                min-height: 0;
                font-size: 14px;
            }

            .read-page .read-related-body small {
                display: -webkit-box;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 2;
            }

            .read-page .read-empty {
                width: calc(100% - 24px);
                margin: 26px auto;
                padding: 24px 18px;
                border-radius: 24px;
            }

            .read-page .read-empty h1 {
                font-size: 24px;
            }
        }

        @media (max-width: 420px) {
            .read-page .read-cover-wrap,
            .read-page .read-cover-main {
                min-height: 230px;
            }

            .read-page .read-head h1 {
                font-size: 23px;
            }

            .read-page .read-related-card {
                grid-template-columns: 96px minmax(0, 1fr);
            }
        }

/* ========================================================================== */
/* Source: app/views/index.php block 2 */
.eyrok-connect-wrap {
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .eyrok-connect-btn {
            min-height: 48px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 9px;
            padding: 0 20px;
            border: 1px solid rgba(11, 122, 101, .18);
            border-radius: 999px;
            background: linear-gradient(135deg, #ffffff, #ecfdf5);
            color: var(--lc-brand);
            font-size: 15px;
            font-weight: 800;
            letter-spacing: -.02em;
            box-shadow: 0 10px 26px rgba(15, 23, 42, .06);
            transition: .18s ease;
        }

        .eyrok-connect-btn::before {
            content: "\F4D7";
            font-family: "bootstrap-icons";
            font-size: 18px;
            line-height: 1;
        }

        .eyrok-connect-btn:hover {
            transform: translateY(-1px);
            border-color: rgba(11, 122, 101, .32);
            background: linear-gradient(135deg, var(--lc-brand), var(--lc-brand-2));
            color: #fff;
            box-shadow: 0 14px 30px rgba(11, 122, 101, .20);
        }

        @media (max-width: 767px) {
            .eyrok-connect-btn {
                min-height: 42px;
                padding: 0 14px;
                font-size: 0;
            }

            .eyrok-connect-btn::before {
                font-size: 19px;
            }
        }

/* ========================================================================== */
/* Source: app/views/UI/home.php block 1 */
.market-icon img {
                    width: 24px;
                    height: 24px;
                    object-fit: contain;
                    display: block;
                }

                .market-empty {
                    grid-column: 1 / -1;
                    padding: 16px;
                    border-radius: 16px;
                    background: rgba(15, 23, 42, .04);
                    color: #64748b;
                    font-size: 14px;
                    font-weight: 600;
                    text-align: center;
                }

                .hero-trust-row {
                    display: flex;
                    flex-wrap: wrap;
                    gap: 8px;
                    margin-top: 14px;
                }

                .hero-trust-row span {
                    display: inline-flex;
                    align-items: center;
                    gap: 6px;
                    min-height: 30px;
                    padding: 0 10px;
                    border-radius: 999px;
                    background: rgba(255, 255, 255, .18);
                    color: #fff;
                    font-size: 12px;
                    font-weight: 800;
                    backdrop-filter: blur(10px);
                }

                .market-post-card {
                    display: flex;
                    flex-direction: column;
                    overflow: hidden;
                    padding: 10px;
                    border-radius: 22px;
                    background: #fff;
                    border: 1px solid rgba(226, 232, 240, .92);
                    transition: .18s ease;
                }

                .market-post-card:hover {
                    transform: translateY(-3px);
                    border-color: rgba(11, 122, 101, .24);
                    box-shadow: 0 18px 34px rgba(15, 23, 42, .08);
                }

                .market-post-image {
                    position: relative;
                    display: block;
                    aspect-ratio: 4 / 3;
                    overflow: hidden;
                    border-radius: 18px;
                    background: #e2e8f0;
                }

                .market-post-image img {
                    width: 100%;
                    height: 100%;
                    display: block;
                    object-fit: cover;
                    transition: transform .18s ease;
                }

                .market-post-card:hover .market-post-image img {
                    transform: scale(1.04);
                }

                .market-post-count,
                .market-post-cate {
                    position: absolute;
                    display: inline-flex;
                    align-items: center;
                    border-radius: 999px;
                    backdrop-filter: blur(8px);
                    font-size: 11.5px;
                    font-weight: 800;
                }

                .market-post-count {
                    right: 8px;
                    bottom: 8px;
                    gap: 4px;
                    min-height: 24px;
                    padding: 0 8px;
                    background: rgba(15, 23, 42, .72);
                    color: #fff;
                }

                .market-post-cate {
                    left: 8px;
                    top: 8px;
                    max-width: calc(100% - 16px);
                    min-height: 24px;
                    padding: 0 9px;
                    background: rgba(236, 253, 245, .94);
                    color: #0f766e;
                    white-space: nowrap;
                    overflow: hidden;
                    text-overflow: ellipsis;
                }

                .market-post-body {
                    flex: 1;
                    display: flex;
                    flex-direction: column;
                    padding: 10px 2px 0;
                }

                .market-post-card h3 {
                    min-height: 40px;
                    margin: 0 0 7px;
                    color: #0f172a;
                    font-size: 14px;
                    font-weight: 800;
                    line-height: 1.38;
                    display: -webkit-box;
                    -webkit-line-clamp: 2;
                    -webkit-box-orient: vertical;
                    overflow: hidden;
                }

                .market-post-card .price {
                    color: #b45309;
                    font-size: 16px;
                    font-weight: 900;
                }

                .market-post-meta {
                    display: grid;
                    gap: 4px;
                    margin-top: 8px;
                    color: #64748b;
                    font-size: 12px;
                    font-weight: 600;
                }

                .market-post-meta span {
                    min-width: 0;
                    display: flex;
                    align-items: center;
                    gap: 5px;
                    white-space: nowrap;
                    overflow: hidden;
                    text-overflow: ellipsis;
                }

                .market-post-trust {
                    display: inline-flex;
                    align-items: center;
                    gap: 5px;
                    width: fit-content;
                    min-height: 24px;
                    margin-top: 7px;
                    padding: 0 9px;
                    border-radius: 999px;
                    background: #ecfdf5;
                    color: #0f766e;
                    font-size: 11.5px;
                    font-weight: 800;
                }

                .listview__loadmore .btn {
                    min-height: 42px;
                    font-size: 14px;
                    font-weight: 800;
                    border-color: rgba(11, 122, 101, .35);
                    color: var(--lc-brand);
                    background: #fff;
                    box-shadow: 0 8px 22px rgba(15, 23, 42, .06);
                }

                .listview__loadmore .btn:hover {
                    border-color: var(--lc-brand);
                    background: var(--lc-brand);
                    color: #fff;
                    box-shadow: 0 12px 28px rgba(11, 122, 101, .22);
                }

                @media (max-width: 479px) {
                    .hero-trust-row {
                        gap: 6px;
                    }

                    .hero-trust-row span {
                        min-height: 28px;
                        padding: 0 8px;
                        font-size: 11px;
                    }

                    .market-post-card {
                        padding: 8px;
                        border-radius: 18px;
                    }

                    .market-post-image {
                        border-radius: 15px;
                    }

                    .market-post-card h3 {
                        min-height: 38px;
                        font-size: 13px;
                    }

                    .market-post-meta {
                        font-size: 11px;
                    }
                }

                .news-quick-audio-btn {
                    display: inline-flex;
                    align-items: center;
                    gap: 8px;
                    min-height: 38px;
                    border: 0;
                    border-radius: 999px;
                    padding: 8px 13px;
                    background: #0f172a;
                    color: #fff;
                    font-size: 13px;
                    font-weight: 800;
                    line-height: 1;
                    cursor: pointer;
                    box-shadow: 0 10px 22px rgba(15, 23, 42, .12);
                }

                .news-quick-audio-btn svg {
                    width: 18px;
                    height: 18px;
                    flex: 0 0 18px;
                }

                .news-quick-audio-btn.is-playing {
                    background: #0f766e;
                }

                .news-quick-audio-btn:disabled {
                    opacity: .65;
                    cursor: wait;
                }

                .news-quick-audio-player {
                    width: 100%;
                    margin-top: 12px;
                    display: block;
                    border-radius: 999px;
                }

                .news-quick-audio-note {
                    margin-top: 8px;
                    color: #64748b;
                    font-size: 13px;
                    font-weight: 600;
                }


                .news-quick-toolbar {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    gap: 10px;
                    flex-wrap: wrap;
                    margin: 10px 0 12px;
                }

                .news-quick-title { display: none !important; }

                .news-quick-read-btn,
                .news-quick-audio-btn {
                    display: inline-flex !important;
                    align-items: center;
                    justify-content: center;
                    gap: 10px;
                    min-width: 190px;
                    min-height: 44px;
                    padding: 10px 18px;
                    border: 0;
                    border-radius: 999px;
                    background: #0f172a;
                    color: #fff;
                    font-size: 15px;
                    font-weight: 850;
                    line-height: 1;
                    cursor: pointer;
                    box-shadow: 0 14px 30px rgba(15, 23, 42, .14);
                    transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
                    text-decoration: none;
                }

                .news-quick-read-btn:hover,
                .news-quick-audio-btn:hover {
                    transform: translateY(-1px);
                    box-shadow: 0 18px 34px rgba(15, 23, 42, .2);
                }

                .news-quick-read-btn svg,
                .news-quick-audio-btn svg {
                    width: 21px !important;
                    height: 21px !important;
                    flex: 0 0 21px !important;
                }

                .news-quick-audio-btn.is-playing { background: #0f766e; }

                .news-quick-audio-box {
                    margin: 12px 0 14px;
                    padding: 10px;
                    border-radius: 18px;
                    background: rgba(15, 23, 42, .045);
                    border: 1px solid rgba(148, 163, 184, .26);
                }

                .news-quick-audio-player {
                    width: 100%;
                    display: block;
                    border-radius: 999px;
                }

                @media (max-width: 575px) {
                    .news-quick-toolbar {
                        display: grid;
                        grid-template-columns: 1fr 1fr;
                        gap: 8px;
                    }

                    .news-quick-read-btn,
                    .news-quick-audio-btn {
                        min-width: 0;
                        width: 100%;
                        min-height: 40px;
                        padding: 9px 10px;
                        font-size: 13px;
                        gap: 7px;
                    }

                    .news-quick-read-btn svg,
                    .news-quick-audio-btn svg {
                        width: 18px !important;
                        height: 18px !important;
                        flex-basis: 18px !important;
                    }
                }

                .news-quick-toolbar {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    gap: 10px;
                    flex-wrap: wrap;
                    margin: 10px 0 12px;
                }

                .news-quick-title { display: none !important; }

                .news-quick-read-btn,
                .news-quick-audio-btn {
                    display: inline-flex !important;
                    align-items: center;
                    justify-content: center;
                    gap: 9px;
                    min-width: 178px;
                    min-height: 42px;
                    padding: 10px 16px;
                    border: 1px solid rgba(15, 23, 42, .08);
                    border-radius: 999px;
                    background: linear-gradient(135deg, #0f172a, #1e293b);
                    color: #fff;
                    font-size: 14px;
                    font-weight: 850;
                    line-height: 1;
                    cursor: pointer;
                    box-shadow: 0 12px 26px rgba(15, 23, 42, .16);
                    transition: transform .16s ease, box-shadow .16s ease, background .16s ease, opacity .16s ease;
                    text-decoration: none;
                    white-space: nowrap;
                }

                .news-quick-read-btn:hover,
                .news-quick-audio-btn:hover {
                    transform: translateY(-1px);
                    box-shadow: 0 16px 32px rgba(15, 23, 42, .22);
                }

                .news-quick-audio-btn.is-playing {
                    background: linear-gradient(135deg, #0f766e, #0d9488);
                    box-shadow: 0 14px 30px rgba(13, 148, 136, .24);
                }

                .news-quick-btn-icon {
                    width: 22px;
                    height: 22px;
                    flex: 0 0 22px;
                    display: inline-flex;
                    align-items: center;
                    justify-content: center;
                    border-radius: 999px;
                    background: rgba(255, 255, 255, .13);
                }

                .news-quick-btn-icon svg,
                .news-quick-read-btn svg,
                .news-quick-audio-btn svg {
                    width: 17px !important;
                    height: 17px !important;
                    flex: 0 0 17px !important;
                    display: block;
                }

                .news-quick-read-box {
                    position: relative;
                    display: block;
                }

                .news-quick-read-box[hidden],
                .news-quick-audio-box[hidden],
                .news-quick-audio-player[hidden],
                .news-quick-audio-note[hidden] {
                    display: none !important;
                }

                .news-quick-audio-box {
                    order: 1;
                    width: 100%;
                    margin: 0 0 12px;
                    padding: 10px;
                    border-radius: 18px;
                    background: rgba(15, 23, 42, .045);
                    border: 1px solid rgba(148, 163, 184, .26);
                }

                .news-quick-audio-player {
                    width: 100%;
                    display: block;
                    border-radius: 999px;
                }

                .news-quick-audio-note {
                    margin-top: 8px;
                    color: #64748b;
                    font-size: 13px;
                    font-weight: 600;
                }

                .news-quick-read-answer {
                    order: 2;
                }

                @media (max-width: 575px) {
                    .news-quick-toolbar {
                        display: grid;
                        grid-template-columns: 1fr 1fr;
                        gap: 8px;
                    }

                    .news-quick-read-btn,
                    .news-quick-audio-btn {
                        min-width: 0;
                        width: 100%;
                        min-height: 40px;
                        padding: 9px 10px;
                        font-size: 13px;
                        gap: 7px;
                    }

                    .news-quick-btn-icon {
                        width: 20px;
                        height: 20px;
                        flex-basis: 20px;
                    }

                    .news-quick-btn-icon svg,
                    .news-quick-read-btn svg,
                    .news-quick-audio-btn svg {
                        width: 16px !important;
                        height: 16px !important;
                        flex-basis: 16px !important;
                    }
                }


                /* Home refresh */
                .content-layout {
                    align-items: start;
                    min-width: 0;
                }

                .main-wrap,
                .main-column,
                .top-layout,
                .hero-news {
                    max-width: 100%;
                    min-width: 0;
                }

                .top-layout {
                    grid-template-columns: minmax(0, 1.34fr) minmax(318px, .66fr);
                    gap: 14px;
                    margin-bottom: 14px !important;
                }

                .hero-news {
                    min-height: 360px;
                    border: 1px solid rgba(15, 23, 42, .1);
                    border-radius: 10px;
                    overflow: hidden;
                    background: #111827;
                    box-shadow: 0 18px 46px rgba(15, 23, 42, .12);
                    isolation: isolate;
                }

                .hero-news::after {
                    display: none !important;
                }

                .hero-news-bg {
                    transform: none;
                    filter: saturate(1.04) contrast(1.02);
                    transition: transform .35s ease;
                }

                .hero-news:hover .hero-news-bg {
                    transform: scale(1.02);
                }

                .hero-news-overlay {
                    background: linear-gradient(90deg, rgba(2, 6, 23, .84) 0%, rgba(15, 23, 42, .64) 48%, rgba(15, 23, 42, .18) 100%);
                }

                .hero-content {
                    max-width: 760px;
                    padding: 26px;
                }

                .hero-kicker {
                    width: max-content;
                    max-width: 100%;
                    min-height: 30px;
                    padding: 0 10px;
                    border: 1px solid rgba(255, 255, 255, .24);
                    border-radius: 999px;
                    background: rgba(255, 255, 255, .14);
                    color: #fff;
                    font-size: 12px;
                    font-weight: 800;
                    letter-spacing: 0;
                }

                .hero-title {
                    max-width: 750px;
                    margin: 12px 0 0;
                    color: #fff;
                    font-size: 34px;
                    line-height: 1.08;
                    letter-spacing: 0;
                    height: auto;
                    overflow: visible;
                    overflow-wrap: anywhere;
                    word-break: normal;
                }

                .hero-desc {
                    display: -webkit-box !important;
                    max-width: 680px;
                    margin: 12px 0 0;
                    overflow: hidden;
                    color: rgba(255, 255, 255, .86);
                    font-size: 15px;
                    font-weight: 500;
                    line-height: 1.55;
                    -webkit-line-clamp: 3;
                    -webkit-box-orient: vertical;
                }

                .hero-meta {
                    margin-top: 16px;
                    gap: 8px;
                }

                .hero-meta span {
                    min-height: 32px;
                    padding: 0 11px;
                    border: 1px solid rgba(255, 255, 255, .18);
                    border-radius: 999px;
                    background: rgba(255, 255, 255, .12);
                    color: #fff;
                }

                .hero-action-row {
                    display: flex;
                    flex-wrap: wrap;
                    gap: 8px;
                    margin-top: 18px;
                }

                .hero-action {
                    display: inline-flex;
                    align-items: center;
                    justify-content: center;
                    gap: 7px;
                    min-height: 36px;
                    padding: 0 12px;
                    border: 1px solid rgba(255, 255, 255, .18);
                    border-radius: 999px;
                    background: rgba(255, 255, 255, .14);
                    color: #fff;
                    font-size: 13px;
                    font-weight: 850;
                    line-height: 1;
                    backdrop-filter: blur(10px);
                }

                .hero-action.primary {
                    border-color: #fff;
                    background: #fff;
                    color: #0f172a;
                }

                .hero-trust-row {
                    gap: 6px;
                    margin-top: 10px;
                }

                .hero-trust-row span {
                    min-height: 28px;
                    padding: 0 9px;
                    border: 1px solid rgba(255, 255, 255, .16);
                    background: rgba(255, 255, 255, .1);
                    font-size: 11.5px;
                }

                .trend-card {
                    display: flex;
                    flex-direction: column;
                    height: 100%;
                    padding: 14px;
                    border: 1px solid rgba(226, 232, 240, .95);
                    border-radius: 8px;
                    background: #fff;
                    box-shadow: 0 14px 34px rgba(15, 23, 42, .07);
                }

                .trend-head {
                    align-items: center;
                    margin-bottom: 10px;
                    padding-bottom: 10px;
                    border-bottom: 1px solid rgba(226, 232, 240, .86);
                }

                .trend-head span {
                    color: #0f172a;
                    font-size: 16px;
                    font-weight: 900;
                    letter-spacing: 0;
                }

                .trend-head a,
                .trend-foot-link {
                    display: inline-flex;
                    align-items: center;
                    gap: 4px;
                    color: #0f766e;
                    font-size: 12.5px;
                    font-weight: 850;
                    text-decoration: none;
                    white-space: nowrap;
                }

                .trend-list {
                    display: grid;
                    flex: 1;
                    gap: 8px;
                }

                .trend-item {
                    grid-template-columns: 68px minmax(0, 1fr);
                    align-items: center;
                    gap: 10px;
                    padding: 8px;
                    border: 1px solid rgba(226, 232, 240, .72);
                    border-radius: 8px;
                    background: #f8fafc;
                    transition: .16s ease;
                }

                .trend-item:hover {
                    transform: translateY(-1px);
                    border-color: rgba(15, 118, 110, .24);
                    background: #fff;
                    box-shadow: 0 10px 24px rgba(15, 23, 42, .07);
                }

                .trend-item .thumb,
                .trend-item .news-thumb-img {
                    width: 68px;
                    height: 54px;
                    border-radius: 6px;
                }

                .trend-item b {
                    color: #0f172a;
                    font-size: 13.5px;
                    font-weight: 850;
                    line-height: 1.35;
                    letter-spacing: 0;
                }

                .trend-item small {
                    margin-top: 4px;
                    color: #64748b;
                    font-weight: 650;
                }

                .trend-foot {
                    display: flex;
                    justify-content: flex-end;
                    margin-top: 10px;
                    padding-top: 10px;
                    border-top: 1px solid rgba(226, 232, 240, .86);
                }

                .section-title,
                .section-kicker,
                .section-desc,
                .market-post-title,
                .compact-item b {
                    letter-spacing: 0;
                }

                .section-card.home-market,
                .info-card {
                    border: 1px solid rgba(226, 232, 240, .95);
                    border-radius: 8px;
                    background: #fff;
                    box-shadow: none;
                }

                .section-card.home-market {
                    padding: 16px;
                }

                .market-category-grid {
                    gap: 8px;
                    grid-template-columns: repeat(6, minmax(0, 1fr));
                }

                .market-category {
                    min-height: 98px;
                    padding: 11px;
                    border-color: transparent;
                    border-radius: 8px;
                    background: #f8fafc;
                }

                .market-category:hover {
                    transform: translateY(-1px);
                    background: #fff;
                    box-shadow: 0 10px 24px rgba(15, 23, 42, .06);
                }

                .market-listing-grid {
                    gap: 10px;
                }

                .market-post-card {
                    padding: 8px;
                    border-radius: 8px;
                    box-shadow: none;
                }

                .market-post-card:hover {
                    transform: translateY(-1px);
                    box-shadow: 0 12px 26px rgba(15, 23, 42, .07);
                }

                .market-post-image {
                    border-radius: 6px;
                }

                .market-post-title {
                    min-height: 38px;
                    font-size: 14px;
                    line-height: 1.35;
                }

                .market-post-price {
                    font-size: 14px;
                }

                .market-post-meta {
                    font-size: 11.5px;
                }

                .right-column {
                    align-self: start;
                }

                .info-card {
                    padding: 14px;
                }

                .compact-list {
                    gap: 8px;
                }

                .compact-item {
                    padding: 10px;
                    border: 1px solid transparent;
                    border-radius: 8px;
                    background: #f8fafc;
                }

                .compact-item:hover {
                    transform: translateY(-1px);
                    border-color: rgba(15, 118, 110, .22);
                    background: #fff;
                    box-shadow: 0 10px 24px rgba(15, 23, 42, .06);
                }

                .compact-item .service-icon {
                    width: 38px;
                    height: 38px;
                    border-radius: 8px;
                }

                .local-side-more {
                    border-radius: 8px;
                }

                @media (min-width: 1200px) {
                    .right-column {
                        position: sticky;
                        top: 88px;
                    }
                }

                @media (max-width: 1199px) {
                    .top-layout {
                        grid-template-columns: 1fr;
                    }

                    .hero-news {
                        min-height: 340px;
                    }

                    .trend-list {
                        grid-template-columns: repeat(2, minmax(0, 1fr));
                    }

                    .right-column {
                        position: static;
                    }
                }

                @media (max-width: 991px) {
                    .market-category-grid {
                        grid-template-columns: repeat(3, minmax(0, 1fr));
                    }
                }

                @media (max-width: 767px) {
                    .main-wrap {
                        overflow-x: hidden;
                        padding-bottom: 132px;
                    }

                    .content-layout,
                    .main-column,
                    .top-layout,
                    .hero-news,
                    .hero-content {
                        width: 100%;
                        max-width: 100%;
                        min-width: 0;
                    }

                    .top-layout {
                        gap: 10px;
                        margin-bottom: 12px !important;
                    }

                    .hero-news {
                        min-height: 292px;
                        border-radius: 8px;
                    }

                    .hero-content {
                        padding: 16px;
                    }

                    .hero-title {
                        max-width: calc(100vw - 56px);
                        font-size: 22px;
                        line-height: 1.14;
                        height: auto;
                        overflow: visible;
                        overflow-wrap: break-word;
                    }

                    .hero-desc {
                        font-size: 13.5px;
                        -webkit-line-clamp: 2;
                    }

                    .hero-action-row {
                        margin-top: 12px;
                    }

                    .hero-action {
                        min-height: 34px;
                        padding: 0 10px;
                        font-size: 12px;
                    }

                    .hero-trust-row {
                        display: none;
                    }

                    .trend-list {
                        grid-template-columns: 1fr;
                    }

                    .trend-item {
                        grid-template-columns: 58px minmax(0, 1fr);
                        gap: 8px;
                        padding: 7px;
                    }

                    .trend-item:nth-child(n+4) {
                        display: none;
                    }

                    .trend-item .thumb,
                    .trend-item .news-thumb-img {
                        width: 58px;
                        height: 48px;
                    }

                    .section-card.home-market {
                        padding: 12px;
                    }

                    .market-category-grid {
                        grid-template-columns: repeat(2, minmax(0, 1fr));
                    }

                    .market-listing-grid {
                        grid-template-columns: 1fr;
                    }
                }

/* ========================================================================== */
/* Source: app/views/UI/home2.php block 1 */
.section-category {
        margin: 40px 0;
    }

    .section-category .swiper {
        padding: 20px 0;
    }

    .section-category .swiper-slide {
        text-align: center;
    }

    .section-category .item-image img {
        width: 100px;
        height: 100px;
        object-fit: contain;
        margin: auto;
    }

    .section-category .item-title {
        margin-top: 8px;
        font-size: 14px;
        font-weight: 500;
    }

/* ========================================================================== */
/* Source: app/views/UI/news.php block 1 */
.news-trust-panel {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
        margin: 12px 0 16px;
    }

    .news-trust-panel > div {
        display: grid;
        grid-template-columns: 42px minmax(0, 1fr);
        gap: 10px;
        align-items: center;
        min-height: 86px;
        padding: 12px;
        border: 1px solid rgba(226, 232, 240, .92);
        border-radius: 18px;
        background: #fff;
        box-shadow: 0 10px 22px rgba(15, 23, 42, .035);
    }

    .news-trust-panel span {
        grid-row: span 2;
        width: 42px;
        height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 16px;
        background: #ecfdf5;
        color: #0f766e;
        font-size: 20px;
    }

    .news-trust-panel b {
        min-width: 0;
        color: #0f172a;
        font-size: 14px;
        font-weight: 900;
        line-height: 1.25;
    }

    .news-trust-panel small {
        min-width: 0;
        color: #64748b;
        font-size: 12px;
        font-weight: 600;
        line-height: 1.4;
    }

    .news-quick-toolbar {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        flex-wrap: wrap;
        margin: 10px 0 12px;
    }

    .news-quick-title { display: none !important; }

    .news-quick-read-btn,
    .news-quick-audio-btn {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        gap: 9px;
        min-width: 178px;
        min-height: 42px;
        padding: 10px 16px;
        border: 1px solid rgba(15, 23, 42, .08);
        border-radius: 999px;
        background: linear-gradient(135deg, #0f172a, #1e293b);
        color: #fff;
        font-size: 14px;
        font-weight: 850;
        line-height: 1;
        cursor: pointer;
        box-shadow: 0 12px 26px rgba(15, 23, 42, .16);
        transition: transform .16s ease, box-shadow .16s ease, background .16s ease, opacity .16s ease;
        text-decoration: none;
        white-space: nowrap;
    }

    .news-quick-read-btn:hover,
    .news-quick-audio-btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 16px 32px rgba(15, 23, 42, .22);
    }

    .news-quick-audio-btn.is-playing {
        background: linear-gradient(135deg, #0f766e, #0d9488);
        box-shadow: 0 14px 30px rgba(13, 148, 136, .24);
    }

    .news-quick-btn-icon {
        width: 22px;
        height: 22px;
        flex: 0 0 22px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        background: rgba(255, 255, 255, .13);
    }

    .news-quick-btn-icon svg,
    .news-quick-read-btn svg,
    .news-quick-audio-btn svg {
        width: 17px !important;
        height: 17px !important;
        flex: 0 0 17px !important;
        display: block;
    }

    .news-quick-read-box {
        position: relative;
        display: block;
    }

    .news-quick-read-box[hidden],
    .news-quick-audio-box[hidden],
    .news-quick-audio-player[hidden],
    .news-quick-audio-note[hidden] {
        display: none !important;
    }

    .news-quick-audio-box {
        order: 1;
        width: 100%;
        margin: 0 0 12px;
        padding: 10px;
        border-radius: 18px;
        background: rgba(15, 23, 42, .045);
        border: 1px solid rgba(148, 163, 184, .26);
    }

    .news-quick-audio-player {
        width: 100%;
        display: block;
        border-radius: 999px;
    }

    .news-quick-audio-note {
        margin-top: 8px;
        color: #64748b;
        font-size: 13px;
        font-weight: 600;
    }

    .news-quick-read-answer {
        order: 2;
    }

    @media (max-width: 991px) {
        .news-trust-panel {
            grid-template-columns: 1fr;
        }
    }

    @media (max-width: 575px) {
        .news-trust-panel {
            grid-template-columns: 1fr;
        }

        .news-trust-panel > div {
            min-height: 0;
        }

        .news-quick-toolbar {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 8px;
        }

        .news-quick-read-btn,
        .news-quick-audio-btn {
            min-width: 0;
            width: 100%;
            min-height: 40px;
            padding: 9px 10px;
            font-size: 13px;
            gap: 7px;
        }

        .news-quick-btn-icon {
            width: 20px;
            height: 20px;
            flex-basis: 20px;
        }

        .news-quick-btn-icon svg,
        .news-quick-read-btn svg,
        .news-quick-audio-btn svg {
            width: 16px !important;
            height: 16px !important;
            flex-basis: 16px !important;
        }
    }

/* ========================================================================== */
/* Source: app/views/UI/read.php block 1 */
.read-source-main strong {
        display: block;
    }

    .read-source-main span {
        display: block;
        margin-top: 2px;
        color: #64748b;
        font-size: 12px;
        line-height: 1.35;
        word-break: break-word;
    }

    .read-ai-guard {
        width: 100%;
        display: grid;
        grid-template-columns: 38px minmax(0, 1fr);
        gap: 10px;
        align-items: start;
        margin-top: 12px;
        padding: 12px;
        border: 1px solid rgba(15, 118, 110, .16);
        border-radius: 18px;
        background: #ecfdf5;
        color: #0f172a;
    }

    .read-ai-guard > span {
        width: 38px;
        height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 14px;
        background: #0f766e;
        color: #fff;
    }

    .read-ai-guard svg {
        width: 19px;
        height: 19px;
    }

    .read-ai-guard b {
        display: block;
        font-size: 14px;
        font-weight: 900;
        line-height: 1.3;
    }

    .read-ai-guard small {
        display: block;
        margin-top: 4px;
        color: #475569;
        font-size: 12.5px;
        font-weight: 600;
        line-height: 1.45;
    }

    .read-quick-toolbar {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        flex-wrap: wrap;
        margin-bottom: 10px;
    }

    .read-quick-title { display: none !important; }

    .read-quick-read-btn,
    .read-quick-audio-btn {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        gap: 9px;
        min-width: 178px;
        min-height: 42px;
        padding: 10px 16px;
        border: 1px solid rgba(15, 23, 42, .08);
        border-radius: 999px;
        background: linear-gradient(135deg, #0f172a, #1e293b);
        color: #fff;
        font-size: 14px;
        font-weight: 850;
        line-height: 1;
        cursor: pointer;
        box-shadow: 0 12px 26px rgba(15, 23, 42, .16);
        transition: transform .16s ease, box-shadow .16s ease, background .16s ease, opacity .16s ease;
        text-decoration: none;
        white-space: nowrap;
    }

    .read-quick-read-btn:hover,
    .read-quick-audio-btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 16px 32px rgba(15, 23, 42, .22);
    }

    .read-quick-audio-btn.is-disabled,
    .read-quick-audio-btn:disabled {
        cursor: not-allowed !important;
        opacity: .68 !important;
        transform: none !important;
        box-shadow: none !important;
        background: #64748b !important;
    }

    .read-quick-audio-btn.is-playing {
        background: linear-gradient(135deg, #0f766e, #0d9488);
        box-shadow: 0 14px 30px rgba(13, 148, 136, .24);
    }

    .read-quick-btn-icon {
        width: 22px;
        height: 22px;
        flex: 0 0 22px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        background: rgba(255, 255, 255, .13);
    }

    .read-quick-btn-icon svg,
    .read-quick-read-btn svg,
    .read-quick-audio-btn svg {
        width: 17px;
        height: 17px;
        flex: 0 0 17px;
        display: block;
    }

    .read-quick-read-content {
        display: block;
    }

    .read-quick-read-content[hidden],
    .read-quick-audio-box[hidden],
    .read-ai-note[hidden] {
        display: none !important;
    }

    .read-ai-note {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 7px 10px;
        margin: 13px 0 0;
        padding-top: 12px;
        border-top: 1px solid #e2e8f0;
        color: #64748b;
        font-size: 13px;
        line-height: 1.55;
        font-weight: 700;
    }

    .read-ai-note a {
        color: #2563eb;
        font-weight: 850;
        text-decoration: none;
    }

    .read-ai-note a:hover {
        text-decoration: underline;
    }

    .read-quick-audio-box {
        width: 100%;
        margin: 0 0 12px;
        padding: 10px;
        border-radius: 18px;
        background: rgba(15, 23, 42, .045);
        border: 1px solid rgba(148, 163, 184, .26);
    }

    .read-quick-audio-player {
        width: 100%;
        display: block;
        border-radius: 999px;
    }

    @media (max-width: 575px) {
        .read-quick-toolbar {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 8px;
        }

        .read-quick-read-btn,
        .read-quick-audio-btn {
            min-width: 0;
            width: 100%;
            min-height: 40px;
            padding: 9px 10px;
            font-size: 13px;
            gap: 7px;
        }

        .read-quick-btn-icon {
            width: 20px;
            height: 20px;
            flex-basis: 20px;
        }

        .read-quick-btn-icon svg,
        .read-quick-read-btn svg,
        .read-quick-audio-btn svg {
            width: 16px;
            height: 16px;
            flex-basis: 16px;
        }
    }

/* ========================================================================== */
/* Source: app/views/UI/Ads/create.php block 1 */
.market-compose-guide {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
    }

    .market-compose-guide div {
        display: flex;
        align-items: center;
        gap: 8px;
        min-height: 44px;
        padding: 10px 12px;
        border: 1px solid rgba(226, 232, 240, .92);
        border-radius: 16px;
        background: #f8fafc;
        color: #334155;
        font-size: 13px;
        font-weight: 700;
    }

    .market-compose-guide i {
        color: var(--lc-brand);
        font-size: 17px;
    }

    .market-input-hint {
        display: block;
        margin-top: 7px;
        color: #64748b;
        font-size: 12.5px;
        font-weight: 600;
        line-height: 1.45;
    }

    .market-compose-steps {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
    }

    .market-compose-steps div {
        min-height: 108px;
        padding: 13px;
        border: 1px solid rgba(226, 232, 240, .92);
        border-radius: 18px;
        background: linear-gradient(180deg, #ffffff, #f8fafc);
    }

    .market-compose-steps b {
        width: 30px;
        height: 30px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        background: #0f766e;
        color: #fff;
        font-size: 13px;
        font-weight: 900;
    }

    .market-compose-steps span {
        display: block;
        margin-top: 9px;
        color: #0f172a;
        font-size: 13.5px;
        font-weight: 900;
        line-height: 1.3;
    }

    .market-compose-steps small {
        display: block;
        margin-top: 5px;
        color: #64748b;
        font-size: 12px;
        font-weight: 600;
        line-height: 1.45;
    }

    .market-image-preview {
        position: relative;
        width: 92px;
        height: 92px;
        overflow: hidden;
        border: 1px solid rgba(226, 232, 240, .95);
        border-radius: 16px;
        background: #f8fafc;
    }

    .market-image-preview img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

    .market-image-preview button {
        position: absolute;
        top: 5px;
        right: 5px;
        width: 24px;
        height: 24px;
        border: 0;
        border-radius: 999px;
        background: rgba(15, 23, 42, .72);
        color: #fff;
        line-height: 1;
    }

    .market-image-preview span {
        position: absolute;
        left: 6px;
        bottom: 6px;
        min-height: 20px;
        padding: 0 7px;
        border-radius: 999px;
        background: rgba(236, 253, 245, .94);
        color: #0f766e;
        font-size: 10.5px;
        font-weight: 800;
        line-height: 20px;
    }

    .market-form-notice {
        padding: 12px 14px;
        border-radius: 16px;
        background: #ecfdf5;
        color: #0f766e;
        font-size: 13.5px;
        font-weight: 700;
        line-height: 1.5;
    }

    .market-form-notice.is-error {
        background: #fff7ed;
        color: #b45309;
    }

    @media (max-width: 767px) {
        .market-compose-guide,
        .market-compose-steps {
            grid-template-columns: 1fr;
        }

        .market-compose-steps div {
            min-height: 0;
        }
    }

/* ========================================================================== */
/* Source: app/views/UI/Ads/edit.php block 1 */
.select-group option{padding:5px;font-size:18px;margin-right: 3px}
    .select-group{cursor:pointer;border:1px solid #e0e0e0;padding:3px;margin-bottom:15px;border-radius:7px;line-height:20px;height:158px;}

    .preview-inside{position:absolute;left:10px;right:10px;bottom:5px;display:flex;flex-wrap:wrap;gap:8px;}
    .preview-inside .img-wrapper { position: relative; width: 80px; height: 80px; border-radius: 2px; border: 1px solid #e9e9e9; background: #f8f9fa; overflow: hidden; }
    .preview-inside img{width:100%;height:100%;object-fit:cover;}
    .preview-inside .remove-btn { position: absolute; top: -4px; right: -2px; background: transparent; color: #f00; border: none; border-radius: 50%; width: 20px; height: 20px; line-height: 17px; font-size: 20px; cursor: pointer; }
    .preview-inside .main-label{position:absolute;bottom:0;left:0;right:0;background:rgb(0 0 0 / 80%);color:#fff;font-size:9px;text-align:center;padding: 0;}
    .preview-inside .set-main{position:absolute;bottom:0;left:0;right:0;background:rgb(0 0 0 / 80%);color:#fff;font-size:9px;text-align:center;padding: 0;cursor:pointer;display:none;}
    .img-wrapper:hover .set-main{display:block;}
    .add-image-btn{border:0;font-weight:bold;font-size:12px;position:absolute;right:5px;bottom:5px;}

/* ========================================================================== */
/* Source: app/views/UI/Display/posts/detail.php block 1 */
.detail-gallery {
        position: relative;
        overflow: hidden;
        border-radius: 24px;
        background: #020617;
    }

    .detail-image-slider,
    .detail-image-slider .swiper-slide {
        width: 100%;
        background: #020617;
    }

    .detail-image-slider .swiper-slide a {
        display: block;
        width: 100%;
        aspect-ratio: 16 / 10;
        background: #020617;
    }

    .detail-image-slider img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: contain;
        background: #020617;
    }

    .detail-image-slider .swiper-pagination {
        left: auto;
        right: 14px;
        bottom: 14px;
        width: auto;
        min-width: 54px;
        height: 28px;
        padding: 0 10px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 999px;
        background: rgba(15, 23, 42, .72);
        color: #fff;
        font-size: 12px;
        font-weight: 800;
        backdrop-filter: blur(8px);
    }

    .detail-image-slider .swiper-button-prev,
    .detail-image-slider .swiper-button-next {
        width: 40px;
        height: 40px;
        border-radius: 999px;
        background: rgba(255, 255, 255, .94);
        color: #0f172a;
        box-shadow: 0 10px 24px rgba(15, 23, 42, .22);
    }

    .detail-image-slider .swiper-button-prev::after,
    .detail-image-slider .swiper-button-next::after {
        font-size: 15px;
        font-weight: 900;
    }

    .detail-gallery-badge {
        position: absolute;
        left: 14px;
        bottom: 14px;
        z-index: 5;
        min-height: 28px;
        padding: 0 11px;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        border-radius: 999px;
        background: rgba(15, 23, 42, .72);
        color: #fff;
        font-size: 12px;
        font-weight: 800;
        backdrop-filter: blur(8px);
    }

    .detail-desc {
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: #334155;
        font-size: 15px;
        font-weight: 500;
        line-height: 1.75;
        word-break: break-word;
    }

    .section-card .price {
        color: #b45309;
        font-weight: 900;
    }

    .seller-card {
        position: sticky;
        top: 104px;
    }

    .seller-head {
        display: flex;
        align-items: center;
        gap: 14px;
        padding: 16px;
        border-radius: 22px;
        background: linear-gradient(135deg, #ffffff, #ecfdf5);
        border: 1px solid rgba(226, 232, 240, .92);
    }

    .seller-head-link {
        text-decoration: none;
        color: inherit;
        transition: box-shadow .18s ease, border-color .18s ease;
    }

    .seller-head-link:hover {
        border-color: rgba(8, 112, 95, .35);
        box-shadow: 0 8px 18px rgba(15, 23, 42, .08);
    }

    .detail-main-head {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        column-gap: 10px;
        row-gap: 8px;
    }

    .detail-main-head > .section-title {
        order: 2;
        margin: 0;
        min-width: 0;
        flex: 1 1 calc(100% - 56px);
    }

    .lc-save-inline {
        order: 1;
        width: 42px;
        min-width: 42px;
        min-height: 42px;
        padding: 0;
        border-radius: 999px;
    }

    .lc-save-inline b {
        display: none;
    }

    .lc-save-inline i {
        font-size: 18px;
    }

    .detail-main-price {
        order: 3;
        flex: 1 0 100%;
        margin-top: 2px;
        color: #dc2626;
        font-size: clamp(24px, 3.1vw, 34px);
        font-weight: 900;
        line-height: 1.1;
    }

    .seller-phone {
        margin: 0;
        padding: 16px;
        border-radius: 20px;
        background: #f8fafc;
        color: #0f172a;
        font-size: 20px;
        font-weight: 900;
        text-align: center;
        letter-spacing: .02em;
    }

    .seller-phone.is-empty {
        min-height: 84px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 14px 16px;
        font-size: 17px;
        font-weight: 800;
        line-height: 1.35;
    }

    .seller-login-hint {
        display: block;
        margin-top: 10px;
        color: #64748b;
        font-size: 12px;
        line-height: 1.45;
        text-align: center;
    }

    .seller-contact-row {
        margin-top: 14px;
        display: grid;
        gap: 12px;
    }

    .seller-contact-row.has-chat {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .market-seller-facts {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
        margin-top: 12px;
    }

    .market-seller-facts span {
        min-width: 0;
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        padding: 8px;
        border-radius: 16px;
        background: #f8fafc;
        color: #475569;
        font-size: 12px;
        font-weight: 800;
        text-align: center;
        line-height: 1.3;
        overflow: hidden;
    }

    .market-seller-facts i {
        color: #0f766e;
    }

    .market-safe-card {
        color: #334155;
    }

    .market-safe-list {
        display: grid;
        gap: 8px;
        margin: 10px 0 0;
        padding: 0;
        list-style: none;
    }

    .market-safe-list li {
        position: relative;
        margin: 0;
        padding: 10px 12px 10px 36px;
        border: 1px solid rgba(226, 232, 240, .95);
        border-radius: 12px;
        background: #f8fafc;
        color: #334155;
        font-size: 13px;
        font-weight: 600;
        line-height: 1.5;
    }

    .market-safe-list li::before {
        content: "";
        position: absolute;
        left: 16px;
        top: 15px;
        width: 6px;
        height: 6px;
        border-radius: 999px;
        background: #0f766e;
    }

    @media (max-width: 991px) {
        .seller-card {
            position: static;
        }
    }

    @media (max-width: 767px) {
        .detail-image-slider .swiper-slide a {
            aspect-ratio: 4 / 3;
        }

        .detail-image-slider .swiper-button-prev,
        .detail-image-slider .swiper-button-next {
            display: none;
        }

        .detail-desc {
            padding: 0;
            border-radius: 0;
            font-size: 14px;
        }

        .seller-phone {
            font-size: 19px;
        }

        .seller-contact-row.has-chat {
            grid-template-columns: 1fr;
        }

        .market-seller-facts {
            grid-template-columns: 1fr;
        }

        .market-safe-list li {
            padding: 9px 11px 9px 34px;
            font-size: 12.5px;
            line-height: 1.45;
            border-radius: 11px;
        }
    }

/* ========================================================================== */
/* Source: app/views/UI/Display/posts/list.php block 1 */
.market-list-head {
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
        gap: 14px;
        margin-bottom: 16px;
    }

    .market-cate-strip {
        display: flex;
        gap: 10px;
        overflow-x: auto;
        padding: 2px 2px 8px;
        scrollbar-width: thin;
        scroll-snap-type: x mandatory;
    }

    .market-trust-strip {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-bottom: 14px;
    }

    .market-trust-strip span {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        min-height: 30px;
        padding: 0 11px;
        border-radius: 999px;
        background: #f8fafc;
        color: #475569;
        font-size: 12.5px;
        font-weight: 700;
    }

    .market-trust-strip i {
        color: var(--lc-brand);
    }

    .market-action-panel {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        margin-bottom: 14px;
        padding: 14px;
        border-radius: 18px;
        background: linear-gradient(135deg, #0f172a, #164e63);
        color: #fff;
    }

    .market-action-panel b {
        display: block;
        font-size: 15px;
        font-weight: 900;
        line-height: 1.3;
    }

    .market-action-panel small {
        display: block;
        margin-top: 5px;
        color: rgba(255, 255, 255, .78);
        font-size: 12.5px;
        font-weight: 600;
        line-height: 1.45;
    }

    .market-action-panel a {
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        min-height: 42px;
        padding: 0 16px;
        border-radius: 999px;
        background: #fff;
        color: #0f172a;
        font-size: 13px;
        font-weight: 900;
        text-decoration: none;
    }

    .market-cate-pill {
        min-width: 152px;
        flex: 0 0 auto;
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 10px;
        border: 1px solid rgba(226, 232, 240, .95);
        border-radius: 18px;
        background: rgba(255, 255, 255, .86);
        box-shadow: 0 8px 20px rgba(15, 23, 42, .035);
        transition: .16s ease;
        scroll-snap-align: start;
    }

    .market-cate-pill:hover,
    .market-cate-pill.active {
        transform: translateY(-2px);
        border-color: rgba(11, 122, 101, .28);
        background: linear-gradient(135deg, #ffffff, #ecfdf5);
        box-shadow: 0 14px 28px rgba(11, 122, 101, .10);
    }

    .market-cate-pill.active {
        outline: 2px solid rgba(11, 122, 101, .10);
    }

    .market-cate-pill .service-icon {
        width: 42px;
        height: 42px;
        border-radius: 16px;
        font-size: 18px;
    }

    .market-cate-pill .service-icon img {
        width: 24px;
        height: 24px;
        object-fit: contain;
        display: block;
    }

    .market-cate-pill b {
        display: block;
        color: #0f172a;
        font-size: 13.5px;
        font-weight: 800;
        line-height: 1.2;
        white-space: nowrap;
    }

    .market-cate-pill small {
        display: block;
        margin-top: 2px;
        color: #64748b;
        font-size: 11.5px;
        font-weight: 600;
        white-space: nowrap;
    }

    .market-card {
        height: 100%;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        border: 1px solid rgba(226, 232, 240, .92);
        border-radius: 22px;
        background: #fff;
        box-shadow: 0 10px 22px rgba(15, 23, 42, .035);
        transition: .16s ease;
    }

    .market-card:hover {
        transform: translateY(-3px);
        border-color: rgba(11, 122, 101, .24);
        box-shadow: 0 18px 34px rgba(15, 23, 42, .08);
    }

    .market-card-img {
        position: relative;
        display: block;
        aspect-ratio: 4 / 3;
        overflow: hidden;
        background: #e2e8f0;
    }

    .market-card-img img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
        transition: transform .22s ease;
    }

    .market-card:hover .market-card-img img {
        transform: scale(1.04);
    }

    .market-card-count {
        position: absolute;
        right: 9px;
        bottom: 9px;
        display: inline-flex;
        align-items: center;
        gap: 4px;
        min-height: 25px;
        padding: 0 9px;
        border-radius: 999px;
        background: rgba(15, 23, 42, .76);
        color: #fff;
        font-size: 12px;
        font-weight: 800;
        backdrop-filter: blur(8px);
    }

    .market-card-body {
        flex: 1;
        display: flex;
        flex-direction: column;
        padding: 12px;
    }

    .market-card-body strong {
        min-height: 40px;
        color: var(--lc-text);
        font-size: 14px;
        font-weight: 700;
        line-height: 1.38;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .market-card-price {
        margin-top: 8px;
        color: #b45309;
        font-size: 16px;
        font-weight: 800;
    }

    .market-card-trust {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        width: fit-content;
        min-height: 24px;
        margin-top: 8px;
        padding: 0 9px;
        border-radius: 999px;
        background: #ecfdf5;
        color: #0f766e;
        font-size: 11.5px;
        font-weight: 800;
    }

    .market-card-meta {
        display: grid;
        gap: 5px;
        margin-top: auto;
        padding-top: 10px;
        color: var(--lc-muted);
        font-size: 12px;
        font-weight: 600;
    }

    .market-card-meta span {
        min-width: 0;
        display: flex;
        align-items: center;
        gap: 5px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    @media (max-width: 767px) {
        .market-list-head {
            align-items: flex-start;
        }

        .market-action-panel {
            display: block;
        }

        .market-action-panel a {
            width: 100%;
            margin-top: 12px;
        }

        .market-cate-pill {
            min-width: 136px;
        }
    }

    @media (max-width: 479px) {
        .market-cate-strip {
            gap: 8px;
        }

        .market-cate-pill {
            min-width: 124px;
            padding: 8px;
            border-radius: 16px;
        }

        .market-cate-pill .service-icon {
            width: 36px;
            height: 36px;
            border-radius: 14px;
            font-size: 16px;
        }

        .market-cate-pill b {
            font-size: 12.5px;
        }

        .market-cate-pill small {
            display: none;
        }

        .market-card {
            border-radius: 18px;
        }

        .market-card-body {
            padding: 9px;
        }

        .market-card-body strong {
            min-height: 38px;
            font-size: 13px;
        }

        .market-card-price {
            font-size: 14px;
        }

        .market-card-meta {
            font-size: 11px;
        }
    }

/* ========================================================================== */
/* Source: app/views/UI/post-ai.php block 1 */
body.page-ui-post-ai {
            --lc-primary: #0f766e;
            --lc-primary-2: #14b8a6;
            --lc-text: #0f172a;
            --lc-muted: #64748b;
            --lc-border: rgba(15, 23, 42, .08);
            --lc-bg: #f8fafc;
            --lc-card: #ffffff;
        }

        body.page-ui-post-ai * { box-sizing: border-box; }

        body.page-ui-post-ai {
            margin: 0;
            min-height: 100vh;
            overflow-x: hidden;
            background: linear-gradient(180deg, #f8fafc 0%, #eef6f3 46%, #ffffff 100%);
            color: var(--lc-text);
            font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
        }

        body.page-ui-post-ai a { color: inherit; }

        .chat-page {
            min-height: 100vh;
            overflow-x: hidden;
            padding: 18px 12px 24px;
        }

        .chat-shell {
            width: min(940px, 100%);
            margin: 0 auto;
            display: grid;
            grid-template-columns: 1fr;
            gap: 0;
        }

        .chat-main {
            border: 1px solid var(--lc-border);
            border-radius: 18px;
            background: #fff;
            box-shadow: 0 18px 42px rgba(15, 23, 42, .08);
            overflow: hidden;
        }

        .chat-main {
            display: flex;
            flex-direction: column;
            min-height: calc(100vh - 42px);
            min-width: 0;
        }

        .chat-hero {
            padding: 12px 14px;
            border-bottom: 1px solid var(--lc-border);
            background: #fff;
            color: var(--lc-text);
        }

        .chat-hero-top {
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 12px;
        }

        .chat-kicker {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            margin-bottom: 0;
            padding: 0;
            border-radius: 999px;
            background: transparent;
            color: var(--lc-primary);
            font-size: 12px;
            font-weight: 900;
            letter-spacing: 0;
            text-transform: none;
        }

        .chat-title {
            margin: 0;
            font-size: 18px;
            line-height: 1.2;
            font-weight: 900;
            letter-spacing: 0;
        }

        .chat-desc {
            max-width: 680px;
            margin: 8px 0 0;
            color: var(--lc-muted);
            font-size: 14px;
            line-height: 1.55;
            font-weight: 600;
        }

        .chat-trust {
            display: none;
            flex-wrap: wrap;
            gap: 7px;
            margin-top: 12px;
        }

        .chat-trust span {
            display: inline-flex;
            align-items: center;
            min-height: 28px;
            padding: 0 10px;
            border-radius: 999px;
            background: rgba(255, 255, 255, .16);
            color: rgba(255, 255, 255, .92);
            font-size: 12px;
            font-weight: 850;
        }

        .chat-actions {
            display: flex;
            gap: 8px;
            flex-shrink: 0;
        }

        .chat-hero-top > div:first-child {
            min-width: 0;
        }

        .chat-action-btn {
            width: 36px;
            height: 36px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 0;
            border: 1px solid rgba(15, 23, 42, .1);
            border-radius: 999px;
            background: #f8fafc;
            color: #334155;
            font-size: 16px;
            cursor: pointer;
        }

        .chat-action-btn:hover {
            background: #ecfdf5;
            color: var(--lc-primary);
        }

        .chat-body {
            flex: 1;
            padding: 16px;
            overflow-y: auto;
        }

        .chat-messages {
            display: grid;
            gap: 12px;
        }

        .msg {
            display: flex;
            gap: 9px;
            align-items: flex-start;
        }

        .msg.user {
            justify-content: flex-end;
        }

        .msg-avatar {
            width: 34px;
            height: 34px;
            flex: 0 0 34px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 999px;
            background: #ecfdf5;
            color: var(--lc-primary);
            font-size: 12px;
            font-weight: 950;
        }

        .msg.user .msg-avatar {
            display: none;
        }

        .msg-bubble {
            max-width: min(720px, 88%);
            padding: 12px 14px;
            border-radius: 18px;
            background: #f1f5f9;
            color: #334155;
            font-size: 14px;
            line-height: 1.55;
            font-weight: 600;
            overflow-wrap: anywhere;
        }

        .msg.user .msg-bubble {
            background: var(--lc-primary);
            color: #fff;
            border-bottom-right-radius: 7px;
        }

        .msg.bot .msg-bubble {
            border-bottom-left-radius: 7px;
        }

        .msg-time {
            display: block;
            margin-top: 7px;
            color: #94a3b8;
            font-size: 11px;
            font-weight: 700;
        }

        .msg.user .msg-time {
            color: rgba(255, 255, 255, .72);
        }

        .answer-meta {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            margin-top: 10px;
        }

        .answer-chip,
        .answer-note {
            display: inline-flex;
            align-items: center;
            min-height: 27px;
            padding: 5px 9px;
            border-radius: 999px;
            background: #ffffff;
            color: #475569;
            border: 1px solid rgba(148, 163, 184, .24);
            font-size: 11.5px;
            line-height: 1.25;
            font-weight: 850;
        }

        .answer-note {
            border-radius: 13px;
            background: #f8fafc;
            color: #64748b;
        }

        .result-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 10px;
            margin-top: 11px;
        }

        .result-card {
            display: grid;
            grid-template-columns: 82px minmax(0, 1fr);
            gap: 10px;
            padding: 9px;
            border: 1px solid var(--lc-border);
            border-radius: 18px;
            background: #fff;
            text-decoration: none;
            box-shadow: 0 8px 22px rgba(15, 23, 42, .05);
            transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
        }

        .result-card:hover {
            transform: translateY(-2px);
            border-color: rgba(20, 184, 166, .32);
            box-shadow: 0 14px 30px rgba(15, 23, 42, .09);
        }

        .result-thumb {
            width: 82px;
            height: 82px;
            border-radius: 14px;
            background: #e2e8f0 center / cover no-repeat;
        }

        .result-info { min-width: 0; }

        .result-badge {
            display: inline-flex;
            max-width: 100%;
            margin-bottom: 5px;
            padding: 3px 7px;
            border-radius: 999px;
            background: #ecfdf5;
            color: var(--lc-primary);
            font-size: 11px;
            font-weight: 900;
        }

        .result-title {
            margin: 0;
            color: var(--lc-text);
            font-size: 13.5px;
            font-weight: 900;
            line-height: 1.35;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }

        .result-summary {
            margin: 4px 0 0;
            color: var(--lc-muted);
            font-size: 12px;
            line-height: 1.35;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }

        .result-meta {
            display: flex;
            flex-wrap: wrap;
            gap: 5px 8px;
            margin-top: 7px;
            color: #64748b;
            font-size: 11.5px;
            font-weight: 700;
        }

        .result-price {
            color: #dc2626;
            font-weight: 950;
        }

        .result-source {
            display: inline-flex;
            max-width: 100%;
            margin-top: 6px;
            color: #2563eb;
            font-size: 11.5px;
            font-weight: 850;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .result-cta {
            display: inline-flex;
            margin-top: 7px;
            color: var(--lc-primary);
            font-size: 12px;
            font-weight: 950;
        }

        .chat-input-wrap {
            padding: 12px 16px 14px;
            border-top: 1px solid var(--lc-border);
            background: #fff;
        }

        .chat-form {
            display: flex;
            gap: 8px;
            align-items: flex-end;
            width: min(760px, 100%);
            margin: 0 auto;
            padding: 8px;
            border: 1px solid rgba(15, 23, 42, .12);
            border-radius: 22px;
            background: #fff;
            box-shadow: 0 12px 34px rgba(15, 23, 42, .09);
        }

        .chat-attach {
            width: 48px;
            height: 48px;
            border: 0;
            border-radius: 14px;
            background: #f8fafc;
            color: var(--lc-primary);
            font-size: 20px;
            cursor: pointer;
        }

        .chat-attach.has-files {
            background: #ecfdf5;
            border-color: rgba(20, 184, 166, .38);
        }

        .chat-input {
            min-height: 48px;
            max-height: 130px;
            flex: 1;
            min-width: 0;
            resize: none;
            padding: 13px 8px;
            border: 0;
            border-radius: 0;
            outline: none;
            color: var(--lc-text);
            font-size: 15px;
            font-weight: 600;
            line-height: 1.4;
            background: #fff;
            overflow-wrap: break-word;
        }

        .chat-input:focus {
            box-shadow: none;
        }

        .chat-send {
            width: 48px;
            height: 48px;
            border: 0;
            border-radius: 14px;
            background: var(--lc-primary);
            color: #fff;
            font-size: 20px;
            box-shadow: 0 12px 28px rgba(15, 118, 110, .24);
            cursor: pointer;
        }

        .chat-send:disabled {
            opacity: .55;
            cursor: not-allowed;
        }

        .chat-hint {
            display: none;
            margin: 7px 3px 0;
            color: #64748b;
            font-size: 12px;
            line-height: 1.35;
            font-weight: 650;
        }

        .chat-file-preview {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            margin: 8px auto 0;
            padding: 6px 10px;
            border: 0;
            border-radius: 999px;
            background: #ecfdf5;
            color: #0f766e;
            font-size: 12px;
            font-weight: 850;
            cursor: pointer;
        }

        .market-draft {
            margin-top: 11px;
            padding: 12px;
            border: 1px solid rgba(20, 184, 166, .24);
            border-radius: 18px;
            background: #ffffff;
        }

        .market-draft h4 {
            margin: 0 0 8px;
            color: #0f172a;
            font-size: 14px;
            font-weight: 950;
        }

        .market-draft-grid {
            display: grid;
            gap: 7px;
            color: #475569;
            font-size: 12.5px;
            line-height: 1.35;
            font-weight: 700;
        }

        .market-draft-grid b {
            color: #0f172a;
            font-weight: 950;
        }

        .market-draft-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin-top: 11px;
        }

        .market-draft-action {
            min-height: 34px;
            padding: 0 12px;
            border: 0;
            border-radius: 999px;
            background: var(--lc-primary);
            color: #fff;
            font-size: 12.5px;
            font-weight: 900;
            cursor: pointer;
            text-decoration: none;
            display: inline-flex;
            align-items: center;
        }

        .market-draft-action.secondary {
            background: #f1f5f9;
            color: #334155;
        }

        .guide-panel {
            position: fixed;
            inset: 0;
            z-index: 1000;
            display: none;
            align-items: center;
            justify-content: center;
            padding: 18px;
            background: rgba(15, 23, 42, .42);
        }

        .guide-panel.active {
            display: flex;
        }

        .guide-card {
            width: min(520px, 100%);
            padding: 18px;
            border-radius: 16px;
            background: #fff;
            box-shadow: 0 24px 70px rgba(15, 23, 42, .22);
        }

        .guide-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            margin-bottom: 12px;
        }

        .guide-head h2 {
            margin: 0;
            font-size: 18px;
            font-weight: 900;
        }

        .guide-close {
            width: 34px;
            height: 34px;
            border: 0;
            border-radius: 999px;
            background: #f1f5f9;
            color: #334155;
            cursor: pointer;
        }

        .guide-list {
            display: grid;
            gap: 10px;
            margin: 0;
            padding: 0;
            list-style: none;
        }

        .guide-list li {
            display: grid;
            grid-template-columns: 34px minmax(0, 1fr);
            gap: 10px;
            padding: 10px;
            border-radius: 12px;
            background: #f8fafc;
            color: #334155;
            font-size: 13px;
            line-height: 1.45;
            font-weight: 650;
        }

        .guide-list b {
            width: 34px;
            height: 34px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 10px;
            background: #ecfdf5;
            color: var(--lc-primary);
        }

        .typing {
            display: inline-flex;
            align-items: center;
            gap: 5px;
        }

        .typing span {
            width: 6px;
            height: 6px;
            border-radius: 999px;
            background: #94a3b8;
            animation: typingDot 1s infinite ease-in-out;
        }

        .typing span:nth-child(2) { animation-delay: .15s; }
        .typing span:nth-child(3) { animation-delay: .3s; }

        @keyframes typingDot {
            0%, 80%, 100% { transform: translateY(0); opacity: .45; }
            40% { transform: translateY(-4px); opacity: 1; }
        }

        @media (max-width: 920px) {
            .chat-shell { grid-template-columns: 1fr; }
            .chat-main { min-height: calc(100vh - 18px); }
        }

        @media (max-width: 640px) {
            body.page-ui-post-ai,
            body.page-ui-post-ai .chat-page,
            body.page-ui-post-ai .chat-shell,
            body.page-ui-post-ai .chat-main {
                width: 100%;
                max-width: 100vw;
                overflow-x: hidden;
            }

            .chat-page { padding: 0; }
            .chat-shell { gap: 0; }
            .chat-main {
                border-radius: 0;
                border-left: 0;
                border-right: 0;
            }

            .chat-hero {
                position: relative;
                padding: 10px 92px 10px 12px;
            }

            .chat-hero-top {
                flex-direction: row;
                justify-content: flex-start;
                gap: 8px;
            }

            .chat-actions {
                position: static;
                width: auto;
                margin-left: 4px;
            }

            .chat-action-btn {
                flex: 0 0 36px;
            }

            .chat-body { padding: 12px; }
            .msg-bubble {
                max-width: calc(100vw - 78px);
                font-size: 13.5px;
            }
            .result-grid { grid-template-columns: 1fr; }

            .chat-input-wrap {
                position: fixed;
                left: 0;
                right: 0;
                width: 100dvw;
                bottom: 0;
                z-index: 30;
                padding: 10px 10px 12px;
                border-top: 1px solid rgba(15, 23, 42, .08);
                background: rgba(255, 255, 255, .96);
            }

            .chat-form {
                display: grid;
                grid-template-columns: 42px minmax(0, 1fr) 42px;
                align-items: end;
                width: min(370px, calc(100dvw - 20px));
                max-width: 100%;
                margin: 0;
                border-radius: 18px;
                padding: 6px;
            }

            .chat-main {
                padding-bottom: 86px;
            }

            .chat-attach,
            .chat-send {
                width: 42px;
                height: 42px;
            }

            .chat-input {
                width: 100%;
                min-height: 42px;
                padding: 10px 6px;
                font-size: 14px;
            }

            .guide-card {
                padding: 14px;
            }
        }

/* ========================================================================== */
/* Source: app/views/UI/chat-ai.php block 1 */
body.page-ui-chat-ai {
            --lc-primary: #0f766e;
            --lc-primary-2: #14b8a6;
            --lc-text: #0f172a;
            --lc-muted: #64748b;
            --lc-border: rgba(15, 23, 42, .08);
            --lc-bg: #f8fafc;
            --lc-card: #ffffff;
        }

        body.page-ui-chat-ai * { box-sizing: border-box; }

        body.page-ui-chat-ai {
            margin: 0;
            min-height: 100vh;
            background:
                    radial-gradient(circle at top left, rgba(20, 184, 166, .12), transparent 32%),
                    linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
            color: var(--lc-text);
            font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
        }

        body.page-ui-chat-ai a { color: inherit; }

        body.page-ui-chat-ai .chat-page {
            min-height: 100vh;
            padding: 18px 12px 24px;
        }

        body.page-ui-chat-ai .chat-shell {
            width: min(1080px, 100%);
            margin: 0 auto;
            display: grid;
            grid-template-columns: minmax(0, 1fr) 310px;
            gap: 16px;
        }

        body.page-ui-chat-ai .chat-main, body.page-ui-chat-ai .chat-side {
            border: 1px solid var(--lc-border);
            border-radius: 26px;
            background: rgba(255, 255, 255, .88);
            box-shadow: 0 18px 42px rgba(15, 23, 42, .07);
            backdrop-filter: blur(10px);
            overflow: hidden;
        }

        body.page-ui-chat-ai .chat-main {
            display: flex;
            flex-direction: column;
            min-height: calc(100vh - 42px);
        }

        body.page-ui-chat-ai .chat-hero {
            padding: 18px 20px 15px;
            background:
                    linear-gradient(135deg, rgba(15, 118, 110, .96), rgba(20, 184, 166, .88)),
                    radial-gradient(circle at top right, rgba(255, 255, 255, .22), transparent 42%);
            color: #fff;
        }

        body.page-ui-chat-ai .chat-hero-top {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 12px;
        }

        body.page-ui-chat-ai .chat-kicker {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            margin-bottom: 9px;
            padding: 6px 10px;
            border-radius: 999px;
            background: rgba(255, 255, 255, .16);
            font-size: 12px;
            font-weight: 900;
            letter-spacing: .03em;
            text-transform: uppercase;
        }

        body.page-ui-chat-ai .chat-title {
            margin: 0;
            font-size: clamp(24px, 3vw, 34px);
            line-height: 1.12;
            font-weight: 950;
            letter-spacing: -.04em;
        }

        body.page-ui-chat-ai .chat-desc {
            max-width: 680px;
            margin: 8px 0 0;
            color: rgba(255, 255, 255, .84);
            font-size: 14px;
            line-height: 1.55;
            font-weight: 600;
        }

        body.page-ui-chat-ai .chat-intent-bar {
            display: flex;
            flex-wrap: wrap;
            gap: 7px;
            padding: 10px 20px 0;
        }

        body.page-ui-chat-ai .intent-tag {
            display: inline-flex;
            align-items: center;
            min-height: 28px;
            padding: 0 11px;
            border-radius: 999px;
            background: rgba(255, 255, 255, .14);
            color: rgba(255, 255, 255, .9);
            border: 1px solid rgba(255, 255, 255, .22);
            font-size: 11.5px;
            font-weight: 850;
        }

        body.page-ui-chat-ai .chat-trust {
            display: flex;
            flex-wrap: wrap;
            gap: 7px;
            margin-top: 12px;
        }

        body.page-ui-chat-ai .chat-trust span {
            display: inline-flex;
            align-items: center;
            min-height: 28px;
            padding: 0 10px;
            border-radius: 999px;
            background: rgba(255, 255, 255, .16);
            color: rgba(255, 255, 255, .92);
            font-size: 12px;
            font-weight: 850;
        }

        body.page-ui-chat-ai .chat-actions {
            display: flex;
            gap: 8px;
            flex-shrink: 0;
        }

        body.page-ui-chat-ai .chat-action-btn {
            height: 34px;
            padding: 0 11px;
            border: 1px solid rgba(255, 255, 255, .28);
            border-radius: 999px;
            background: rgba(255, 255, 255, .14);
            color: #fff;
            font-size: 12px;
            font-weight: 900;
            cursor: pointer;
        }

        body.page-ui-chat-ai .chat-action-btn:hover {
            background: rgba(255, 255, 255, .22);
        }

        body.page-ui-chat-ai .chat-body {
            flex: 1;
            padding: 16px;
            overflow-y: auto;
        }

        body.page-ui-chat-ai .chat-messages {
            display: grid;
            gap: 12px;
        }

        body.page-ui-chat-ai .msg {
            display: flex;
            gap: 9px;
            align-items: flex-start;
        }

        body.page-ui-chat-ai .msg.user {
            justify-content: flex-end;
        }

        body.page-ui-chat-ai .msg-avatar {
            width: 34px;
            height: 34px;
            flex: 0 0 34px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 999px;
            background: #ecfdf5;
            color: var(--lc-primary);
            font-size: 12px;
            font-weight: 950;
        }

        body.page-ui-chat-ai .msg.user .msg-avatar {
            display: none;
        }

        body.page-ui-chat-ai .msg-bubble {
            max-width: min(720px, 88%);
            padding: 12px 14px;
            border-radius: 18px;
            background: #f1f5f9;
            color: #334155;
            font-size: 14px;
            line-height: 1.55;
            font-weight: 600;
        }

        body.page-ui-chat-ai .msg.user .msg-bubble {
            background: var(--lc-primary);
            color: #fff;
            border-bottom-right-radius: 7px;
        }

        body.page-ui-chat-ai .msg.bot .msg-bubble {
            border-bottom-left-radius: 7px;
        }

        body.page-ui-chat-ai .msg-time {
            display: block;
            margin-top: 7px;
            color: #94a3b8;
            font-size: 11px;
            font-weight: 700;
        }

        body.page-ui-chat-ai .msg.user .msg-time {
            color: rgba(255, 255, 255, .72);
        }

        body.page-ui-chat-ai .answer-meta {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            margin-top: 10px;
        }

        body.page-ui-chat-ai .answer-text {
            display: grid;
            gap: 6px;
            font-size: 14px;
            line-height: 1.58;
            color: #334155;
        }

        body.page-ui-chat-ai .answer-paragraph {
            margin: 0;
        }

        body.page-ui-chat-ai .answer-list {
            margin: 0;
            padding-left: 17px;
            display: grid;
            gap: 4px;
            color: #334155;
        }

        body.page-ui-chat-ai .answer-list li {
            padding-left: 2px;
            line-height: 1.45;
        }

        body.page-ui-chat-ai .answer-list-number li {
            list-style: decimal;
        }

        body.page-ui-chat-ai .answer-actions {
            display: flex;
            justify-content: flex-end;
            gap: 6px;
            margin-top: 8px;
        }

        body.page-ui-chat-ai .answer-action {
            min-height: 30px;
            padding: 0 10px;
            border: 1px solid rgba(15, 23, 42, .12);
            border-radius: 999px;
            background: rgba(255, 255, 255, .75);
            color: #334155;
            font-size: 11.5px;
            font-weight: 850;
            display: inline-flex;
            align-items: center;
            gap: 6px;
            cursor: pointer;
        }

        body.page-ui-chat-ai .answer-action:hover {
            border-color: rgba(20, 184, 166, .35);
            color: var(--lc-primary);
            background: #fff;
        }

        body.page-ui-chat-ai .answer-chip, body.page-ui-chat-ai .answer-note {
            display: inline-flex;
            align-items: center;
            min-height: 27px;
            padding: 5px 9px;
            border-radius: 999px;
            background: #ffffff;
            color: #475569;
            border: 1px solid rgba(148, 163, 184, .24);
            font-size: 11.5px;
            line-height: 1.25;
            font-weight: 850;
        }

        body.page-ui-chat-ai .answer-note {
            border-radius: 13px;
            background: #f8fafc;
            color: #64748b;
        }

        body.page-ui-chat-ai .result-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 10px;
            margin-top: 11px;
        }

        body.page-ui-chat-ai .result-card {
            display: grid;
            grid-template-columns: 82px minmax(0, 1fr);
            gap: 10px;
            padding: 9px;
            border: 1px solid var(--lc-border);
            border-radius: 18px;
            background: #fff;
            text-decoration: none;
            box-shadow: 0 8px 22px rgba(15, 23, 42, .05);
            transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
        }

        body.page-ui-chat-ai .result-card:hover {
            transform: translateY(-2px);
            border-color: rgba(20, 184, 166, .32);
            box-shadow: 0 14px 30px rgba(15, 23, 42, .09);
        }

        body.page-ui-chat-ai .result-thumb {
            width: 82px;
            height: 82px;
            border-radius: 14px;
            background: #e2e8f0 center / cover no-repeat;
        }

        body.page-ui-chat-ai .result-info { min-width: 0; }

        body.page-ui-chat-ai .result-badge {
            display: inline-flex;
            max-width: 100%;
            margin-bottom: 5px;
            padding: 3px 7px;
            border-radius: 999px;
            background: #ecfdf5;
            color: var(--lc-primary);
            font-size: 11px;
            font-weight: 900;
        }

        body.page-ui-chat-ai .result-title {
            margin: 0;
            color: var(--lc-text);
            font-size: 13.5px;
            font-weight: 900;
            line-height: 1.35;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }

        body.page-ui-chat-ai .result-summary {
            margin: 4px 0 0;
            color: var(--lc-muted);
            font-size: 12px;
            line-height: 1.35;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }

        body.page-ui-chat-ai .result-meta {
            display: flex;
            flex-wrap: wrap;
            gap: 5px 8px;
            margin-top: 7px;
            color: #64748b;
            font-size: 11.5px;
            font-weight: 700;
        }

        body.page-ui-chat-ai .result-price {
            color: #dc2626;
            font-weight: 950;
        }

        body.page-ui-chat-ai .result-source {
            display: inline-flex;
            max-width: 100%;
            margin-top: 6px;
            color: #2563eb;
            font-size: 11.5px;
            font-weight: 850;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        body.page-ui-chat-ai .result-cta {
            display: inline-flex;
            margin-top: 7px;
            color: var(--lc-primary);
            font-size: 12px;
            font-weight: 950;
        }

        body.page-ui-chat-ai .chat-input-wrap {
            padding: 12px;
            border-top: 1px solid var(--lc-border);
            background: rgba(255, 255, 255, .92);
        }

        body.page-ui-chat-ai .chat-form {
            display: flex;
            gap: 9px;
            align-items: flex-end;
        }

        body.page-ui-chat-ai .chat-attach {
            width: 48px;
            height: 48px;
            border: 1px solid rgba(15, 23, 42, .12);
            border-radius: 17px;
            background: #fff;
            color: var(--lc-primary);
            font-size: 20px;
            cursor: pointer;
        }

        body.page-ui-chat-ai .chat-attach.has-files {
            background: #ecfdf5;
            border-color: rgba(20, 184, 166, .38);
        }

        body.page-ui-chat-ai .chat-input {
            min-height: 48px;
            max-height: 130px;
            flex: 1;
            resize: none;
            padding: 13px 14px;
            border: 1px solid rgba(15, 23, 42, .12);
            border-radius: 18px;
            outline: none;
            color: var(--lc-text);
            font-size: 15px;
            font-weight: 600;
            line-height: 1.4;
            background: #fff;
        }

        body.page-ui-chat-ai .chat-input:focus {
            border-color: rgba(20, 184, 166, .55);
            box-shadow: 0 0 0 4px rgba(20, 184, 166, .10);
        }

        body.page-ui-chat-ai .chat-send {
            width: 48px;
            height: 48px;
            border: 0;
            border-radius: 17px;
            background: var(--lc-primary);
            color: #fff;
            font-size: 20px;
            box-shadow: 0 12px 28px rgba(15, 118, 110, .24);
            cursor: pointer;
        }

        body.page-ui-chat-ai .chat-send:disabled {
            opacity: .55;
            cursor: not-allowed;
        }

        body.page-ui-chat-ai .chat-hint {
            display: block;
            margin: 7px 3px 0;
            color: #64748b;
            font-size: 12px;
            line-height: 1.35;
            font-weight: 650;
        }

        body.page-ui-chat-ai .chat-hint a {
            color: var(--lc-primary);
            font-weight: 900;
            text-decoration: none;
        }

        body.page-ui-chat-ai .chat-file-preview {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            margin: 8px 3px 0;
            padding: 6px 10px;
            border: 0;
            border-radius: 999px;
            background: #ecfdf5;
            color: #0f766e;
            font-size: 12px;
            font-weight: 850;
            cursor: pointer;
        }

        body.page-ui-chat-ai .market-draft {
            margin-top: 11px;
            padding: 12px;
            border: 1px solid rgba(20, 184, 166, .24);
            border-radius: 18px;
            background: #ffffff;
        }

        body.page-ui-chat-ai .market-draft h4 {
            margin: 0 0 8px;
            color: #0f172a;
            font-size: 14px;
            font-weight: 950;
        }

        body.page-ui-chat-ai .market-draft-grid {
            display: grid;
            gap: 7px;
            color: #475569;
            font-size: 12.5px;
            line-height: 1.35;
            font-weight: 700;
        }

        body.page-ui-chat-ai .market-draft-grid b {
            color: #0f172a;
            font-weight: 950;
        }

        body.page-ui-chat-ai .market-draft-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            margin-top: 11px;
        }

        body.page-ui-chat-ai .market-draft-action {
            min-height: 34px;
            padding: 0 12px;
            border: 0;
            border-radius: 999px;
            background: var(--lc-primary);
            color: #fff;
            font-size: 12.5px;
            font-weight: 900;
            cursor: pointer;
            text-decoration: none;
            display: inline-flex;
            align-items: center;
        }

        body.page-ui-chat-ai .market-draft-action.secondary {
            background: #f1f5f9;
            color: #334155;
        }

        body.page-ui-chat-ai .chat-side {
            padding: 16px;
            height: fit-content;
            position: sticky;
            top: 14px;
        }

        body.page-ui-chat-ai .side-title {
            margin: 0 0 5px;
            font-size: 18px;
            font-weight: 950;
            letter-spacing: -.02em;
        }

        body.page-ui-chat-ai .side-desc {
            margin: 0 0 14px;
            color: var(--lc-muted);
            font-size: 13px;
            font-weight: 600;
            line-height: 1.45;
        }

        body.page-ui-chat-ai .suggestion-list {
            display: grid;
            gap: 8px;
        }

        body.page-ui-chat-ai .chat-smart-strip-wrap {
            padding: 10px 16px 0;
            margin-top: 4px;
        }

        body.page-ui-chat-ai .chat-smart-strip-title {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            margin-bottom: 8px;
            color: #334155;
            font-size: 12px;
            font-weight: 800;
        }

        body.page-ui-chat-ai .chat-smart-strip-title i {
            color: var(--lc-primary);
            font-size: 13px;
        }

        body.page-ui-chat-ai .chat-smart-strip {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
            gap: 8px;
        }

        body.page-ui-chat-ai .chat-smart-strip .suggestion {
            justify-content: flex-start;
            padding: 9px 11px;
            min-height: 38px;
            border-radius: 14px;
            border-color: rgba(15, 118, 110, .18);
            background: linear-gradient(180deg, #fff, #f8fafc);
            box-shadow: 0 10px 24px rgba(15, 23, 42, .06);
        }

        body.page-ui-chat-ai .chat-smart-strip .suggestion:hover,
        body.page-ui-chat-ai .chat-smart-strip .suggestion:focus-visible {
            border-color: rgba(20, 184, 166, .42);
            transform: translateY(-1px);
        }

        body.page-ui-chat-ai .suggestion {
            width: 100%;
            padding: 11px 12px;
            border: 1px solid var(--lc-border);
            border-radius: 16px;
            background: linear-gradient(180deg, #fff, #f8fafc);
            color: #334155;
            text-align: left;
            font-size: 13px;
            line-height: 1.35;
            font-weight: 800;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            cursor: pointer;
        }

        body.page-ui-chat-ai .suggestion:hover {
            color: var(--lc-primary);
            border-color: rgba(20, 184, 166, .32);
        }

        body.page-ui-chat-ai .side-note {
            margin-top: 14px;
            padding: 12px;
            border-radius: 16px;
            background: #f8fafc;
            color: #64748b;
            font-size: 12.5px;
            line-height: 1.45;
            font-weight: 650;
        }

        body.page-ui-chat-ai .typing {
            display: inline-flex;
            align-items: center;
            gap: 5px;
        }

        body.page-ui-chat-ai .typing span {
            width: 6px;
            height: 6px;
            border-radius: 999px;
            background: #94a3b8;
            animation: typingDot 1s infinite ease-in-out;
        }

        body.page-ui-chat-ai .typing span:nth-child(2) { animation-delay: .15s; }
        body.page-ui-chat-ai .typing span:nth-child(3) { animation-delay: .3s; }

        @keyframes typingDot {
            0%, 80%, 100% { transform: translateY(0); opacity: .45; }
            40% { transform: translateY(-4px); opacity: 1; }
        }

        @media (max-width: 920px) {
            body.page-ui-chat-ai .chat-shell { grid-template-columns: 1fr; }
            body.page-ui-chat-ai .chat-side { position: static; order: -1; }
            body.page-ui-chat-ai .suggestion-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
            body.page-ui-chat-ai .chat-main { min-height: 70vh; }
        }

        @media (max-width: 640px) {
            body.page-ui-chat-ai .chat-page { padding: 0; }
            body.page-ui-chat-ai .chat-shell { gap: 0; }
            body.page-ui-chat-ai .chat-main, body.page-ui-chat-ai .chat-side {
                border-radius: 0;
                border-left: 0;
                border-right: 0;
            }

            body.page-ui-chat-ai .chat-side { padding: 13px; }

            body.page-ui-chat-ai .chat-hero-top {
                flex-direction: column;
                gap: 10px;
            }

            body.page-ui-chat-ai .chat-actions {
                width: 100%;
            }

            body.page-ui-chat-ai .chat-action-btn {
                flex: 1;
            }

            body.page-ui-chat-ai .suggestion-list {
                display: flex;
                gap: 8px;
                overflow-x: auto;
                padding-bottom: 2px;
            }

            body.page-ui-chat-ai .suggestion { min-width: 220px; }

            body.page-ui-chat-ai .chat-hero { padding: 18px 15px 14px; }
            body.page-ui-chat-ai .chat-body { padding: 12px; }
            body.page-ui-chat-ai .chat-intent-bar {
                padding: 10px 14px 0;
            }
            body.page-ui-chat-ai .msg-bubble { max-width: 92%; font-size: 13.5px; }
            body.page-ui-chat-ai .result-grid { grid-template-columns: 1fr; }
            body.page-ui-chat-ai .chat-smart-strip-wrap { padding: 8px 12px 0; }
            body.page-ui-chat-ai .chat-smart-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }

            body.page-ui-chat-ai .chat-input-wrap {
                position: sticky;
                bottom: 0;
                z-index: 10;
            }
        }

/* ========================================================================== */
/* Shared UI refresh */
:root {
    --lc-bg: #f6f8fa;
    --lc-card: #ffffff;
    --lc-text: #152033;
    --lc-muted: #667085;
    --lc-line: #dfe7ee;
    --lc-brand: #08705f;
    --lc-brand-2: #11a37f;
    --lc-radius: 8px;
    --lc-shadow: 0 10px 28px rgba(15, 23, 42, .08);
    --lc-shadow-soft: 0 6px 18px rgba(15, 23, 42, .06);
}

body {
    background: linear-gradient(180deg, #fbfdff 0%, #f1f6f4 42%, #f8fafc 100%);
}

.main {
    margin-bottom: 80px;
}

.container-xxl {
    max-width: 1440px;
}

.btn,
.dropdown-item,
.brand-title,
.brand-slogan,
.hero-title,
.section-title,
.market-highlight-head h3,
.market-post-body h3,
.trend-item b,
.bottom-nav a {
    letter-spacing: 0 !important;
}

.lc-header {
    background: rgba(255, 255, 255, .96);
    border-bottom: 1px solid rgba(223, 231, 238, .95);
    box-shadow: 0 8px 26px rgba(15, 23, 42, .06);
}

.lc-topbar {
    min-height: 72px;
    padding-left: 16px;
    padding-right: 16px;
}

.brand-link {
    min-width: 236px;
    gap: 12px;
}

.brand-logo-wrap {
    width: 52px;
    height: 52px;
    border-radius: 14px;
}

.brand-logo-img {
    width: 44px;
    height: 44px;
    border-radius: 10px;
}

.brand-title {
    color: #075e54;
    font-size: 18px;
    font-weight: 800;
}

.brand-slogan {
    color: #667085;
    font-size: 12px;
    font-weight: 600;
}

.top-search {
    height: 48px;
    max-width: 720px;
    border-radius: 8px;
    background: #fff;
    box-shadow: none;
}

.btn-brand,
.btn-soft,
.section-link,
.trend-foot-link,
.market-highlight-head a,
.listview__loadmore .btn {
    border-radius: 8px !important;
}

.content-layout {
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 16px;
}

.top-layout {
    grid-template-columns: minmax(0, 1.45fr) minmax(300px, .55fr) !important;
    gap: 16px !important;
}

.main-column,
.top-layout,
.hero-news,
.section-card {
    min-width: 0;
}

.app-card,
.section-card,
.trend-card,
.weather-card,
.info-card,
.market-category,
.market-post-card,
.listing-card,
.feature-card {
    border-radius: 8px !important;
    border-color: rgba(223, 231, 238, .95) !important;
    box-shadow: var(--lc-shadow-soft) !important;
}

.section-card {
    padding: 20px !important;
}

.section-head {
    gap: 16px;
    align-items: flex-start;
}

.section-title {
    font-size: 22px;
}

.hero-news {
    min-height: 350px;
    border-radius: 8px !important;
    border: 1px solid rgba(15, 23, 42, .1);
    box-shadow: var(--lc-shadow);
}

.hero-content {
    max-width: 760px;
    padding: 24px !important;
}

.hero-title {
    max-width: 720px;
    font-size: 30px;
    line-height: 1.15;
}

.hero-desc {
    max-width: 660px;
}

.hero-action,
.hero-trust-row span,
.market-post-count,
.market-post-cate {
    border-radius: 8px !important;
}

.market-category-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
}

.market-category {
    min-height: 82px;
    align-items: center;
    padding: 12px;
}

.market-icon,
.market-post-image,
.thumb,
.trend-item {
    border-radius: 8px !important;
}

.market-listing-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.market-post-card {
    padding: 8px !important;
}

.trend-list {
    gap: 8px;
}

.trend-item {
    padding: 8px;
}

.bottom-nav {
    left: 10px;
    right: auto;
    width: min(340px, calc(100vw - 20px));
    max-width: min(340px, calc(100vw - 20px));
    bottom: max(8px, env(safe-area-inset-bottom));
    padding: 6px;
    border-radius: 14px;
    overflow: hidden;
}

.bottom-nav a {
    flex: 1 1 0 !important;
    width: 20%;
    max-width: 20%;
    min-width: 0;
    min-height: 48px;
    padding: 0 2px;
    border-radius: 10px;
    font-size: 10.5px;
    font-weight: 700;
}

.bottom-nav span {
    max-width: 100%;
    display: block;
    overflow: visible;
    text-align: center;
    white-space: normal;
    line-height: 1.05;
}

/* 2026-06-02: polished header icons and Explore reading/share experience */
.header-nav-link {
    border-radius: 14px !important;
    gap: 8px !important;
    padding: 0 11px !important;
    transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}

.header-nav-link i {
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    background: rgba(8, 112, 95, .08);
    color: #08705f !important;
    font-size: 14px !important;
}

.header-nav-link:hover,
.header-nav-link.active {
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(8, 112, 95, .10);
}

.header-nav-link.active i {
    background: linear-gradient(135deg, #08705f, #10a27d);
    color: #fff !important;
}

.header-message-link {
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.header-message-link:hover {
    transform: translateY(-1px);
    background: #ecfdf5;
    box-shadow: 0 12px 24px rgba(8, 112, 95, .12);
}

.explore-page .explore-hero {
    position: relative;
    overflow: hidden;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 18px;
    min-height: 210px !important;
    padding: 26px !important;
    border: 1px solid rgba(8, 112, 95, .14);
    border-radius: 8px !important;
    background:
        linear-gradient(115deg, rgba(240, 253, 250, .96), rgba(255, 255, 255, .88)),
        url('/uploads/explore/lao-cai-rice-terrace-fallback.jpg') center/cover no-repeat;
}

.explore-page .explore-hero-copy {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 10px;
}

.explore-page .explore-hero-kicker {
    width: fit-content;
    min-height: 30px;
    display: inline-flex !important;
    align-items: center;
    gap: 7px;
    padding: 6px 11px;
    border: 1px solid rgba(8, 112, 95, .16);
    border-radius: 999px;
    background: rgba(255, 255, 255, .82);
    color: #08705f;
    font-size: 12px;
    font-weight: 850;
}

.explore-page .explore-hero h1 {
    color: #0f172a !important;
    font-size: clamp(30px, 4vw, 48px) !important;
    line-height: 1.06 !important;
}

.explore-page .explore-hero h1 i {
    background: linear-gradient(135deg, #08705f, #10a27d) !important;
    color: #fff !important;
}

.explore-page .explore-hero p {
    display: block !important;
    max-width: 660px;
    color: #405164;
    font-size: 16px;
    line-height: 1.6;
}

.explore-hero-stats,
.explore-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.explore-hero-stats span {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 11px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .86);
    color: #0f766e;
    font-size: 12.5px;
    font-weight: 850;
}

.explore-hero-action {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 14px;
    border-radius: 8px !important;
    background: #08705f !important;
    color: #fff !important;
    font-weight: 850;
    text-decoration: none;
    box-shadow: 0 14px 28px rgba(8, 112, 95, .20);
}

.explore-hero-action--light {
    border: 1px solid rgba(8, 112, 95, .18);
    background: #ffffff !important;
    color: #08705f !important;
    box-shadow: none;
}

.explore-page .explore-filter {
    border-radius: 8px !important;
    border: 1px solid rgba(8, 112, 95, .14) !important;
    background: #fff;
    transition: .18s ease;
}

.explore-page .explore-filter i {
    color: #08705f;
}

.explore-page .explore-filter:hover,
.explore-page .explore-filter.active {
    transform: translateY(-1px);
    background: #ecfdf5;
    box-shadow: 0 12px 24px rgba(8, 112, 95, .10);
}

.explore-page .explore-grid {
    align-items: stretch;
}

.explore-page .explore-card {
    overflow: hidden;
    border: 1px solid rgba(226, 232, 240, .94);
    border-radius: 8px !important;
    background: #fff;
    box-shadow: 0 14px 32px rgba(15, 23, 42, .06);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.explore-page .explore-card:hover {
    transform: translateY(-3px);
    border-color: rgba(8, 112, 95, .24);
    box-shadow: 0 22px 46px rgba(15, 23, 42, .10);
}

.explore-page .explore-card-media {
    aspect-ratio: 16 / 10;
    display: block;
    overflow: hidden;
}

.explore-page .explore-card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .25s ease;
}

.explore-page .explore-card:hover .explore-card-media img {
    transform: scale(1.04);
}

.explore-card-badge {
    left: 10px !important;
    right: auto !important;
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    border-radius: 999px !important;
    background: rgba(15, 23, 42, .74) !important;
    color: #fff !important;
    backdrop-filter: blur(10px);
}

.explore-page .explore-card-body {
    display: grid;
    gap: 10px;
    padding: 14px !important;
}

.explore-page .explore-card-body h2 {
    min-height: 48px;
    margin: 0;
    font-size: 18px !important;
    line-height: 1.34 !important;
}

.explore-page .explore-card-body h2 a {
    color: #0f172a;
    text-decoration: none;
}

.explore-page .explore-card-body p {
    display: -webkit-box !important;
    min-height: 44px;
    margin: 0;
    overflow: hidden;
    color: #64748b;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.explore-card-read {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #08705f;
    font-size: 13px;
    font-weight: 850;
    text-decoration: none;
}

.explore-card-read:hover {
    color: #065f46;
}

@media (min-width: 992px) {
    .explore-page .explore-card--featured {
        grid-column: span 2;
        display: grid;
        grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
    }

    .explore-page .explore-card--featured .explore-card-media {
        aspect-ratio: auto;
        height: 100%;
        min-height: 330px;
    }

    .explore-page .explore-card--featured .explore-card-body {
        align-content: center;
        padding: 24px !important;
    }

    .explore-page .explore-card--featured .explore-card-body h2 {
        font-size: 25px !important;
        line-height: 1.22 !important;
    }
}

.explore-detail-hero {
    border: 1px solid rgba(8, 112, 95, .12);
    border-radius: 8px;
    padding: 18px;
    background: linear-gradient(135deg, #ffffff, #f0fdfa);
}

.explore-detail-tags span {
    border-radius: 999px !important;
    background: #fff !important;
}

.explore-detail-actions {
    align-items: center;
    gap: 8px !important;
}

.explore-audio-btn,
.explore-share-btn {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 14px;
    border: 1px solid rgba(8, 112, 95, .16);
    border-radius: 8px;
    background: #ffffff;
    color: #08705f;
    font-size: 13px;
    font-weight: 850;
    cursor: pointer;
    transition: .18s ease;
}

.explore-audio-btn {
    border-color: transparent;
    background: #08705f;
    color: #fff;
    box-shadow: 0 14px 28px rgba(8, 112, 95, .18);
}

.explore-audio-btn:hover,
.explore-share-btn:hover,
.explore-audio-btn.is-playing {
    transform: translateY(-1px);
}

.explore-audio-btn.is-playing {
    background: #0f766e;
}

.explore-action-status {
    width: fit-content;
    margin-top: 9px;
    padding: 7px 10px;
    border-radius: 999px;
    background: #ecfdf5;
    color: #08705f;
    font-size: 12px;
    font-weight: 800;
}

.explore-detail-cover {
    overflow: hidden;
    border-radius: 8px !important;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .12);
}

.explore-image-strip {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    margin: 10px 0 16px;
}

.explore-image-strip a {
    overflow: hidden;
    border-radius: 8px;
    background: #e2e8f0;
    aspect-ratio: 4 / 3;
}

.explore-image-strip img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .2s ease;
}

.explore-image-strip a:hover img {
    transform: scale(1.05);
}

.explore-inline-image {
    border-radius: 8px !important;
    overflow: hidden;
    border: 1px solid rgba(226, 232, 240, .92);
    background: #fff;
}

.explore-inline-image img {
    width: 100%;
}

.explore-related-card {
    border-radius: 8px !important;
    transition: transform .18s ease, box-shadow .18s ease;
}

.explore-related-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 32px rgba(15, 23, 42, .08);
}

@media (max-width: 991px) {
    .explore-page .explore-hero {
        grid-template-columns: 1fr;
        min-height: 0 !important;
    }

    .explore-hero-actions {
        width: 100%;
    }

    .explore-hero-action {
        flex: 1 1 160px;
    }
}

@media (max-width: 767px) {
    .header-message-link {
        width: 38px !important;
        height: 38px !important;
    }

    .explore-page .explore-hero {
        padding: 16px !important;
        border-radius: 8px !important;
    }

    .explore-page .explore-hero h1 {
        font-size: 27px !important;
    }

    .explore-page .explore-hero p {
        font-size: 14px;
        line-height: 1.5;
    }

    .explore-hero-stats span {
        min-height: 30px;
        padding: 6px 9px;
        font-size: 11.5px;
    }

    .explore-page .explore-card-body h2 {
        min-height: auto;
        font-size: 16px !important;
    }

    .explore-page .explore-card-body p {
        min-height: auto;
    }

    .explore-detail-hero {
        padding: 14px;
    }

    .explore-detail-actions > * {
        flex: 1 1 140px;
        min-width: 0;
    }

    .explore-audio-btn,
    .explore-share-btn,
    .lc-save-detail,
    .explore-back-link {
        padding: 0 10px !important;
        font-size: 12.5px;
    }

    .explore-image-strip {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px;
    }
}

.ios-install-tip {
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: max(16px, calc(env(safe-area-inset-bottom, 0px) + 12px));
    z-index: 1080;
    display: none;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    padding: 14px 16px;
    border: 1px solid rgba(15, 118, 110, .14);
    border-radius: 18px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 18px 46px rgba(15, 23, 42, .14);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.ios-install-tip.is-visible {
    display: grid;
}

.ios-install-tip__icon {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: linear-gradient(135deg, #0f766e, #14b8a6);
    color: #ffffff;
    font-size: 20px;
}

.ios-install-tip__body {
    min-width: 0;
}

.ios-install-tip__body strong {
    display: block;
    color: #0f172a;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.2;
}

.ios-install-tip__body p {
    margin: 6px 0 0;
    color: #475569;
    font-size: 13px;
    line-height: 1.5;
}

.ios-install-tip__close {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 999px;
    background: rgba(148, 163, 184, .16);
    color: #475569;
}

body.page-ui-post-ai .lc-header,
body.page-ui-post-ai .footer,
body.page-ui-chat-ai .lc-header,
body.page-ui-chat-ai .footer {
    display: none !important;
}

body.page-ui-post-ai .main,
body.page-ui-chat-ai .main {
    margin-bottom: 0;
}

body.page-ui-post-ai .chat-page,
body.page-ui-chat-ai .chat-page {
    min-height: 100vh;
}

body.page-ui-post-ai .chat-main {
    border-radius: 12px;
    box-shadow: 0 14px 36px rgba(15, 23, 42, .08);
}

body.page-ui-post-ai .chat-form {
    border-radius: 12px;
}

@media (max-width: 1199px) {
    .content-layout,
    .top-layout {
        grid-template-columns: 1fr !important;
    }

    .side-stack,
    .right-column {
        position: static;
    }

    .market-listing-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 991px) {
    .market-category-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .trend-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    body {
        font-size: 14px;
        background: #f7fafc;
    }

    .container-xxl {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .lc-topbar {
        min-height: 58px;
        padding-top: 8px;
        padding-bottom: 6px;
    }

    .brand-link {
        min-width: 0;
        max-width: calc(100vw - 82px);
        gap: 9px;
    }

    .brand-logo-wrap {
        width: 42px;
        height: 42px;
        border-radius: 10px;
    }

    .brand-logo-img {
        width: 35px;
        height: 35px;
        border-radius: 8px;
    }

    .brand-title {
        font-size: 14px;
        line-height: 1.05;
    }

    .brand-slogan {
        font-size: 10.5px;
    }

    .topbar-actions {
        gap: 6px !important;
    }

    .round-btn,
    .avatar-btn {
        width: 38px;
        height: 38px;
        min-width: 38px;
    }

    .mobile-search {
        display: flex !important;
        height: 42px;
        margin-top: 2px;
        border-radius: 8px;
    }

    .main-wrap {
        overflow-x: hidden;
        padding-top: 10px !important;
        padding-bottom: 106px !important;
    }

    .top-layout {
        gap: 10px !important;
    }

    .hero-news {
        min-height: 282px !important;
    }

    .hero-content {
        padding: 16px !important;
    }

    .hero-kicker {
        font-size: 11px;
    }

    .hero-title {
        max-width: calc(100vw - 44px);
        font-size: 21px !important;
        line-height: 1.2;
    }

    .hero-desc {
        display: -webkit-box;
        overflow: hidden;
        font-size: 13px;
        line-height: 1.45;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .hero-action-row {
        display: none !important;
    }

    .hero-trust-row {
        gap: 6px;
        margin-top: 10px;
    }

    .hero-trust-row span {
        min-height: 26px;
        padding: 0 8px;
        font-size: 10.5px;
    }

    .section-card {
        padding: 14px !important;
    }

    .section-head {
        flex-direction: column;
        align-items: stretch;
    }

    .section-link {
        width: 100%;
        min-height: 40px;
        justify-content: center;
    }

    .market-category-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 8px;
    }

    .market-category {
        min-height: 78px;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 10px 8px;
        text-align: center;
    }

    .market-category small {
        display: none;
    }

    .market-page .market-listing-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px;
    }

    .market-page .market-post-body h3 {
        min-height: auto;
        font-size: 13px;
        line-height: 1.35;
    }

    .market-page .market-post-card {
        border-radius: 14px;
    }

    .market-page .market-post-meta {
        gap: 8px;
    }

    .market-page .market-post-meta span {
        display: flex !important;
        white-space: normal;
        line-height: 1.32;
    }

    .market-page .market-post-meta span i {
        color: var(--lc-muted);
        flex: 0 0 auto;
    }

    .market-page .market-post-card .price {
        font-size: 15px;
    }

    .trend-list {
        grid-template-columns: 1fr !important;
    }

    .trend-item {
        grid-template-columns: 64px minmax(0, 1fr);
    }
}

@media (max-width: 640px) {
    body.page-ui-post-ai .chat-page {
        padding: 0;
    }

    body.page-ui-post-ai .chat-main {
        border-right: 0;
        border-left: 0;
        border-radius: 0;
    }
}

@media (max-width: 420px) {
    .brand-title {
        font-size: 13px;
    }

    .brand-slogan {
        font-size: 10px;
    }

    .bottom-nav a {
        min-height: 52px;
        font-size: 9.5px;
    }
}

@media (max-width: 991px) {
    .bottom-nav {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .bottom-nav a {
        width: auto;
        max-width: none;
    }
}

@media (min-width: 992px) {
    .bottom-nav {
        display: none !important;
    }
}

.lc-empty-page {
    width: min(760px, 100%);
    margin: 54px auto;
    padding: 34px;
    text-align: center;
}

.lc-empty-icon {
    width: 64px;
    height: 64px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    border-radius: 18px;
    background: #ecfdf5;
    color: var(--lc-brand);
    font-size: 28px;
}

.lc-empty-page h1 {
    margin: 0 0 10px;
    color: var(--lc-text);
    font-size: 28px;
    font-weight: 850;
}

.lc-empty-page p {
    max-width: 560px;
    margin: 0 auto 20px;
    color: var(--lc-muted);
    line-height: 1.6;
    overflow-wrap: anywhere;
}

.lc-empty-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

.lc-empty-actions a {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 16px;
    border-radius: 8px;
    font-weight: 750;
}

.lc-empty-primary {
    background: var(--lc-brand);
    color: #fff !important;
}

.lc-empty-secondary {
    border: 1px solid var(--lc-line);
    background: #fff;
    color: var(--lc-text) !important;
}

@media (max-width: 575px) {
    .lc-empty-page {
        width: calc(100vw - 32px) !important;
        max-width: calc(100vw - 32px);
        margin: 24px auto;
        padding: 24px 16px;
        overflow: visible;
    }

    .lc-empty-page h1 {
        font-size: 22px;
    }

    .lc-empty-actions {
        flex-direction: column;
    }

    .lc-empty-actions a {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 767px) {
    body.page-ui-chat-ai .chat-side {
        display: none;
    }

    body.page-ui-chat-ai .chat-main {
        min-height: 100vh;
    }

    body.page-ui-chat-ai .chat-body {
        overflow-x: hidden;
    }

    body.page-ui-chat-ai .msg-bubble {
        max-width: calc(100vw - 112px) !important;
        overflow-wrap: anywhere;
    }

    body.page-ui-chat-ai .chat-hint {
        display: none;
    }
}

/* Local Explore */
.home-explore,
.explore-page,
.explore-detail {
    min-width: 0;
}

.home-explore-grid,
.explore-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.home-explore-card,
.explore-card {
    display: flex;
    min-width: 0;
    overflow: hidden;
    flex-direction: column;
    border: 1px solid rgba(226, 232, 240, .98);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 10px 26px rgba(15, 23, 42, .06);
}

.home-explore-media,
.explore-card-media {
    position: relative;
    display: block;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: #e2e8f0;
}

.home-explore-media img,
.explore-card-media img,
.explore-detail-cover img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.home-explore-media span,
.explore-card-media span {
    position: absolute;
    left: 10px;
    bottom: 10px;
    max-width: calc(100% - 20px);
    padding: 5px 9px;
    border-radius: 8px;
    background: rgba(15, 23, 42, .82);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
}

.home-explore-body,
.explore-card-body {
    min-width: 0;
    padding: 12px;
}

.home-explore-meta,
.explore-card-meta,
.explore-detail-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    color: #64748b;
    font-size: 12px;
}

.home-explore-meta span,
.explore-card-meta span,
.explore-detail-tags span {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.home-explore-body h3,
.explore-card-body h2 {
    margin: 9px 0 6px;
    color: #0f172a;
    font-size: 16px;
    font-weight: 850;
    line-height: 1.35;
}

.home-explore-body h3 a,
.explore-card-body h2 a {
    color: inherit;
}

.home-explore-body p,
.explore-card-body p {
    display: -webkit-box;
    min-height: 40px;
    margin: 0;
    overflow: hidden;
    color: #64748b;
    font-size: 13px;
    line-height: 1.5;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.home-explore-empty {
    min-height: 74px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    border: 1px dashed #cbd5e1;
    border-radius: 8px;
    color: #475569;
    background: #f8fafc;
    line-height: 1.45;
}

.home-explore-empty i {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #ecfdf5;
    color: #047857;
    font-size: 20px;
}

.explore-hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 14px;
    padding: 24px;
    overflow: hidden;
    border: 1px solid rgba(226, 232, 240, .95);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(236, 253, 245, .96), rgba(255, 247, 237, .88)),
        #fff;
}

.explore-hero-kicker {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 10px;
    color: #047857;
    font-size: 12px;
    font-weight: 850;
    text-transform: uppercase;
}

.explore-hero h1 {
    margin: 0;
    color: #0f172a;
    font-size: clamp(28px, 4vw, 44px);
    font-weight: 900;
    line-height: 1.06;
}

.explore-hero p {
    max-width: 760px;
    margin: 10px 0 0;
    color: #475569;
    font-size: 15px;
    line-height: 1.65;
}

.explore-hero-action,
.explore-filter,
.explore-pager a {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 14px;
    border-radius: 8px;
    font-weight: 800;
}

.explore-hero-action {
    flex: 0 0 auto;
    background: #0f766e;
    color: #fff !important;
}

.explore-filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}

.explore-filter {
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #334155;
}

.explore-filter.active {
    border-color: #0f766e;
    background: #ecfdf5;
    color: #047857;
}

.explore-pager {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 16px;
    color: #64748b;
    font-size: 13px;
}

.explore-pager > div {
    display: flex;
    gap: 8px;
}

.explore-pager a {
    border: 1px solid #dbeafe;
    background: #eff6ff;
    color: #1d4ed8;
}

.explore-empty {
    padding: 34px 18px;
    text-align: center;
}

.explore-empty span {
    width: 58px;
    height: 58px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 14px;
    border-radius: 8px;
    background: #ecfdf5;
    color: #047857;
    font-size: 28px;
}

.explore-empty h2 {
    margin: 0 0 8px;
    color: #0f172a;
    font-size: 24px;
    font-weight: 900;
}

.explore-empty p {
    max-width: 560px;
    margin: 0 auto;
    color: #64748b;
    line-height: 1.6;
}

.explore-detail-layout {
    width: min(920px, 100%);
    margin: 0 auto;
}

.explore-detail-hero {
    padding: 8px 0 18px;
}

.explore-detail-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    margin-bottom: 14px;
    color: #64748b;
    font-size: 13px;
}

.explore-detail-breadcrumb a {
    color: #0f766e;
    font-weight: 750;
}

.explore-detail-tags {
    margin-bottom: 12px;
}

.explore-detail-tags span {
    min-height: 30px;
    padding: 0 9px;
    border-radius: 8px;
    background: #f1f5f9;
    color: #334155;
    font-weight: 750;
}

.explore-detail-hero h1 {
    max-width: 860px;
    margin: 0;
    color: #0f172a;
    font-size: clamp(28px, 4.2vw, 48px);
    font-weight: 900;
    line-height: 1.12;
}

.explore-detail-hero p {
    max-width: 760px;
    margin: 12px 0 0;
    color: #475569;
    font-size: 17px;
    line-height: 1.65;
}

.explore-detail-cover {
    aspect-ratio: 16 / 8.5;
    overflow: hidden;
    margin-bottom: 8px;
    border-radius: 8px;
    background: #e2e8f0;
}

.explore-cover-credit {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px;
    margin: 0 0 16px;
    color: #64748b;
    font-size: 12px;
    line-height: 1.45;
}

.explore-cover-credit span {
    min-width: min(280px, 100%);
    flex: 1 1 280px;
    overflow-wrap: anywhere;
}

.explore-cover-credit a {
    color: #0f766e;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.explore-image-gallery {
    margin-bottom: 16px;
    padding: 16px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #fff;
}

.explore-image-gallery-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.explore-image-gallery-head h2 {
    margin: 0;
    color: #0f172a;
    font-size: 18px;
    font-weight: 900;
}

.explore-image-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.explore-image-grid figure {
    min-width: 0;
    overflow: hidden;
    margin: 0;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #f8fafc;
}

.explore-image-grid figure:first-child {
    grid-column: span 2;
}

.explore-image-grid img {
    width: 100%;
    aspect-ratio: 4 / 3;
    display: block;
    object-fit: cover;
    background: #e2e8f0;
}

.explore-image-grid figure:first-child img {
    aspect-ratio: 16 / 8.5;
}

.explore-image-grid figcaption {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 9px 10px;
    color: #475569;
    font-size: 12px;
    line-height: 1.45;
}

.explore-image-grid figcaption span {
    min-width: min(260px, 100%);
    flex: 1 1 240px;
    overflow-wrap: anywhere;
}

.explore-image-grid figcaption a {
    color: #0f766e;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.explore-article {
    padding: 26px;
}

.explore-article-content {
    color: #1e293b;
    font-size: 16px;
    line-height: 1.8;
}

.explore-article-content h2,
.explore-article-content h3 {
    margin: 26px 0 10px;
    color: #0f172a;
    font-weight: 900;
    line-height: 1.25;
}

.explore-article-content h2 {
    font-size: 25px;
}

.explore-article-content h3 {
    font-size: 20px;
}

.explore-article-content p,
.explore-article-content ul,
.explore-article-content ol,
.explore-article-content blockquote {
    margin-bottom: 16px;
}

.explore-article-content blockquote {
    padding: 12px 14px;
    border-left: 4px solid #0f766e;
    border-radius: 8px;
    background: #f8fafc;
}

.explore-inline-image {
    overflow: hidden;
    margin: 22px 0;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #f8fafc;
}

.explore-inline-image img {
    width: 100%;
    aspect-ratio: 16 / 9;
    display: block;
    object-fit: cover;
    background: #e2e8f0;
}

.explore-inline-image figcaption {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 9px 11px;
    color: #475569;
    font-size: 12px;
    line-height: 1.45;
}

.explore-inline-image figcaption span {
    min-width: min(280px, 100%);
    flex: 1 1 260px;
    overflow-wrap: anywhere;
}

.explore-inline-image figcaption a {
    color: #0f766e;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.explore-tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid #e2e8f0;
}

.explore-tag-list span {
    padding: 7px 10px;
    border-radius: 8px;
    background: #f8fafc;
    color: #475569;
    font-size: 12px;
    font-weight: 800;
}

.explore-source-box {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid #e2e8f0;
}

.explore-source-box h2 {
    margin: 0 0 12px;
    color: #0f172a;
    font-size: 18px;
    font-weight: 900;
}

.explore-source-list {
    display: grid;
    gap: 8px;
}

.explore-source-list a {
    min-width: 0;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 9px;
    align-items: center;
    padding: 10px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    color: #0f172a;
    background: #fff;
}

.explore-source-list i {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #eff6ff;
    color: #1d4ed8;
}

.explore-source-list b,
.explore-source-list small {
    display: block;
    overflow-wrap: anywhere;
}

.explore-source-list small {
    margin-top: 2px;
    color: #64748b;
}

@media (max-width: 1199px) {
    .home-explore-grid,
    .explore-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991px) {
    .bottom-nav {
        width: min(390px, calc(100vw - 20px)) !important;
        max-width: min(390px, calc(100vw - 20px)) !important;
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    }

    .bottom-nav a {
        width: auto !important;
        max-width: none !important;
        padding: 6px 3px !important;
        font-size: 9.5px;
    }

    .bottom-nav i {
        font-size: 17px;
    }

    .explore-hero {
        align-items: stretch;
        flex-direction: column;
        padding: 18px;
    }

    .explore-hero-action {
        width: 100%;
    }

    .explore-detail-cover {
        aspect-ratio: 16 / 10;
    }

    .explore-image-grid figure:first-child img {
        aspect-ratio: 16 / 10;
    }
}

@media (max-width: 575px) {
    .home-explore-grid,
    .explore-grid {
        grid-template-columns: 1fr;
    }

    .home-explore-body p,
    .explore-card-body p {
        min-height: auto;
    }

    .explore-page,
    .explore-detail {
        padding-bottom: 92px !important;
    }

    .explore-filter-row {
        flex-wrap: nowrap;
        margin-right: -12px;
        padding-bottom: 4px;
        overflow-x: auto;
    }

    .explore-filter {
        flex: 0 0 auto;
        min-height: 38px;
        padding: 0 11px;
        font-size: 12px;
    }

    .explore-detail-tags {
        gap: 6px;
    }

    .explore-detail-tags span {
        min-height: 28px;
        font-size: 11px;
    }

    .explore-article {
        padding: 18px;
    }

    .explore-image-gallery {
        padding: 12px;
    }

    .explore-image-grid {
        grid-template-columns: 1fr;
    }

    .explore-image-grid figure:first-child {
        grid-column: auto;
    }

    .explore-image-grid img,
    .explore-image-grid figure:first-child img {
        aspect-ratio: 4 / 3;
    }

    .explore-article-content {
        font-size: 15px;
        line-height: 1.75;
    }

    .explore-inline-image {
        margin: 18px 0;
    }

    .explore-inline-image img {
        aspect-ratio: 4 / 3;
    }

    .explore-pager {
        align-items: stretch;
        flex-direction: column;
    }

    .explore-pager > div {
        justify-content: space-between;
    }
}

/* Market listing page */
.market-page {
    min-width: 0;
}

.market-page-hero .section-head {
    margin-bottom: 14px;
}

.market-page-categories .market-category.active {
    border-color: rgba(15, 118, 110, .45);
    background: #ecfdf5;
    box-shadow: 0 10px 22px rgba(15, 118, 110, .10);
}

.market-page-list .market-highlight-head {
    align-items: center;
}

.market-pager {
    margin-top: 18px;
}

@media (max-width: 575px) {
    .market-page {
        padding-bottom: 92px !important;
    }

    .market-page .market-category-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .market-page .market-listing-grid {
        grid-template-columns: 1fr !important;
        gap: 12px;
    }

    .market-page-list .market-highlight-head {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Header refinement: search removed, focused navigation */
.lc-header {
    background: rgba(255, 255, 255, .97) !important;
    border-bottom: 1px solid rgba(223, 231, 238, .96) !important;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .055) !important;
}

.lc-topbar {
    min-height: 66px !important;
    gap: 14px !important;
}

.brand-link {
    flex: 0 0 auto;
    min-width: 0 !important;
    padding: 4px 0;
}

.brand-logo-wrap {
    width: 48px !important;
    height: 48px !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 18px rgba(8, 112, 95, .10) !important;
}

.brand-logo-img {
    width: 40px !important;
    height: 40px !important;
    border-radius: 9px !important;
}

.brand-title {
    color: #075e54 !important;
    font-size: 17px !important;
    font-weight: 850 !important;
    line-height: 1.05 !important;
}

.brand-slogan {
    color: #64748b !important;
    font-size: 11.5px !important;
    font-weight: 650 !important;
}

.top-search,
.mobile-search {
    display: none !important;
}

.header-nav {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

.header-nav-link {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 12px;
    border: 1px solid transparent;
    border-radius: 8px;
    color: #344054;
    font-size: 13.5px;
    font-weight: 750;
    line-height: 1;
    white-space: nowrap;
    transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;
}

.header-nav-link i {
    color: #0b7a65;
    font-size: 16px;
}

.header-more-dropdown {
    flex: 0 0 auto;
}

.header-more-toggle {
    appearance: none;
    background: transparent;
    cursor: pointer;
}

.header-more-caret {
    width: auto !important;
    height: auto !important;
    margin-left: -2px;
    color: #64748b !important;
    font-size: 11px !important;
}

.header-nav-link:hover {
    color: #075e54;
    border-color: rgba(8, 112, 95, .14);
    background: #f3faf7;
}

.header-nav-link.active {
    color: #075e54;
    border-color: rgba(8, 112, 95, .18);
    background: #ecfdf5;
}

.topbar-actions {
    flex: 0 0 auto;
    margin-left: 0 !important;
}

.topbar-actions .post-btn {
    min-height: 40px;
    padding: 0 14px !important;
    border-radius: 8px !important;
    font-size: 13.5px;
    font-weight: 800;
    box-shadow: 0 10px 22px rgba(8, 112, 95, .18) !important;
}

.avatar-btn {
    height: 40px !important;
    min-width: 40px;
    border-radius: 8px !important;
    padding: 4px 7px 4px 4px !important;
    box-shadow: none !important;
}

.avatar-photo {
    width: 32px !important;
    height: 32px !important;
    border-radius: 8px !important;
}

.user-menu {
    border-radius: 12px !important;
}

@media (max-width: 1199px) {
    .header-nav-link {
        padding: 0 9px;
        font-size: 13px;
    }
}

@media (max-width: 991px) {
    .lc-topbar {
        justify-content: space-between;
    }

    .header-nav {
        display: none !important;
    }

    .topbar-actions .post-btn {
        display: none !important;
    }
}

@media (max-width: 767px) {
    .lc-topbar {
        min-height: 56px !important;
        padding-top: 7px !important;
        padding-bottom: 7px !important;
    }

    .brand-link {
        max-width: calc(100vw - 76px) !important;
        gap: 8px !important;
    }

    .brand-logo-wrap {
        width: 40px !important;
        height: 40px !important;
        border-radius: 10px !important;
    }

    .brand-logo-img {
        width: 33px !important;
        height: 33px !important;
        border-radius: 8px !important;
    }

    .brand-title {
        font-size: 14px !important;
    }

    .brand-slogan {
        font-size: 10px !important;
        margin-top: 1px !important;
    }

    .avatar-btn {
        width: 38px !important;
        height: 38px !important;
        min-width: 38px !important;
        padding: 3px !important;
    }

    .avatar-photo {
        width: 30px !important;
        height: 30px !important;
    }
}

@media (max-width: 380px) {
    .brand-slogan {
        display: none !important;
    }
}

/* Brand and beta-card polish */
.brand-link {
    gap: 10px !important;
}

.brand-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.brand-logo-wrap {
    width: 44px !important;
    height: 44px !important;
    border-radius: 13px !important;
    background: linear-gradient(145deg, #fff, #f5fbf8) !important;
    border-color: rgba(8, 112, 95, .14) !important;
    box-shadow: 0 7px 18px rgba(8, 112, 95, .09) !important;
}

.brand-logo-img {
    width: 36px !important;
    height: 36px !important;
    border-radius: 10px !important;
    object-fit: contain !important;
}

.brand-title {
    font-size: 16.5px !important;
    font-weight: 850 !important;
    line-height: 1.06 !important;
    color: #075e54 !important;
}

.brand-slogan {
    margin-top: 2px !important;
    color: #667085 !important;
    font-size: 10.5px !important;
    font-weight: 650 !important;
}

.header-nav {
    justify-content: center;
    gap: 4px;
}

.header-nav-link {
    min-height: 38px;
    padding: 0 10px;
    font-size: 13px;
    font-weight: 720;
}

.header-nav-link i {
    font-size: 15px;
}

.topbar-actions .post-btn {
    min-height: 38px;
    padding: 0 13px !important;
}

.local-beta-card {
    overflow: hidden;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .98), rgba(240, 253, 250, .72)) !important;
}

.local-beta-card .section-head {
    margin-bottom: 10px;
}

/* Account gate for saved items */
body.lc-auth-modal-open {
    overflow: hidden;
}

.lc-auth-modal {
    position: fixed;
    inset: 0;
    z-index: 1400;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 18px;
}

.lc-auth-modal.active {
    display: flex;
}

.lc-auth-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, .58);
    backdrop-filter: blur(10px);
}

.lc-auth-modal__box {
    position: relative;
    z-index: 1;
    width: min(420px, 100%);
    padding: 24px;
    border: 1px solid rgba(226, 232, 240, .92);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 28px 80px rgba(15, 23, 42, .24);
    text-align: center;
}

.lc-auth-modal__close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 999px;
    background: #f1f5f9;
    color: #475569;
}

.lc-auth-modal__icon {
    width: 58px;
    height: 58px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 14px;
    border-radius: 20px;
    background: #ecfdf5;
    color: #08705f;
    font-size: 27px;
}

.lc-auth-modal h2 {
    margin: 0;
    color: #0f172a;
    font-size: 21px;
    font-weight: 800;
    letter-spacing: 0;
}

.lc-auth-modal p {
    max-width: 330px;
    margin: 8px auto 16px;
    color: #64748b;
    font-size: 14px;
    line-height: 1.55;
}

.lc-auth-modal__connect {
    display: flex;
    justify-content: center;
}

.lc-auth-modal .eyrok-connect-btn,
.saved-auth-open {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 18px;
    border: 0;
    border-radius: 999px;
    background: #08705f;
    color: #ffffff !important;
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
    box-shadow: 0 12px 26px rgba(8, 112, 95, .22);
}

.market-page .market-post-meta {
    gap: 6px;
    padding-top: 8px;
}

.market-page .market-post-meta span {
    line-height: 1.25;
}

@media (max-width: 767px) {
    .lc-auth-modal {
        align-items: flex-end;
        padding: 10px;
    }

    .lc-auth-modal__box {
        padding: 22px 18px 20px;
        border-radius: 20px 20px 0 0;
    }
}

/* Rao vat messaging and management */
.header-message-link {
    position: relative;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(8, 112, 95, .16);
    border-radius: 999px;
    background: #ecfdf5;
    color: #08705f;
    text-decoration: none;
}

.header-message-link i {
    font-size: 18px;
}

.header-message-link span,
.message-badge-inline,
.account-message-item em {
    min-width: 19px;
    height: 19px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 5px;
    border-radius: 999px;
    background: #dc2626;
    color: #ffffff;
    font-size: 11px;
    font-style: normal;
    font-weight: 850;
    line-height: 1;
}

.header-message-link span {
    position: absolute;
    top: -4px;
    right: -4px;
    box-shadow: 0 0 0 2px #ffffff;
}

.message-badge-inline[hidden],
.header-message-link span[hidden],
.account-message-item em[hidden] {
    display: none !important;
}

.user-message-menu-item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ad-message-manage-link {
    gap: 6px;
}

.seller-message-btn {
    min-height: 48px;
}

.ad-management-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    margin-top: 8px;
}

.ad-stat-badge,
.ad-unread-chip {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 0 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.ad-stat-badge {
    border: 1px solid rgba(15, 23, 42, .08);
    background: #f8fafc;
    color: #334155;
}

.ad-status-badge {
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 0 11px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
}

.ad-status-badge--active {
    border: 1px solid rgba(16, 185, 129, .35);
    background: #ecfdf5;
    color: #065f46;
}

.ad-status-badge--pending {
    border: 1px solid rgba(217, 119, 6, .35);
    background: #fffbeb;
    color: #92400e;
}

.ad-status-badge--hidden {
    border: 1px solid rgba(148, 163, 184, .45);
    background: #f1f5f9;
    color: #334155;
}

.ad-unread-chip {
    background: #ecfdf5;
    color: #08705f;
}

.account-message-item {
    position: relative;
}

.account-message-item em {
    margin-left: auto;
}

.ad-chat-layout {
    display: grid;
    grid-template-columns: minmax(260px, 360px) minmax(0, 1fr);
    gap: 14px;
    align-items: stretch;
}

.ad-chat-list-panel,
.ad-chat-thread-panel {
    min-height: 620px;
}

.ad-chat-panel-head,
.ad-chat-thread-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}

.ad-chat-panel-head b {
    color: #0f172a;
    font-size: 16px;
    font-weight: 850;
}

.ad-chat-rule-note {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 10px;
    padding: 8px 10px;
    border-radius: 10px;
    background: #ecfeff;
    color: #164e63;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.45;
}

.ad-chat-rule-note i {
    color: #0891b2;
    font-size: 14px;
    line-height: 1;
    margin-top: 2px;
}

.ad-chat-refresh {
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--lc-line);
    border-radius: 999px;
    background: #ffffff;
    color: #08705f;
}

.ad-chat-list {
    display: grid;
    gap: 8px;
}

.ad-chat-list-item {
    width: 100%;
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 9px;
    border: 1px solid rgba(226, 232, 240, .95);
    border-radius: 14px;
    background: #ffffff;
    color: #0f172a;
    text-align: left;
}

.ad-chat-list-item.active,
.ad-chat-list-item:hover {
    border-color: rgba(8, 112, 95, .24);
    background: #f0fdfa;
}

.ad-chat-list-item img {
    width: 54px;
    height: 54px;
    border-radius: 12px;
    object-fit: cover;
    background: #f1f5f9;
}

.ad-chat-list-item b,
.ad-chat-ad b {
    display: block;
    overflow: hidden;
    color: #0f172a;
    font-size: 13px;
    font-weight: 850;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ad-chat-list-item small,
.ad-chat-ad small {
    display: block;
    overflow: hidden;
    color: #64748b;
    font-size: 12px;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ad-chat-list-item em {
    min-width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 6px;
    border-radius: 999px;
    background: #dc2626;
    color: #ffffff;
    font-size: 11px;
    font-style: normal;
    font-weight: 850;
}

.ad-chat-thread-panel {
    display: flex;
    flex-direction: column;
}

.ad-chat-thread,
.ad-chat-thread-empty {
    min-height: 560px;
}

.ad-chat-thread[hidden],
.ad-chat-thread-empty[hidden] {
    display: none !important;
}

.ad-chat-thread {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
}

.ad-chat-thread-empty {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.ad-chat-ad {
    min-width: 0;
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    color: inherit;
    text-decoration: none;
}

.ad-chat-ad img {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    object-fit: cover;
}

.ad-chat-messages {
    flex: 1 1 auto;
    max-height: 520px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px;
    border: 1px solid rgba(226, 232, 240, .88);
    border-radius: 16px;
    background: #f8fafc;
}

.ad-chat-bubble-row {
    display: flex;
}

.ad-chat-bubble-row.mine {
    justify-content: flex-end;
}

.ad-chat-bubble-row.theirs {
    justify-content: flex-start;
}

.ad-chat-bubble {
    max-width: min(76%, 540px);
    padding: 10px 12px;
    border-radius: 16px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .05);
}

.ad-chat-bubble-row.mine .ad-chat-bubble {
    border-bottom-right-radius: 5px;
    background: #08705f;
    color: #ffffff;
}

.ad-chat-bubble-row.theirs .ad-chat-bubble {
    border: 1px solid rgba(226, 232, 240, .9);
    border-bottom-left-radius: 5px;
    background: #ffffff;
    color: #0f172a;
}

.ad-chat-bubble p {
    margin: 0;
    font-size: 14px;
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.ad-chat-bubble small {
    display: block;
    margin-top: 5px;
    color: inherit;
    font-size: 11px;
    opacity: .72;
}

.ad-chat-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    margin-top: 12px;
}

.ad-chat-form textarea {
    min-height: 48px;
    max-height: 140px;
    resize: vertical;
    border: 1px solid rgba(203, 213, 225, .95);
    border-radius: 16px;
    padding: 12px 14px;
    color: #0f172a;
    outline: none;
}

.ad-chat-form textarea:focus {
    border-color: rgba(8, 112, 95, .5);
    box-shadow: 0 0 0 4px rgba(8, 112, 95, .08);
}

.ad-chat-form textarea:disabled {
    background: #f1f5f9;
    color: #94a3b8;
}

.ad-chat-form button {
    min-width: 90px;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 0;
    border-radius: 999px;
    background: #08705f;
    color: #ffffff;
    font-weight: 850;
}

.ad-chat-form button:disabled {
    background: #cbd5e1;
    color: #64748b;
}

.ad-chat-wait,
.ad-chat-empty-small,
.ad-chat-loading {
    margin-top: 10px;
    padding: 11px 12px;
    border-radius: 14px;
    background: #fff7ed;
    color: #9a3412;
    font-size: 13px;
    font-weight: 650;
}

.ad-chat-empty-small,
.ad-chat-loading {
    background: #f8fafc;
    color: #64748b;
    text-align: center;
}

.ad-message-login {
    max-width: 560px;
    margin-right: auto;
    margin-left: auto;
}

.market-create-page .market-create-hero {
    margin-bottom: 10px !important;
    padding-bottom: 0 !important;
}

.market-create-page .market-create-panel > form > .section-card {
    padding-top: 18px;
}

.market-create-ai-small .app-card {
    background: #f8fafc;
}

.market-status-input {
    min-height: 190px;
    font-size: 15px;
    line-height: 1.65;
}

.market-create-page #create_ad_form .row.g-3.mb-3 {
    align-items: end;
}

.market-create-main-card {
    display: flex;
    flex-direction: column;
}

.market-status-wrap {
    order: -3;
}

.market-detect-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 12px;
    padding: 12px;
    border: 1px solid rgba(8, 112, 95, .16);
    border-radius: 16px;
    background: #f0fdfa;
}

.market-detect-panel b,
.market-detect-panel small {
    display: block;
}

.market-detect-panel b {
    color: #075e54;
    font-size: 13px;
    font-weight: 850;
}

.market-detect-panel small {
    margin-top: 3px;
    color: #64748b;
    font-size: 12px;
    line-height: 1.35;
}

.market-detect-panel button {
    min-height: 34px;
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 12px;
    border: 1px solid rgba(8, 112, 95, .18);
    border-radius: 999px;
    background: #ffffff;
    color: #08705f;
    font-size: 12px;
    font-weight: 850;
}

.market-title-preview {
    display: block;
    margin-top: 9px;
    padding: 9px 11px;
    border: 1px dashed rgba(8, 112, 95, .25);
    border-radius: 8px;
    background: #ffffff;
    color: #08705f;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.45;
}

.market-title-preview[hidden] {
    display: none !important;
}

.market-assisted-field {
    display: none;
}

.market-assisted-open .market-assisted-field {
    display: block;
}

.market-assisted-open .row.market-assisted-field {
    display: flex;
}

.market-location-panel {
    border-color: rgba(8, 112, 95, .12);
    background: #ffffff;
}

.explore-card-media > .lc-save-floating,
.home-explore-media > .lc-save-floating {
    left: auto !important;
    bottom: auto !important;
    max-width: none !important;
    width: auto !important;
    min-width: 0 !important;
    padding: 0 10px !important;
    background: #ffffff !important;
    color: #08705f !important;
}

@media (max-width: 991px) {
    .ad-chat-layout {
        grid-template-columns: 1fr;
    }

    .ad-chat-list-panel,
    .ad-chat-thread-panel {
        min-height: auto;
    }

    .ad-chat-thread,
    .ad-chat-thread-empty {
        min-height: 420px;
    }

    .ad-chat-messages {
        max-height: 430px;
    }
}

@media (max-width: 767px) {
    .header-message-link {
        width: 38px;
        height: 38px;
    }

    .ad-chat-layout {
        gap: 10px;
    }

    .ad-chat-list-panel,
    .ad-chat-thread-panel {
        padding: 12px !important;
    }

    .ad-chat-list-item {
        grid-template-columns: 48px minmax(0, 1fr) auto;
        border-radius: 12px;
    }

    .ad-chat-list-item img {
        width: 48px;
        height: 48px;
    }

    .ad-chat-thread,
    .ad-chat-thread-empty {
        min-height: 360px;
    }

    .ad-chat-messages {
        max-height: 380px;
        padding: 10px;
        border-radius: 14px;
    }

    .ad-chat-bubble {
        max-width: 86%;
    }

    .ad-chat-form {
        grid-template-columns: 1fr;
    }

    .ad-chat-form button {
        width: 100%;
    }

    .market-create-page .section-title {
        font-size: 22px;
    }

    .market-detect-panel {
        align-items: stretch;
        flex-direction: column;
    }

    .market-detect-panel button {
        width: 100%;
    }
}

/* Market detail inline chat, cleaner create form, and explore detail layout */
.seller-inline-chat {
    display: grid;
    gap: 9px;
    margin-top: 14px;
    padding: 12px;
    border: 1px solid rgba(8, 112, 95, .16);
    border-radius: 8px;
    background: #f8fffc;
}

.seller-contact-row .seller-inline-chat {
    margin-top: 0;
    min-height: 100%;
}

.seller-inline-chat label {
    margin: 0;
    color: #0f172a;
    font-size: 13px;
    font-weight: 850;
}

.seller-inline-chat textarea {
    width: 100%;
    min-height: 86px;
    resize: vertical;
    border: 1px solid rgba(203, 213, 225, .95);
    border-radius: 8px;
    padding: 11px 12px;
    color: #0f172a;
    font-size: 14px;
    line-height: 1.55;
    outline: none;
}

.seller-inline-chat textarea:focus {
    border-color: rgba(8, 112, 95, .5);
    box-shadow: 0 0 0 4px rgba(8, 112, 95, .08);
}

.seller-inline-chat textarea:disabled {
    background: #f1f5f9;
    color: #94a3b8;
}

.seller-inline-chat-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.seller-inline-chat-actions .btn {
    min-height: 40px;
    padding: 0 14px;
}

.seller-inline-chat-actions a {
    color: #08705f;
    font-size: 13px;
    font-weight: 850;
    text-decoration: none;
}

.seller-inline-chat small {
    color: #64748b;
    font-size: 12px;
    line-height: 1.45;
}

.seller-inline-chat small.is-error {
    color: #b91c1c;
}

.seller-inline-chat small.is-success {
    color: #08705f;
}

.market-create-page {
    max-width: 1040px;
}

.market-create-page .market-create-hero {
    padding: 16px 18px !important;
    border: 1px solid rgba(8, 112, 95, .12);
    background: linear-gradient(135deg, #ffffff 0%, #f8fffc 100%);
}

.market-create-page .market-create-hero .section-head {
    align-items: center;
    margin-bottom: 0;
}

.market-create-page .market-create-panel,
.market-create-ai-small {
    max-width: 900px;
    margin-right: auto;
    margin-left: auto;
}

.market-create-form {
    display: grid;
    gap: 12px;
}

.market-create-main-card,
.market-location-panel {
    padding: 18px !important;
    border-radius: 8px !important;
}

.market-status-wrap {
    margin-bottom: 0 !important;
}

.market-status-wrap .form-label,
.market-assisted-field .form-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.market-status-wrap .form-label::before,
.market-assisted-open #marketCategoryBlock .form-label::before,
.market-assisted-open #marketPriceBlock .form-label::before {
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #ecfdf5;
    color: #08705f;
    font-size: 12px;
    font-weight: 900;
}

.market-status-wrap .form-label::before {
    content: "1";
}

.market-assisted-open #marketCategoryBlock .form-label::before {
    content: "2";
}

.market-assisted-open #marketPriceBlock .form-label::before {
    content: "3";
}

.market-create-page .market-assisted-open #marketCategoryBlock,
.market-create-page .market-assisted-open #marketPriceBlock,
.market-create-page .market-assisted-open #marketLocationBlock {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid rgba(226, 232, 240, .95);
}

.market-create-page #level_0 {
    max-width: 100% !important;
    height: 50px !important;
    min-height: 50px;
}

.market-location-panel .section-head {
    display: none;
}

.market-location-panel .row {
    align-items: end;
}

.market-form-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 2px;
}

.market-form-actions .btn {
    min-width: 148px;
}

.market-create-ai-small .section-card {
    padding: 14px 16px !important;
    border-radius: 8px !important;
}

.market-create-ai-small .section-title {
    font-size: 17px !important;
}

@media (min-width: 992px) {
    .explore-detail-layout {
        width: 100% !important;
        display: grid;
        grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr);
        gap: 18px;
        align-items: start;
    }

    .explore-detail-hero {
        grid-column: 1 / -1;
        padding-bottom: 12px;
    }

    .explore-detail-hero h1 {
        max-width: 980px;
    }

    .explore-detail-hero p {
        max-width: 820px;
    }

    .explore-article {
        grid-column: 1;
        grid-row: 2;
        min-width: 0;
    }

    .explore-detail-cover {
        grid-column: 2;
        grid-row: 2;
        position: sticky;
        top: 92px;
        aspect-ratio: 4 / 3 !important;
        margin-bottom: 0 !important;
    }

    .explore-related {
        max-width: none;
    }
}

@media (max-width: 991px) {
    .explore-detail-layout {
        width: min(920px, 100%) !important;
        display: block;
    }

    .explore-detail-cover {
        position: static;
        margin-bottom: 16px !important;
    }
}

@media (max-width: 767px) {
    .seller-inline-chat-actions,
    .market-form-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .seller-inline-chat-actions .btn,
    .seller-inline-chat-actions a,
    .market-form-actions .btn {
        width: 100%;
    }

    .seller-inline-chat-actions a {
        min-height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .market-create-page .market-create-hero {
        padding: 14px !important;
    }

    .market-status-input {
        min-height: 210px;
    }
}

/* Tighter explore detail page */
@media (min-width: 992px) {
    .explore-detail {
        max-width: 1160px;
    }

    .explore-detail-layout {
        width: min(1080px, 100%) !important;
        grid-template-columns: minmax(0, 720px) minmax(260px, 320px) !important;
        gap: 16px !important;
    }

    .explore-detail-hero h1 {
        max-width: 900px !important;
        font-size: clamp(26px, 3vw, 38px) !important;
        line-height: 1.18 !important;
    }

    .explore-detail-hero p {
        max-width: 760px !important;
        font-size: 15px !important;
        line-height: 1.6 !important;
    }

    .explore-detail-cover {
        max-height: 360px;
    }

    .explore-article {
        padding: 22px !important;
    }

    .explore-article-content {
        font-size: 15.5px !important;
        line-height: 1.76 !important;
    }

    .explore-article-content h2 {
        font-size: 22px !important;
    }

    .explore-article-content h3 {
        font-size: 18px !important;
    }
}

@media (max-width: 767px) {
    .explore-detail-hero h1 {
        font-size: 24px !important;
        line-height: 1.22 !important;
    }

    .explore-detail-hero p {
        font-size: 14px !important;
        line-height: 1.55 !important;
    }

    .explore-article {
        padding: 16px !important;
    }
}

/* Manual-first market create form */
.market-create-manual {
    max-width: 860px;
}

.market-create-manual .market-create-hero {
    padding: 14px 16px !important;
    border-radius: 8px !important;
}

.market-create-manual .market-create-form {
    display: grid;
    gap: 12px;
}

.market-create-manual .market-create-main-card,
.market-create-manual .market-location-panel {
    display: grid;
    gap: 16px;
    padding: 18px !important;
    border-radius: 8px !important;
}

.market-create-manual .market-form-field {
    display: grid;
    gap: 8px;
}

.market-create-manual .market-contact-note {
    padding: 12px;
    border: 1px dashed #cbd5e1;
    border-radius: 10px;
    background: #f8fafc;
}

.market-create-manual .market-location-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.market-create-manual .market-location-grid .market-form-field {
    min-width: 0;
}

.market-create-manual .form-label {
    margin: 0;
    color: #0f172a;
    font-size: 14px;
}

.market-create-manual .form-label span {
    color: #dc2626;
}

.market-create-manual .form-control,
.market-create-manual .form-select {
    border-color: rgba(203, 213, 225, .95);
    color: #0f172a;
    font-size: 15px;
}

.market-create-manual .form-control:focus,
.market-create-manual .form-select:focus {
    border-color: rgba(8, 112, 95, .5);
    box-shadow: 0 0 0 4px rgba(8, 112, 95, .08);
}

.market-create-manual .market-field-hint {
    color: #64748b;
    font-size: 12px;
    line-height: 1.45;
}

.market-category-chips {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.market-category-chip {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid rgba(203, 213, 225, .95);
    border-radius: 999px;
    background: #ffffff;
    color: #0f172a;
    font-size: 14px;
    font-weight: 750;
}

.market-category-chip i {
    color: #08705f;
}

.market-category-chip.is-active {
    border-color: rgba(8, 112, 95, .35);
    background: #ecfdf5;
    color: #075e54;
    box-shadow: inset 0 0 0 1px rgba(8, 112, 95, .12);
}

.market-create-manual .market-status-input {
    min-height: 150px;
    font-size: 15px;
    line-height: 1.6;
}

.market-image-add {
    width: fit-content;
    min-height: 38px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
}

.market-image-add i {
    font-size: 15px;
}

.market-create-manual .market-image-add + .market-field-hint {
    display: inline-flex;
    margin: 0 0 0 8px;
    font-size: 11.5px;
    line-height: 1.35;
    vertical-align: middle;
}

.market-upload-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin-top: 6px;
}

.market-upload-grid:empty {
    display: none;
}

.market-create-manual .market-image-preview {
    position: relative;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    border-radius: 8px;
    background: #f1f5f9;
}

.market-create-manual .market-image-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.market-create-manual .market-image-preview button {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 26px;
    height: 26px;
    border: 0;
    border-radius: 999px;
    background: rgba(15, 23, 42, .78);
    color: #ffffff;
    font-size: 18px;
    line-height: 1;
}

.market-create-manual .market-image-preview span {
    position: absolute;
    left: 6px;
    bottom: 6px;
    padding: 3px 7px;
    border-radius: 999px;
    background: rgba(8, 112, 95, .92);
    color: #ffffff;
    font-size: 11px;
    font-weight: 800;
}

.market-ai-helper {
    display: none !important;
}

.market-ai-helper b,
.market-ai-helper small {
    display: block;
}

.market-ai-helper b {
    color: #0f172a;
    font-size: 14px;
}

.market-ai-helper small {
    margin-top: 2px;
    color: #64748b;
    font-size: 12px;
}

.market-ai-helper a {
    flex: 0 0 auto;
    color: #08705f;
    font-size: 13px;
    font-weight: 850;
    text-decoration: none;
}

.market-create-manual .market-form-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 0;
}

.market-create-manual .market-form-actions small {
    color: #64748b;
    font-size: 12px;
    line-height: 1.45;
}

.market-create-manual .market-form-actions .btn {
    min-width: 150px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
}

.market-create-manual .market-form-notice {
    margin-top: 0;
    padding: 11px 12px;
    border-radius: 8px;
    background: #ecfdf5;
    color: #075e54;
    font-size: 13px;
    font-weight: 750;
}

.market-create-manual .market-form-notice.is-error {
    background: #fef2f2;
    color: #b91c1c;
}

.market-detail-quick {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
}

.market-detail-quick strong {
    color: #dc2626;
    font-size: clamp(22px, 3vw, 30px);
    font-weight: 900;
    line-height: 1.1;
}

.market-detail-quick span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 10px;
    border-radius: 999px;
    background: #f8fafc;
    color: #475569;
    font-size: 13px;
    font-weight: 750;
}

@media (max-width: 767px) {
    .market-create-manual {
        padding-top: 10px !important;
    }

    .market-create-manual .market-create-hero .section-head {
        align-items: flex-start;
        gap: 8px;
    }

    .market-category-chips {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .market-category-chip {
        justify-content: flex-start;
        padding: 0 12px;
    }

    .market-upload-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .market-create-manual .market-contact-note {
        padding: 10px;
    }

    .market-create-manual .market-location-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .market-create-manual .market-image-add + .market-field-hint {
        display: block;
        margin: 5px 0 0;
    }

    .market-ai-helper,
    .market-create-manual .market-form-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .market-ai-helper a,
    .market-create-manual .market-form-actions .btn {
        width: 100%;
        min-height: 46px;
        justify-content: center;
    }

    .market-create-manual .market-status-input {
        min-height: 140px;
    }
}

/* 2026-05-29: stabilization overrides for ad detail/chat + explore layout */
.seller-contact-row.has-chat {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
}

.seller-phone {
    width: 100%;
}

.seller-inline-chat {
    margin-top: 0 !important;
}

.seller-inline-chat-actions {
    flex-wrap: wrap;
}

.seller-inline-chat-actions a {
    margin-left: auto;
}

.explore-detail {
    overflow-x: hidden;
}

@media (min-width: 992px) {
    .explore-detail-layout {
        width: 100% !important;
        grid-template-columns: minmax(0, 1fr) minmax(280px, 340px) !important;
        gap: 16px !important;
    }

    .explore-detail-cover {
        max-width: 100%;
    }
}

@media (max-width: 767px) {
.seller-inline-chat textarea {
        min-height: 72px;
    }

    .seller-inline-chat-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .seller-inline-chat-actions .btn,
    .seller-inline-chat-actions a {
        width: 100%;
        margin-left: 0;
    }
}

/* 2026-05-29: Bản đồ Lào Cai - khung giao diện mobile-friendly */
.lc-map-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.lc-map-subtitle {
    color: #334155;
    margin: 0;
    font-size: 14px;
}

.lc-map-meta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    background: #ecfeff;
    color: #0f766e;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.lc-map-toolbar {
    margin-top: 12px;
    display: grid;
    gap: 10px;
}

.lc-map-search {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #f8fafc;
    border: 1px solid #d1d5db;
    border-radius: 12px;
    padding: 10px 12px;
}

.lc-map-search i {
    color: #64748b;
}

.lc-map-search input {
    width: 100%;
    border: 0;
    background: transparent;
    outline: none;
    font-size: 14px;
    color: #0f172a;
}

.lc-map-search input::placeholder {
    color: #94a3b8;
}

.lc-map-filter-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.lc-map-filter {
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    background: #fff;
    color: #334155;
    font-size: 13px;
    font-weight: 650;
    padding: 7px 10px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    line-height: 1.2;
    transition: all .2s ease;
    white-space: nowrap;
}

.lc-map-filter.active {
    border-color: #0ea5e9;
    background: #eff6ff;
    color: #0369a1;
}

.lc-map-frame {
    margin-top: 10px;
    position: relative;
    border-radius: 14px;
    background: #0f172a;
    padding: 10px;
}

.lc-map-canvas {
    position: relative;
    min-height: 300px;
    border-radius: 12px;
    overflow: hidden;
    background: radial-gradient(circle at 35% 20%, rgba(56, 189, 248, .2), transparent 46%),
    linear-gradient(160deg, #0b6ea8, #124e84 45%, #0f172a);
}

.lc-map-canvas::before {
    content: "Bản đồ khu vực Lào Cai (khung thăm dò)";
    position: absolute;
    left: 12px;
    top: 12px;
    right: 12px;
    font-size: 12px;
    color: #dbeafe;
    text-shadow: 0 2px 12px rgba(0, 0, 0, .35);
    z-index: 1;
}

.lc-map-canvas-base {
    position: absolute;
    inset: 0;
    border-radius: 12px;
    opacity: 0.2;
    overflow: hidden;
    background: repeating-linear-gradient(
            45deg,
            rgba(255, 255, 255, 0.06) 0,
            rgba(255, 255, 255, 0.06) 1px,
            transparent 1px,
            transparent 13px
    ),
    linear-gradient(170deg, rgba(30, 64, 175, 0.25), rgba(15, 23, 42, 0.25));
    filter: grayscale(1) contrast(.85);
}

.lc-map-pin {
    position: absolute;
    font-size: 12px;
    color: #e2e8f0;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.lc-map-marker {
    position: absolute;
    transform: translate(-50%, -100%);
    z-index: 3;
    border: 0;
    background: transparent;
    padding: 0;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    color: #fff;
    gap: 4px;
    cursor: pointer;
    width: max-content;
}

.lc-map-marker[hidden] {
    display: none;
}

.lc-map-marker-dot {
    width: 30px;
    height: 30px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    border: 2px solid rgba(255, 255, 255, .75);
    background: rgba(15, 118, 110, 0.98);
}

.lc-map-marker-text {
    font-size: 11px;
    background: rgba(2, 6, 23, 0.75);
    border-radius: 999px;
    padding: 2px 8px;
    max-width: 160px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lc-map-marker--du-lich .lc-map-marker-dot {
    background: #0ea5e9;
}

.lc-map-marker--am-thuc .lc-map-marker-dot {
    background: #a855f7;
}

.lc-map-marker--diem-mua-ban .lc-map-marker-dot {
    background: #f97316;
}

.lc-map-marker--dich-vu .lc-map-marker-dot {
    background: #10b981;
}

.lc-map-marker--su-kien .lc-map-marker-dot {
    background: #ef4444;
}

.lc-map-marker.is-active .lc-map-marker-dot {
    box-shadow: 0 0 0 5px rgba(56, 189, 248, .35);
    transform: scale(1.1);
}

.lc-map-popup {
    position: absolute;
    right: 14px;
    bottom: 14px;
    left: 14px;
    background: rgba(2, 6, 23, .88);
    color: #f8fafc;
    border-radius: 12px;
    border: 1px solid rgba(148, 163, 184, .35);
    padding: 10px;
    display: grid;
    grid-template-columns: 90px 1fr;
    gap: 10px;
    z-index: 4;
    box-shadow: 0 10px 30px rgba(2, 6, 23, .35);
}

.lc-map-popup[hidden] {
    display: none;
}

.lc-map-popup img {
    width: 90px;
    height: 66px;
    object-fit: cover;
    border-radius: 9px;
}

.lc-map-popup h3 {
    margin: 0;
    font-size: 16px;
    line-height: 1.2;
}

.lc-map-popup > div p {
    margin: 8px 0 0;
    font-size: 13px;
    color: #cbd5e1;
}

.lc-map-popup-meta {
    color: #bae6fd;
    font-size: 12px;
    margin-top: 8px !important;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.lc-map-popup .btn {
    margin-top: 8px;
    font-size: 12px;
}

.lc-map-list-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.lc-map-list-head small {
    color: #64748b;
    font-size: 13px;
}

.lc-map-list {
    display: grid;
    gap: 10px;
}

.lc-map-place-card {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #fff;
    overflow: hidden;
}

.lc-map-place-card.is-hidden {
    display: none;
}

.lc-map-place-quick {
    border: 0;
    width: 100%;
    display: grid;
    grid-template-columns: 94px 1fr;
    gap: 10px;
    text-align: left;
    background: transparent;
    padding: 0;
}

.lc-map-place-quick img {
    width: 94px;
    height: 94px;
    object-fit: cover;
}

.lc-map-place-body {
    padding: 10px 10px 10px 0;
}

.lc-map-place-body h3 {
    margin: 0;
    font-size: 15px;
    line-height: 1.2;
}

.lc-map-place-body p {
    margin: 5px 0 0;
    color: #475569;
    font-size: 13px;
    line-height: 1.4;
}

.lc-map-place-category {
    display: inline-flex;
    padding: 3px 8px;
    border-radius: 999px;
    background: #ecfeff;
    color: #0e7490;
    font-size: 11px;
    font-weight: 750;
}

.lc-map-place-meta {
    margin-top: 7px;
    color: #334155;
    font-size: 12px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.lc-map-place-link {
    display: block;
    font-size: 13px;
    text-decoration: none;
    border-top: 1px solid #e2e8f0;
    padding: 8px 10px 10px;
    color: #0284c7;
    font-weight: 700;
}

.lc-map-empty {
    margin-top: 10px;
    border-radius: 10px;
    padding: 10px;
    background: #f8fafc;
    border: 1px dashed #cbd5e1;
    color: #475569;
    font-size: 13px;
}

    @media (max-width: 767px) {
        .lc-map-head {
            align-items: flex-start;
            flex-direction: column;
        }

    .lc-map-meta {
        width: 100%;
        justify-content: center;
    }

    .lc-map-place-body {
        padding-right: 8px;
    }

    .lc-map-popup {
        grid-template-columns: 72px 1fr;
        right: 10px;
        left: 10px;
        bottom: 10px;
    }

    .lc-map-popup img {
        width: 72px;
        height: 60px;
    }

        .lc-map-marker-text {
            max-width: 110px;
        }

        .lc-map-place-quick {
            grid-template-columns: 86px 1fr;
            gap: 8px;
        }

    .lc-map-place-quick img {
        width: 86px;
        height: 86px;
    }
}

/* Homepage "Tin moi": force 1 item per row */
.page-ui-home #newsList.trend-list,
.page-ui-home .trend-list {
    grid-template-columns: minmax(0, 1fr) !important;
}

/* Homepage "Tin chợ mới": compact 6-card grid */
.page-ui-home #homeMarketGrid.market-listing-grid,
.page-ui-home .home-market .market-listing-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-auto-flow: row !important;
}

@media (max-width: 767px) {
    .page-ui-home #homeMarketGrid.market-listing-grid,
    .page-ui-home .home-market .market-listing-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

/* 2026-06-02: Chợ online now has 5 root categories, keep the grid balanced. */
.page-ui-home .home-market .market-category-grid,
.market-page .market-category-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

.page-ui-home .home-market .market-category {
    min-height: 74px !important;
    flex-direction: row !important;
    justify-content: flex-start !important;
    text-align: left !important;
    padding: 12px !important;
}

.page-ui-home .home-market .market-category > span:last-child,
.market-page .market-category > span:last-child {
    min-width: 0;
}

.page-ui-home .home-market .market-category b,
.market-page .market-category b {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 991px) {
    .page-ui-home .home-market .market-category-grid,
    .market-page .market-category-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 575px) {
    .page-ui-home .home-market .market-category-grid,
    .market-page .market-category-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .page-ui-home .home-market .market-category,
    .market-page .market-category {
        min-height: 66px !important;
        padding: 10px !important;
    }

    .page-ui-home .home-market .market-category:nth-child(5),
    .market-page .market-category:nth-child(5) {
        grid-column: 1 / -1;
    }
}

/* 2026-06-02: expose 3 Khám phá cards as a standalone homepage section. */
.page-ui-home .home-explore .section-head {
    margin-bottom: 12px !important;
}

.page-ui-home .home-explore-card {
    color: var(--lc-text);
}

.page-ui-home .home-explore-body h3 {
    display: -webkit-box;
    min-height: 43px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.page-ui-home .home-explore-body h3 a:hover {
    color: #0f766e;
}

@media (max-width: 767px) {
    .page-ui-home .home-explore-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 10px !important;
    }

    .page-ui-home .home-explore-body h3 {
        min-height: auto;
    }
}

/* 2026-05-30: AI assistant ChatGPT-like layout and scroll behavior */
body.page-ui-chat-ai,
body.page-ui-chat-ai .main,
body.page-ui-chat-ai .main-wrap {
    min-height: 100dvh;
}

body.page-ui-chat-ai .bottom-nav,
body.page-ui-chat-ai .floating-ai-shortcut {
    display: none !important;
}

body.page-ui-chat-ai .chat-page {
    min-height: 100dvh !important;
    padding: 18px 12px !important;
    background: #f6f8fb;
}

body.page-ui-chat-ai .chat-shell {
    min-height: 0;
    align-items: stretch;
}

body.page-ui-chat-ai .chat-main {
    height: min(820px, calc(100dvh - 36px)) !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    border-radius: 20px !important;
    background: #ffffff !important;
    box-shadow: 0 16px 42px rgba(15, 23, 42, .08) !important;
}

body.page-ui-chat-ai .chat-hero,
body.page-ui-chat-ai #chatQuickActions,
body.page-ui-chat-ai .chat-smart-strip-wrap,
body.page-ui-chat-ai .chat-intent-bar,
body.page-ui-chat-ai .chat-input-wrap {
    flex: 0 0 auto;
}

body.page-ui-chat-ai .chat-hero {
    background: linear-gradient(135deg, #0f766e, #2563eb) !important;
}

body.page-ui-chat-ai .chat-title {
    letter-spacing: 0 !important;
}

body.page-ui-chat-ai .chat-body {
    position: relative;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scroll-behavior: smooth;
    padding: 16px 16px 20px !important;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

body.page-ui-chat-ai .chat-messages {
    min-height: 100%;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

body.page-ui-chat-ai .chat-end-anchor {
    width: 100%;
    height: 1px;
    flex: 0 0 1px;
}

body.page-ui-chat-ai .chat-jump-bottom {
    position: sticky;
    left: 50%;
    bottom: 10px;
    z-index: 4;
    width: fit-content;
    min-height: 38px;
    margin: 8px auto 0;
    padding: 0 13px;
    border: 1px solid rgba(15, 118, 110, .22);
    border-radius: 999px;
    background: #ffffff;
    color: #0f766e;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .14);
    font-size: 13px;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

body.page-ui-chat-ai .chat-jump-bottom[hidden] {
    display: none !important;
}

body.page-ui-chat-ai .msg {
    width: 100%;
}

body.page-ui-chat-ai .msg.user {
    align-self: flex-end;
}

body.page-ui-chat-ai .msg.bot {
    align-self: flex-start;
}

body.page-ui-chat-ai .msg-bubble {
    max-width: min(760px, 88%) !important;
    overflow-wrap: anywhere;
    word-break: break-word;
    font-size: 15px !important;
    line-height: 1.58 !important;
    border: 1px solid rgba(229, 231, 235, .9);
}

body.page-ui-chat-ai .msg.user .msg-bubble {
    border-color: rgba(15, 118, 110, .16);
    background: #0f766e !important;
}

body.page-ui-chat-ai .msg.bot .msg-bubble {
    background: #ffffff !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .05);
}

body.page-ui-chat-ai .chat-input-wrap {
    position: relative !important;
    z-index: 5;
    padding: 12px 14px calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    border-top: 1px solid #e5e7eb !important;
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: 0 -10px 28px rgba(15, 23, 42, .05);
}

body.page-ui-chat-ai .chat-form {
    width: min(820px, 100%);
    margin: 0 auto;
    padding: 7px;
    border: 1px solid #e5e7eb;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 10px 26px rgba(15, 23, 42, .08);
}

body.page-ui-chat-ai .chat-attach,
body.page-ui-chat-ai .chat-send {
    flex: 0 0 46px;
    width: 46px !important;
    height: 46px !important;
    min-height: 46px;
    border-radius: 15px !important;
}

body.page-ui-chat-ai .chat-input {
    min-height: 46px !important;
    font-size: 15px !important;
}

body.page-ui-chat-ai .chat-send:disabled {
    background: #94a3b8 !important;
    box-shadow: none !important;
}

@media (max-width: 767px) {
    body.page-ui-chat-ai {
        overflow: hidden;
    }

    body.page-ui-chat-ai .chat-page {
        height: 100dvh !important;
        width: 100vw !important;
        max-width: 100vw !important;
        padding: 0 !important;
        overflow: hidden !important;
    }

    body.page-ui-chat-ai .chat-shell {
        width: 100vw !important;
        max-width: 100vw !important;
        height: 100dvh;
        min-height: 100dvh;
        display: block !important;
        overflow: hidden !important;
    }

    body.page-ui-chat-ai .chat-main {
        width: 100vw !important;
        max-width: 100vw !important;
        height: 100dvh !important;
        min-height: 100dvh !important;
        border: 0 !important;
        border-radius: 0 !important;
        overflow-x: hidden !important;
    }

    body.page-ui-chat-ai .chat-hero {
        padding: 12px 12px 10px !important;
    }

    body.page-ui-chat-ai .chat-title {
        font-size: 22px !important;
        line-height: 1.18 !important;
        max-width: calc(100vw - 24px) !important;
    }

    body.page-ui-chat-ai .chat-desc {
        max-width: calc(100vw - 24px) !important;
        font-size: 13px !important;
        line-height: 1.45 !important;
    }

    body.page-ui-chat-ai .chat-trust {
        display: none !important;
    }

    body.page-ui-chat-ai .chat-actions {
        flex-direction: row !important;
        width: auto !important;
    }

    body.page-ui-chat-ai .chat-action-btn {
        width: 40px;
        height: 40px;
        min-height: 40px;
        flex: 0 0 40px !important;
        padding: 0 !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    body.page-ui-chat-ai #chatQuickActions {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        padding: 10px 12px 2px !important;
        overflow-x: hidden !important;
        width: 100% !important;
        max-width: 100vw !important;
    }

    body.page-ui-chat-ai #chatQuickActions .suggestion,
    body.page-ui-chat-ai .chat-smart-strip .suggestion {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 42px;
    }

    body.page-ui-chat-ai .chat-smart-strip-wrap {
        padding: 8px 12px 0 !important;
    }

    body.page-ui-chat-ai .chat-smart-strip {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        overflow-x: hidden !important;
        width: 100% !important;
        max-width: 100vw !important;
    }

    body.page-ui-chat-ai .chat-intent-bar {
        padding: 8px 12px 0 !important;
    }

    body.page-ui-chat-ai .chat-body {
        padding: 12px 10px 16px !important;
        max-width: 100vw !important;
    }

    body.page-ui-chat-ai .msg {
        gap: 8px !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    body.page-ui-chat-ai .msg-avatar {
        width: 30px !important;
        height: 30px !important;
        flex-basis: 30px !important;
        font-size: 11px !important;
    }

    body.page-ui-chat-ai .msg-bubble {
        max-width: calc(100vw - 84px) !important;
        min-width: 0 !important;
        font-size: 14px !important;
        padding: 11px 12px !important;
    }

    body.page-ui-chat-ai .result-grid {
        grid-template-columns: 1fr !important;
    }

    body.page-ui-chat-ai .chat-input-wrap {
        padding: 9px 10px calc(10px + env(safe-area-inset-bottom, 0px)) !important;
        max-width: 100vw !important;
        overflow: hidden !important;
    }

    body.page-ui-chat-ai .chat-form {
        grid-template-columns: 42px minmax(0, calc(100vw - 122px)) 42px !important;
        display: grid !important;
        gap: 7px !important;
        padding: 6px !important;
        border-radius: 16px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    body.page-ui-chat-ai .chat-attach,
    body.page-ui-chat-ai .chat-send {
        display: inline-flex !important;
        width: 42px !important;
        height: 42px !important;
        min-height: 42px !important;
        flex-basis: 42px !important;
        border-radius: 14px !important;
    }

    body.page-ui-chat-ai .chat-input {
        min-height: 42px !important;
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 11px 12px !important;
        font-size: 14px !important;
    }
}

/* Final Explore polish overrides for rules appended earlier in the legacy bundle */
.explore-page .explore-hero-kicker {
    display: inline-flex !important;
}

.explore-page .explore-hero p {
    display: block !important;
}

.explore-page .explore-card-body p {
    display: -webkit-box !important;
}

.explore-page .explore-card-read {
    display: inline-flex !important;
}

.explore-detail-actions .explore-audio-btn,
.explore-detail-actions .explore-share-btn {
    display: inline-flex !important;
}

.explore-audio-btn.is-disabled,
.explore-audio-btn:disabled {
    cursor: not-allowed !important;
    opacity: .68 !important;
    transform: none !important;
    box-shadow: none !important;
    background: #64748b !important;
}

.explore-audio-box {
    margin-top: 12px;
    border: 1px solid rgba(15, 118, 110, .16);
    border-radius: 14px;
    background: rgba(240, 253, 250, .86);
    padding: 12px;
}

.explore-audio-box[hidden] {
    display: none !important;
}

.explore-audio-player {
    width: 100%;
    display: block;
}

/* Market icons and mobile polish - final override */
.market-category .market-icon {
    position: relative;
    width: 48px !important;
    height: 48px !important;
    border-radius: 16px !important;
    font-size: 21px !important;
    overflow: hidden;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .7), 0 12px 22px rgba(15, 23, 42, .09);
}

.market-category .market-icon::after {
    content: "";
    position: absolute;
    inset: 7px;
    z-index: 0;
    border-radius: 12px;
    background: rgba(255, 255, 255, .46);
}

.market-category .market-icon i,
.market-category .market-icon img {
    position: relative;
    z-index: 1;
}

.market-category .market-icon.ico-fresh,
.market-category .market-icon.ico-green {
    color: #047857 !important;
    background: linear-gradient(135deg, #bbf7d0, #ecfdf5) !important;
}

.market-category .market-icon.ico-food,
.market-category .market-icon.ico-orange {
    color: #be123c !important;
    background: linear-gradient(135deg, #ffe4e6, #fff7ed) !important;
}

.market-category .market-icon.ico-seed {
    color: #15803d !important;
    background: linear-gradient(135deg, #dcfce7, #fef9c3) !important;
}

.market-category .market-icon.ico-tool,
.market-category .market-icon.ico-slate {
    color: #475569 !important;
    background: linear-gradient(135deg, #e2e8f0, #f8fafc) !important;
}

.market-category .market-icon.ico-service,
.market-category .market-icon.ico-blue {
    color: #1d4ed8 !important;
    background: linear-gradient(135deg, #dbeafe, #ecfeff) !important;
}

.market-category .market-icon i {
    line-height: 1;
}

.market-category {
    border-radius: 14px !important;
}

@media (max-width: 767px) {
    .home-market .market-category-grid,
    .market-page .market-category-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    .home-market .market-category,
    .market-page .market-category {
        display: grid !important;
        grid-template-columns: 40px minmax(0, 1fr);
        align-items: center !important;
        min-height: 58px !important;
        gap: 8px !important;
        padding: 9px !important;
        text-align: left !important;
        border-radius: 14px !important;
        background: #fff !important;
    }

    .home-market .market-icon,
    .market-page .market-icon {
        width: 40px !important;
        height: 40px !important;
        flex: 0 0 40px !important;
        font-size: 18px !important;
    }

    .home-market .market-category b,
    .market-page .market-category b {
        font-size: 13.5px !important;
        line-height: 1.22 !important;
    }

    .home-market .market-category small,
    .market-page .market-category small {
        display: none !important;
    }

    .home-market .market-category:nth-child(5),
    .market-page .market-category:nth-child(5) {
        grid-column: 1 / -1;
    }
}

/* Header post menu, market icon set and forum inline images */
.lc-header .post-menu,
.lc-header .header-more-menu {
    min-width: 218px;
    padding: 8px;
    border: 1px solid rgba(15, 118, 110, .14);
    border-radius: 14px;
    box-shadow: 0 18px 38px rgba(15, 23, 42, .12);
}

.lc-header .post-menu .dropdown-item,
.lc-header .header-more-menu .dropdown-item {
    min-height: 42px;
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 10px;
    color: #1f2937;
    font-weight: 820;
}

.lc-header .post-menu .dropdown-item i,
.lc-header .header-more-menu .dropdown-item i {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    background: #ecfdf5;
    color: #0f766e;
}

.lc-header .post-menu .dropdown-item:hover,
.lc-header .post-menu .dropdown-item:focus-visible,
.lc-header .header-more-menu .dropdown-item:hover,
.lc-header .header-more-menu .dropdown-item:focus-visible,
.lc-header .header-more-menu .dropdown-item.active {
    background: #f0fdfa;
    color: #0f766e;
}

@media (max-width: 1280px) {
    .lc-header .header-nav {
        gap: 3px !important;
    }

    .lc-header .header-nav-link {
        padding-inline: 8px !important;
        font-size: 12.5px !important;
    }

    .lc-header .header-nav-link i {
        font-size: 14px !important;
    }
}

.home-market .section-head {
    align-items: flex-start !important;
    gap: 10px !important;
}

.home-market .market-home-title {
    display: block !important;
}

.page-ui-home .home-market .market-category,
.market-page .market-category {
    border-color: rgba(148, 163, 184, .22) !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .045) !important;
}

.market-category .market-icon {
    border: 1px solid rgba(148, 163, 184, .22) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .62), 0 9px 18px rgba(15, 23, 42, .06) !important;
}

.market-category .market-icon.ico-fresh,
.market-category .market-icon.ico-green {
    color: #047857 !important;
    background: linear-gradient(135deg, #dcfce7, #f0fdf4) !important;
}

.market-category .market-icon.ico-food,
.market-category .market-icon.ico-orange {
    color: #be123c !important;
    background: linear-gradient(135deg, #ffe4e6, #fff7ed) !important;
}

.market-category .market-icon.ico-seed {
    color: #15803d !important;
    background: linear-gradient(135deg, #dcfce7, #fef9c3) !important;
}

.market-category .market-icon.ico-tool,
.market-category .market-icon.ico-slate {
    color: #475569 !important;
    background: linear-gradient(135deg, #e2e8f0, #f8fafc) !important;
}

.market-category .market-icon.ico-service,
.market-category .market-icon.ico-blue {
    color: #2563eb !important;
    background: linear-gradient(135deg, #dbeafe, #ecfeff) !important;
}

.ico-fresh { color: #047857; background: #ecfdf5; }
.ico-food { color: #be123c; background: #fff1f2; }
.ico-seed { color: #15803d; background: #f0fdf4; }
.ico-tool { color: #475569; background: #f8fafc; }
.ico-service { color: #2563eb; background: #eff6ff; }

.forum-inline-image {
    margin: 12px 0;
}

.forum-content .forum-inline-image .forum-media-item,
.forum-content > .forum-media-grid .forum-media-item {
    max-width: 760px;
}

.forum-content .forum-inline-image .forum-media-item {
    display: block;
    aspect-ratio: 16 / 10;
}

.forum-comment-body {
    margin: 8px 0 10px;
    color: #334155;
    line-height: 1.62;
}

.forum-comment-body .forum-inline-image .forum-media-item,
.forum-comment-body > .forum-media-grid .forum-media-item {
    max-width: 420px;
}

.forum-comment-body .forum-inline-image .forum-media-item {
    display: block;
    aspect-ratio: 4 / 3;
}

.forum-comment-body > .forum-media-grid {
    grid-template-columns: repeat(3, minmax(72px, 1fr));
    max-width: 420px;
}

@media (max-width: 767px) {
    .lc-header .header-post-dropdown .post-btn {
        display: inline-flex !important;
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        justify-content: center !important;
        padding: 0 !important;
        border-radius: 12px !important;
    }

    .lc-header .header-post-dropdown .post-btn span {
        display: none !important;
    }

    .lc-header .header-post-dropdown .post-menu {
        min-width: 206px;
    }

    .home-market .section-head {
        display: flex !important;
        align-items: center !important;
    }

    .home-market .section-link {
        align-self: center !important;
        white-space: nowrap;
    }

    .forum-content .forum-inline-image .forum-media-item,
    .forum-content > .forum-media-grid .forum-media-item,
    .forum-comment-body .forum-inline-image .forum-media-item,
    .forum-comment-body > .forum-media-grid .forum-media-item {
        max-width: 100%;
    }

    .forum-comment-body > .forum-media-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-width: 100%;
    }
}

/* 2026-06-03: final audit polish for market/forum mobile flow. */
.forum-page {
    gap: 12px !important;
}

.forum-page .forum-filter-row {
    padding: 4px 0;
}

.forum-page .forum-post {
    border-radius: 12px !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .045) !important;
}

.forum-page .forum-status-text {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
}

.forum-page .forum-engagement span,
.forum-page .forum-post-submeta span {
    min-height: 24px;
    padding: 3px 8px;
    border: 1px solid rgba(148, 163, 184, .22);
    border-radius: 999px;
    background: #f8fafc;
    color: #475569;
}

.forum-page .forum-post-submeta span:nth-child(2) {
    border-color: rgba(15, 118, 110, .18);
    background: #ecfdf5;
    color: #0f766e;
}

.market-page .market-listing-card,
.page-ui-home .home-market .market-listing-card {
    border-radius: 12px !important;
}

.market-page .market-post-body h3,
.page-ui-home .home-market .market-post-body h3 {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.market-page .market-post-meta,
.page-ui-home .home-market .market-post-meta {
    gap: 6px !important;
}

@media (max-width: 767px) {
    .bottom-nav {
        bottom: max(10px, env(safe-area-inset-bottom, 0px)) !important;
    }

    .main-wrap {
        padding-bottom: calc(104px + env(safe-area-inset-bottom, 0px)) !important;
    }

    .forum-page .forum-filter-row {
        overflow-x: auto;
        flex-wrap: nowrap !important;
        padding-bottom: 6px;
        scrollbar-width: none;
    }

    .forum-page .forum-filter-row::-webkit-scrollbar {
        display: none;
    }

    .forum-page .forum-filter {
        flex: 0 0 auto;
    }

    .forum-page .forum-post {
        padding: 12px !important;
    }

    .forum-page .forum-post-submeta span:nth-child(2),
    .forum-page .forum-engagement span:nth-child(3) {
        display: none !important;
    }

    .forum-page .forum-image-strip {
        max-width: 100% !important;
    }

    .market-page .market-post-meta span,
    .page-ui-home .home-market .market-post-meta span {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

/* 2026-06-04: Explore v2 editorial layout */
.explore-page-v2,
.explore-detail {
    --explore-ink: #10231f;
    --explore-muted: #66756f;
    --explore-line: rgba(108, 125, 117, .18);
    --explore-green: #0b6b58;
    --explore-green-2: #12916f;
    --explore-moss: #dcebd7;
    --explore-sand: #f5ead7;
    --explore-amber: #c47a28;
    --explore-shadow: 0 26px 70px rgba(27, 44, 38, .12);
    --explore-soft-shadow: 0 16px 38px rgba(27, 44, 38, .09);
    font-family: "Be Vietnam Pro", "Plus Jakarta Sans", "Segoe UI", sans-serif;
}

.explore-page-v2 {
    max-width: 1240px;
}

.explore-page-v2 .explore-hero {
    position: relative;
    isolation: isolate;
    display: grid !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(320px, .72fr);
    grid-template-areas:
        "copy visual"
        "actions visual";
    gap: 18px 24px !important;
    overflow: hidden;
    padding: clamp(20px, 3vw, 34px) !important;
    border: 1px solid rgba(255, 255, 255, .72) !important;
    border-radius: 30px !important;
    background:
        radial-gradient(circle at 12% 18%, rgba(245, 234, 215, .95), transparent 34%),
        radial-gradient(circle at 88% 16%, rgba(184, 218, 201, .72), transparent 36%),
        linear-gradient(135deg, #f9f7ef 0%, #edf7ef 52%, #e7f2eb 100%) !important;
    box-shadow: var(--explore-shadow) !important;
}

.explore-page-v2 .explore-hero::before,
.explore-page-v2 .explore-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    border-radius: 999px;
    pointer-events: none;
}

.explore-page-v2 .explore-hero::before {
    width: 260px;
    height: 260px;
    left: -90px;
    bottom: -130px;
    background: rgba(11, 107, 88, .14);
}

.explore-page-v2 .explore-hero::after {
    width: 150px;
    height: 150px;
    right: 29%;
    top: -62px;
    border: 22px solid rgba(196, 122, 40, .13);
}

.explore-page-v2 .explore-hero-copy {
    grid-area: copy;
    max-width: 720px;
    z-index: 2;
}

.explore-page-v2 .explore-hero-kicker {
    width: fit-content;
    min-height: 36px;
    padding: 0 13px !important;
    border: 1px solid rgba(11, 107, 88, .14) !important;
    border-radius: 999px !important;
    background: rgba(255, 255, 255, .72) !important;
    color: var(--explore-green) !important;
    box-shadow: 0 10px 28px rgba(11, 107, 88, .08);
}

.explore-page-v2 .explore-hero h1 {
    max-width: 680px;
    margin-top: 16px !important;
    color: var(--explore-ink) !important;
    font-size: clamp(36px, 5.2vw, 68px) !important;
    font-weight: 950 !important;
    line-height: .94 !important;
    letter-spacing: -2.2px !important;
}

.explore-page-v2 .explore-hero h1 i {
    display: none !important;
}

.explore-page-v2 .explore-hero p {
    max-width: 620px !important;
    margin-top: 16px !important;
    color: #4c625a !important;
    font-size: 16px !important;
    line-height: 1.75 !important;
}

.explore-page-v2 .explore-hero-stats {
    margin-top: 18px !important;
    gap: 8px !important;
}

.explore-page-v2 .explore-hero-stats span {
    min-height: 34px;
    padding: 7px 11px !important;
    border: 1px solid rgba(11, 107, 88, .12) !important;
    background: rgba(255, 255, 255, .68) !important;
    color: #204b41 !important;
    font-weight: 850 !important;
    backdrop-filter: blur(12px);
}

.explore-hero-visual {
    grid-area: visual;
    position: relative;
    min-height: 330px;
    overflow: hidden;
    border: 8px solid rgba(255, 255, 255, .72);
    border-radius: 28px;
    color: #ffffff;
    text-decoration: none;
    box-shadow: 0 24px 58px rgba(15, 51, 41, .2);
    transform: rotate(1.2deg);
}

.explore-hero-visual img {
    width: 100%;
    height: 100%;
    min-height: 330px;
    object-fit: cover;
    transform: scale(1.02);
    transition: transform .5s ease;
}

.explore-hero-visual:hover img {
    transform: scale(1.08);
}

.explore-hero-visual__shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(12, 28, 24, .08), rgba(12, 28, 24, .72));
}

.explore-hero-visual__label,
.explore-hero-visual__caption {
    position: absolute;
    left: 18px;
    right: 18px;
    z-index: 2;
}

.explore-hero-visual__label {
    top: 18px;
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 11px;
    border: 1px solid rgba(255, 255, 255, .34);
    border-radius: 999px;
    background: rgba(9, 28, 24, .42);
    font-size: 12px;
    font-weight: 900;
    backdrop-filter: blur(14px);
}

.explore-hero-visual__caption {
    bottom: 18px;
    display: grid;
    gap: 7px;
}

.explore-hero-visual__caption b {
    font-size: 22px;
    line-height: 1.16;
    letter-spacing: -.55px;
}

.explore-hero-visual__caption small {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: rgba(255, 255, 255, .86);
    font-size: 13px;
    font-weight: 800;
}

.explore-page-v2 .explore-hero-actions {
    grid-area: actions;
    align-self: end;
    justify-content: flex-start !important;
}

.explore-page-v2 .explore-hero-action {
    min-height: 44px;
    padding: 0 16px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, var(--explore-green), var(--explore-green-2)) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(11, 107, 88, .22);
}

.explore-page-v2 .explore-hero-action--light {
    border: 1px solid rgba(11, 107, 88, .16) !important;
    background: rgba(255, 255, 255, .76) !important;
    color: var(--explore-green) !important;
    box-shadow: none;
}

.explore-page-v2 .explore-filter-row {
    display: flex !important;
    gap: 9px !important;
    margin: 18px 0 !important;
    padding: 6px !important;
    overflow-x: auto;
    border: 1px solid rgba(148, 163, 184, .16);
    border-radius: 999px;
    background: rgba(255, 255, 255, .72);
    box-shadow: 0 12px 34px rgba(15, 23, 42, .05);
    scrollbar-width: none;
}

.explore-page-v2 .explore-filter-row::-webkit-scrollbar {
    display: none;
}

.explore-page-v2 .explore-filter {
    flex: 0 0 auto;
    min-height: 40px;
    padding: 0 14px !important;
    border: 0 !important;
    background: transparent !important;
    color: #53665f !important;
    font-size: 13px !important;
    font-weight: 900 !important;
}

.explore-page-v2 .explore-filter:hover,
.explore-page-v2 .explore-filter.active {
    background: #0b6b58 !important;
    color: #ffffff !important;
    box-shadow: 0 10px 24px rgba(11, 107, 88, .18);
}

.explore-content-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    margin: 8px 0 14px;
}

.explore-content-head .section-title {
    font-size: clamp(22px, 2.4vw, 32px);
    font-weight: 950;
    letter-spacing: -.9px;
}

.explore-content-count {
    flex: 0 0 auto;
    padding: 8px 12px;
    border: 1px solid rgba(11, 107, 88, .12);
    border-radius: 999px;
    background: #ffffff;
    color: var(--explore-green);
    font-size: 12px;
    font-weight: 900;
}

.explore-content-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 20px;
    align-items: start;
}

.explore-page-v2 .explore-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px !important;
}

.explore-page-v2 .explore-card {
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, .16) !important;
    border-radius: 22px !important;
    background: rgba(255, 255, 255, .92) !important;
    box-shadow: 0 18px 46px rgba(15, 23, 42, .07) !important;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.explore-page-v2 .explore-card:hover {
    transform: translateY(-4px);
    border-color: rgba(11, 107, 88, .22) !important;
    box-shadow: 0 24px 58px rgba(15, 23, 42, .11) !important;
}

.explore-page-v2 .explore-card-media {
    aspect-ratio: 16 / 10;
    background: #eaf2ee;
}

.explore-page-v2 .explore-card-media::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 42%;
    background: linear-gradient(180deg, transparent, rgba(12, 28, 24, .42));
    pointer-events: none;
}

.explore-page-v2 .explore-card-media img {
    height: 100% !important;
    filter: saturate(1.04) contrast(1.02);
}

.explore-page-v2 .explore-card-badge {
    z-index: 3;
    border: 1px solid rgba(255, 255, 255, .34) !important;
    background: rgba(12, 39, 33, .72) !important;
    color: #ffffff !important;
    backdrop-filter: blur(12px);
}

.explore-page-v2 .explore-card-body {
    display: grid;
    gap: 10px;
    padding: 16px !important;
}

.explore-page-v2 .explore-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px !important;
}

.explore-page-v2 .explore-card-meta span {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 8px;
    border-radius: 999px;
    background: #f4f8f5;
    color: #64756e;
    font-size: 11.5px;
    font-weight: 800;
}

.explore-page-v2 .explore-card-body h2 {
    margin: 0 !important;
    font-size: 18px !important;
    line-height: 1.32 !important;
    letter-spacing: -.35px;
}

.explore-page-v2 .explore-card-body h2 a {
    color: var(--explore-ink) !important;
}

.explore-page-v2 .explore-card-body p {
    min-height: 42px;
    margin: 0 !important;
    color: var(--explore-muted) !important;
    font-size: 14px !important;
    line-height: 1.58 !important;
}

.explore-page-v2 .explore-card-read {
    width: fit-content;
    min-height: 36px;
    margin-top: 2px;
    padding: 0 12px !important;
    border-radius: 999px !important;
    background: #edf7ef !important;
    color: var(--explore-green) !important;
    font-size: 13px !important;
    font-weight: 950 !important;
}

.explore-page-v2 .explore-card--featured {
    grid-column: 1 / -1;
    display: grid !important;
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
}

.explore-page-v2 .explore-card--featured .explore-card-media {
    min-height: 100%;
    aspect-ratio: auto;
}

.explore-page-v2 .explore-card--featured .explore-card-body {
    align-content: center;
    padding: clamp(18px, 3vw, 30px) !important;
}

.explore-page-v2 .explore-card--featured .explore-card-body h2 {
    font-size: clamp(26px, 3.4vw, 42px) !important;
    line-height: 1.05 !important;
    letter-spacing: -1.1px;
}

.explore-rail {
    display: grid;
    gap: 14px;
    position: sticky;
    top: 86px;
}

.explore-rail-card {
    display: grid;
    gap: 10px;
    padding: 17px;
    border: 1px solid rgba(148, 163, 184, .17);
    border-radius: 20px;
    background: #ffffff;
    box-shadow: var(--explore-soft-shadow);
}

.explore-rail-card--accent {
    overflow: hidden;
    background:
        radial-gradient(circle at 90% 10%, rgba(196, 122, 40, .19), transparent 36%),
        linear-gradient(145deg, #0b6b58, #143f36);
    color: #ffffff;
}

.explore-rail-kicker {
    width: fit-content;
    padding: 5px 8px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    color: rgba(255, 255, 255, .82);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.explore-rail-card h3 {
    margin: 0;
    color: inherit;
    font-size: 18px;
    font-weight: 950;
    letter-spacing: -.4px;
}

.explore-rail-card p {
    margin: 0;
    color: rgba(255, 255, 255, .78);
    font-size: 13px;
    line-height: 1.62;
}

.explore-rail-card a {
    min-height: 42px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 0 11px;
    border: 1px solid rgba(11, 107, 88, .11);
    border-radius: 13px;
    background: #f7fbf8;
    color: #173d34;
    font-size: 13px;
    font-weight: 900;
    text-decoration: none;
}

.explore-rail-card a i {
    color: var(--explore-green);
}

.explore-page-v2 .explore-pager {
    margin-top: 20px !important;
    border: 1px solid rgba(148, 163, 184, .18) !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .055);
}

.explore-load-more-panel {
    justify-content: center !important;
    gap: 14px;
    background: linear-gradient(135deg, #ffffff, #f7fbf8) !important;
}

.explore-load-more-panel > span:first-child {
    color: #53665f;
    font-size: 13px;
    font-weight: 850;
}

.explore-load-more-btn,
.explore-load-more-done {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 18px;
    border-radius: 999px;
    font-size: 14px;
    font-weight: 950;
    text-decoration: none;
}

.explore-load-more-btn {
    border: 1px solid rgba(11, 107, 88, .16) !important;
    background: #0b6b58 !important;
    color: #ffffff !important;
    box-shadow: 0 14px 26px rgba(11, 107, 88, .16);
}

.explore-load-more-btn:hover {
    transform: translateY(-1px);
    background: #095c4d !important;
}

.explore-load-more-btn.is-loading i {
    animation: lcSpin .8s linear infinite;
}

.explore-load-more-done {
    border: 1px solid rgba(11, 107, 88, .14);
    background: #ecfdf5;
    color: #0b6b58;
}

.explore-card.is-appended {
    animation: exploreFadeUp .38s ease both;
}

@keyframes lcSpin {
    to { transform: rotate(360deg); }
}

.explore-page-v2 .explore-card {
    animation: exploreFadeUp .45s ease both;
}

.explore-page-v2 .explore-card:nth-child(2) { animation-delay: .04s; }
.explore-page-v2 .explore-card:nth-child(3) { animation-delay: .08s; }
.explore-page-v2 .explore-card:nth-child(4) { animation-delay: .12s; }
.explore-page-v2 .explore-card:nth-child(5) { animation-delay: .16s; }

@keyframes exploreFadeUp {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.explore-detail .explore-detail-layout {
    max-width: 1220px;
    margin: 0 auto;
}

.explore-detail-hero {
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, .16) !important;
    border-radius: 28px !important;
    background:
        radial-gradient(circle at 0 0, rgba(245, 234, 215, .9), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f4fbf6 100%) !important;
    box-shadow: var(--explore-soft-shadow);
}

.explore-detail-hero h1 {
    max-width: 900px;
    color: var(--explore-ink) !important;
    font-size: clamp(34px, 5vw, 60px) !important;
    font-weight: 950 !important;
    line-height: 1.02 !important;
    letter-spacing: -1.8px !important;
}

.explore-detail-hero > p {
    max-width: 760px;
    color: #53665f !important;
    font-size: 17px !important;
    line-height: 1.72 !important;
}

.explore-detail-breadcrumb a,
.explore-detail-tags span {
    font-weight: 850;
}

.explore-detail-tags span {
    border: 1px solid rgba(11, 107, 88, .12);
    background: rgba(255, 255, 255, .72) !important;
    color: #204b41 !important;
}

.explore-detail-side {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.explore-detail-side .explore-detail-cover {
    position: relative !important;
    top: auto !important;
    grid-column: auto !important;
    grid-row: auto !important;
    overflow: hidden;
    border: 8px solid #ffffff;
    border-radius: 26px !important;
    box-shadow: var(--explore-shadow) !important;
}

.explore-detail-side .explore-detail-cover img {
    width: 100%;
    height: 100%;
    min-height: 320px;
    object-fit: cover;
}

.explore-cover-credit {
    margin-top: 0 !important;
    padding: 10px 12px;
    border: 1px solid rgba(148, 163, 184, .16);
    border-radius: 14px;
    background: #ffffff;
    color: var(--explore-muted);
    font-size: 12px;
    font-weight: 750;
}

.explore-image-strip {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 8px !important;
}

.explore-image-strip a,
.explore-image-strip img {
    border-radius: 14px !important;
}

.explore-image-strip img {
    aspect-ratio: 1 / .78;
    object-fit: cover;
}

.explore-read-panel {
    display: grid;
    gap: 13px;
    padding: 16px;
    border: 1px solid rgba(11, 107, 88, .12);
    border-radius: 20px;
    background: linear-gradient(145deg, #ffffff, #f7fbf8);
    box-shadow: var(--explore-soft-shadow);
}

.explore-read-panel__kicker {
    color: var(--explore-green);
    font-size: 11px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .1em;
}

.explore-read-panel__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.explore-read-panel__grid span {
    min-width: 0;
    padding: 10px 8px;
    border-radius: 14px;
    background: #edf7ef;
    text-align: center;
}

.explore-read-panel__grid b {
    display: block;
    color: var(--explore-ink);
    font-size: 15px;
    font-weight: 950;
    line-height: 1.15;
}

.explore-read-panel__grid small {
    display: block;
    margin-top: 4px;
    color: var(--explore-muted);
    font-size: 10.5px;
    font-weight: 850;
}

.explore-read-panel > a {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border-radius: 999px;
    background: var(--explore-green);
    color: #ffffff;
    font-size: 13px;
    font-weight: 950;
    text-decoration: none;
}

.explore-quality-note {
    display: flex;
    gap: 8px;
    padding: 10px 11px;
    border: 1px solid rgba(11, 107, 88, .12);
    border-radius: 14px;
    background: #ffffff;
    color: #38554d;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.5;
}

.explore-quality-note i {
    margin-top: 2px;
    color: var(--explore-green);
}

.explore-article.app-card {
    border: 1px solid rgba(148, 163, 184, .16) !important;
    border-radius: 26px !important;
    box-shadow: var(--explore-soft-shadow) !important;
}

.explore-reader-brief {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(260px, .85fr);
    gap: 12px;
    margin-bottom: 24px;
}

.explore-brief-card {
    min-width: 0;
    padding: 16px;
    border: 1px solid rgba(11, 107, 88, .12);
    border-radius: 20px;
    background:
        radial-gradient(circle at 100% 0, rgba(212, 172, 88, .14), transparent 30%),
        #ffffff;
}

.explore-brief-card--points {
    background:
        radial-gradient(circle at 0 0, rgba(11, 107, 88, .13), transparent 34%),
        linear-gradient(145deg, #ffffff, #f7fbf8);
}

.explore-brief-kicker {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 10px;
    color: var(--explore-green);
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.explore-brief-card ul {
    display: grid;
    gap: 8px;
    margin: 0;
    padding-left: 18px;
    color: #29443c;
    font-size: 14px;
    font-weight: 750;
    line-height: 1.58;
}

.explore-toc-list {
    display: grid;
    gap: 7px;
}

.explore-toc-list a {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    padding: 7px 10px;
    border-radius: 12px;
    background: #f4fbf6;
    color: #173f35;
    font-size: 13px;
    font-weight: 850;
    line-height: 1.35;
    text-decoration: none;
}

.explore-toc-list a::before {
    content: "";
    width: 7px;
    height: 7px;
    flex: 0 0 auto;
    border-radius: 999px;
    background: var(--explore-amber);
}

.explore-toc-list a:hover {
    background: #e7f6ee;
    color: var(--explore-green);
}

.explore-article-content {
    color: #243a34 !important;
    font-size: 17px !important;
    line-height: 1.86 !important;
}

.explore-article-content > p:first-child {
    font-size: 18px;
    color: #183c34;
}

.explore-article-content h2 {
    position: relative;
    margin-top: 34px !important;
    color: var(--explore-ink) !important;
    font-size: clamp(24px, 3vw, 34px) !important;
    font-weight: 950 !important;
    letter-spacing: -.8px !important;
}

.explore-article-content h2::before {
    content: "";
    display: block;
    width: 52px;
    height: 5px;
    margin-bottom: 12px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--explore-green), var(--explore-amber));
}

.explore-inline-image {
    overflow: hidden;
    margin: 24px 0 !important;
    border: 1px solid rgba(148, 163, 184, .16);
    border-radius: 22px;
    background: #ffffff;
    box-shadow: 0 16px 34px rgba(15, 23, 42, .07);
}

.explore-inline-image img {
    width: 100%;
    max-height: 520px;
    object-fit: cover;
}

.explore-inline-image figcaption {
    padding: 10px 13px !important;
    color: var(--explore-muted) !important;
    font-size: 12px !important;
}

.explore-source-box {
    scroll-margin-top: 96px;
    border-radius: 20px !important;
    background: #f7fbf8 !important;
}

.explore-source-note {
    margin: -4px 0 14px !important;
    color: #53665f !important;
    font-size: 13.5px !important;
    font-weight: 700;
    line-height: 1.65 !important;
}

.explore-lightbox-open {
    overflow: hidden;
}

.explore-detail-cover img,
.explore-image-strip img,
.explore-inline-image img {
    cursor: zoom-in;
}

.explore-lightbox {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: clamp(14px, 3vw, 34px);
    background:
        radial-gradient(circle at 20% 0, rgba(245, 158, 11, .18), transparent 28%),
        rgba(6, 18, 16, .88);
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease;
}

.explore-lightbox.is-open {
    opacity: 1;
    pointer-events: auto;
}

.explore-lightbox__figure {
    width: min(1120px, 100%);
    max-height: calc(100dvh - 58px);
    display: grid;
    gap: 10px;
    margin: 0;
    transform: translateY(10px) scale(.985);
    transition: transform .18s ease;
}

.explore-lightbox.is-open .explore-lightbox__figure {
    transform: translateY(0) scale(1);
}

.explore-lightbox__img {
    width: 100%;
    max-height: calc(100dvh - 118px);
    object-fit: contain;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 22px;
    background: #071512;
    box-shadow: 0 28px 80px rgba(0, 0, 0, .34);
}

.explore-lightbox__caption {
    max-width: 900px;
    justify-self: center;
    color: rgba(255, 255, 255, .86);
    font-size: 13px;
    font-weight: 750;
    line-height: 1.55;
    text-align: center;
}

.explore-lightbox__close,
.explore-lightbox__nav {
    position: fixed;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    background: rgba(255, 255, 255, .14);
    color: #ffffff;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.explore-lightbox__close {
    top: 18px;
    right: 18px;
    width: 44px;
    height: 44px;
}

.explore-lightbox__nav {
    top: 50%;
    width: 48px;
    height: 48px;
    transform: translateY(-50%);
}

.explore-lightbox__nav--prev {
    left: 18px;
}

.explore-lightbox__nav--next {
    right: 18px;
}

.explore-lightbox__close:hover,
.explore-lightbox__nav:hover {
    background: rgba(255, 255, 255, .24);
}

.main.is-pjax-leaving {
    opacity: .54;
    transform: translateY(5px);
    transition: opacity .16s ease, transform .16s ease;
}

.main.is-pjax-entering {
    animation: lcPjaxEnter .22s ease both;
}

@keyframes lcPjaxEnter {
    from {
        opacity: .72;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.explore-related {
    max-width: 1220px;
    margin-right: auto;
    margin-left: auto;
    border-radius: 24px !important;
}

.explore-related-card {
    border-radius: 18px !important;
    transition: transform .18s ease, box-shadow .18s ease;
}

.explore-related-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--explore-soft-shadow);
}

@media (min-width: 992px) {
    .explore-detail .explore-detail-layout {
        display: grid !important;
        grid-template-columns: minmax(0, 760px) minmax(320px, 420px) !important;
        grid-template-areas:
            "hero hero"
            "article side" !important;
        gap: 22px !important;
        justify-content: center;
        align-items: start;
    }

    .explore-detail .explore-detail-hero {
        grid-area: hero !important;
    }

    .explore-detail .explore-article {
        grid-area: article !important;
        grid-column: auto !important;
        grid-row: auto !important;
    }

    .explore-detail .explore-detail-side {
        grid-area: side !important;
        position: sticky;
        top: 92px;
    }
}

@media (max-width: 1100px) {
    .explore-content-shell {
        grid-template-columns: 1fr;
    }

    .explore-rail {
        position: static;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991px) {
    .explore-page-v2 .explore-hero {
        grid-template-columns: 1fr;
        grid-template-areas:
            "copy"
            "visual"
            "actions";
    }

    .explore-hero-visual {
        min-height: 260px;
        transform: none;
    }

    .explore-hero-visual img {
        min-height: 260px;
    }

    .explore-page-v2 .explore-grid {
        grid-template-columns: 1fr !important;
    }

    .explore-page-v2 .explore-card--featured {
        grid-template-columns: 1fr;
    }

    .explore-detail-side {
        order: 2;
    }

    .explore-article {
        order: 3;
    }
}

@media (max-width: 767px) {
    .explore-page-v2 {
        padding-top: 10px !important;
    }

    .explore-page-v2 .explore-hero {
        padding: 16px !important;
        border-radius: 22px !important;
    }

    .explore-page-v2 .explore-hero h1 {
        font-size: 38px !important;
        letter-spacing: -1.35px !important;
    }

    .explore-page-v2 .explore-hero p {
        font-size: 14.5px !important;
        line-height: 1.65 !important;
    }

    .explore-page-v2 .explore-hero-actions {
        display: grid !important;
        grid-template-columns: 1fr;
        width: 100%;
    }

    .explore-page-v2 .explore-hero-action {
        width: 100%;
    }

    .explore-content-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .explore-rail {
        grid-template-columns: 1fr;
    }

    .explore-page-v2 .explore-card-body {
        padding: 14px !important;
    }

    .explore-page-v2 .explore-card-body h2 {
        font-size: 19px !important;
    }

    .explore-page-v2 .explore-card--featured .explore-card-body h2 {
        font-size: 25px !important;
    }

    .explore-detail-hero {
        border-radius: 20px !important;
    }

    .explore-detail-hero h1 {
        font-size: 32px !important;
        letter-spacing: -1.1px !important;
    }

    .explore-detail-hero > p,
    .explore-article-content {
        font-size: 15.5px !important;
        line-height: 1.78 !important;
    }

    .explore-detail-side .explore-detail-cover img {
        min-height: 240px;
    }

    .explore-image-strip {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .explore-load-more-panel {
        align-items: stretch !important;
        flex-direction: column;
        text-align: center;
    }

    .explore-load-more-btn,
    .explore-load-more-done {
        width: 100%;
    }

    .explore-lightbox {
        padding: 12px;
    }

    .explore-lightbox__img {
        max-height: calc(100dvh - 132px);
        border-radius: 16px;
    }

    .explore-lightbox__nav {
        top: auto;
        bottom: 18px;
        width: 44px;
        height: 44px;
        transform: none;
    }

    .explore-lightbox__nav--prev {
        left: calc(50% - 56px);
    }

    .explore-lightbox__nav--next {
        right: calc(50% - 56px);
    }

    .explore-reader-brief {
        grid-template-columns: 1fr;
    }

    .explore-read-panel__grid {
        grid-template-columns: 1fr;
    }
}

.local-beta-note {
    display: flex;
    gap: 8px;
    padding: 10px;
    border: 1px solid rgba(8, 112, 95, .14);
    border-radius: 8px;
    background: #fff;
    color: #344054;
    font-size: 13px;
    line-height: 1.55;
}

.local-beta-note i {
    margin-top: 2px;
    color: var(--lc-brand);
    font-size: 16px;
}

.local-beta-note a {
    color: var(--lc-brand);
    font-weight: 800;
}

.local-beta-extra {
    display: grid;
    gap: 7px;
    margin-top: 8px;
}

.local-beta-extra a {
    text-decoration: none;
}

.local-beta-partner {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 9px;
    border: 1px solid rgba(8, 112, 95, .14);
    border-radius: 10px;
    background: rgba(255, 255, 255, .76);
    color: #344054;
}

.local-beta-partner > i {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border-radius: 9px;
    background: #ecfdf5;
    color: var(--lc-brand);
    font-size: 15px;
}

.local-beta-partner span {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.local-beta-partner b {
    color: var(--lc-text);
    font-size: 13px;
    line-height: 1.2;
}

.local-beta-partner small {
    color: #667085;
    font-size: 11.5px;
    line-height: 1.35;
}

.local-beta-cta {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(8, 112, 95, .16);
    border-radius: 8px;
    background: #ecfdf5;
    color: var(--lc-brand);
    font-size: 13px;
    font-weight: 800;
}

@media (max-width: 767px) {
    .brand-logo-wrap {
        width: 38px !important;
        height: 38px !important;
        border-radius: 11px !important;
    }

    .brand-logo-img {
        width: 31px !important;
        height: 31px !important;
        border-radius: 8px !important;
    }

    .brand-title {
        font-size: 13.5px !important;
    }

    .brand-slogan {
        font-size: 9.5px !important;
    }

    .hero-action-row,
    .hero-trust-row {
        display: none !important;
    }

    .local-beta-card {
        padding: 12px !important;
    }

    .local-beta-card .section-head {
        margin-bottom: 8px;
    }

    .local-beta-card .section-kicker,
    .local-beta-lead {
        display: none !important;
    }

    .local-beta-card .section-title {
        font-size: 15px !important;
        line-height: 1.25;
    }

    .local-beta-note {
        padding: 10px;
        gap: 8px;
        font-size: 12.5px;
        line-height: 1.45;
    }

    .local-beta-extra {
        gap: 7px;
        margin-top: 8px;
    }

    .local-beta-partner {
        padding: 9px;
        gap: 8px;
    }

    .local-beta-partner > i {
        width: 28px;
        height: 28px;
        border-radius: 8px;
        font-size: 14px;
    }

    .local-beta-partner b {
        font-size: 12.5px;
    }

    .local-beta-partner small {
        font-size: 11px;
        line-height: 1.3;
    }

    .local-beta-cta {
        min-height: 34px;
        font-size: 12.5px;
    }
}

/* Header, assistant page and create-post tabs */
.brand-link {
    gap: 12px !important;
}

.brand-copy {
    display: flex;
    align-items: center;
}

.brand-slogan {
    display: none !important;
}

.brand-title {
    font-size: 22px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    color: #086b5d !important;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .8);
}

.brand-logo-wrap {
    width: 46px !important;
    height: 46px !important;
    border-radius: 14px !important;
}

.brand-logo-img {
    width: 38px !important;
    height: 38px !important;
    border-radius: 10px !important;
}

body.layout-embed .lc-header,
body.layout-embed .footer {
    display: none !important;
}

body.layout-embed .main {
    margin-bottom: 0 !important;
}

body.page-ui-post-ai:not(.layout-embed) .lc-header,
body.page-ui-post-ai:not(.layout-embed) .footer {
    display: block !important;
}

body.page-ui-post-ai:not(.layout-embed) .main {
    margin-bottom: 80px !important;
}

body.page-ui-post-ai:not(.layout-embed) .chat-page {
    min-height: auto !important;
    padding: 18px 12px 108px !important;
}

body.page-ui-post-ai:not(.layout-embed) .chat-main {
    min-height: calc(100vh - 176px) !important;
}

body.layout-embed.page-ui-post-ai .chat-page {
    min-height: 100vh !important;
    padding: 0 !important;
}

body.layout-embed.page-ui-post-ai .chat-main {
    min-height: 100vh !important;
    border-radius: 0 !important;
    border: 0 !important;
}

.market-create-hero {
    padding-bottom: 16px !important;
}

.market-create-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.market-create-tab {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid var(--lc-line);
    border-radius: 8px;
    background: #fff;
    color: var(--lc-text);
    font-weight: 850;
    transition: .16s ease;
}

.market-create-tab i {
    color: var(--lc-brand);
    font-size: 17px;
}

.market-create-tab.is-active {
    border-color: rgba(8, 112, 95, .24);
    background: #ecfdf5;
    color: var(--lc-brand);
}

.market-create-panel[hidden] {
    display: none !important;
}

.market-ai-embed-card {
    overflow: hidden;
}

.market-ai-iframe {
    width: 100%;
    height: min(760px, calc(100vh - 230px));
    min-height: 560px;
    display: block;
    border: 1px solid var(--lc-line);
    border-radius: 12px;
    background: #fff;
}

@media (max-width: 767px) {
    .brand-link {
        gap: 9px !important;
    }

    .brand-title {
        font-size: 17px !important;
    }

    .brand-logo-wrap {
        width: 40px !important;
        height: 40px !important;
        border-radius: 12px !important;
    }

    .brand-logo-img {
        width: 32px !important;
        height: 32px !important;
        border-radius: 9px !important;
    }

    body.page-ui-post-ai:not(.layout-embed) .chat-page {
        padding: 10px 10px 128px !important;
    }

    body.page-ui-post-ai:not(.layout-embed) .chat-main {
        min-height: calc(100vh - 146px) !important;
        border-radius: 12px !important;
        border-left: 1px solid var(--lc-border) !important;
        border-right: 1px solid var(--lc-border) !important;
        padding-bottom: 150px !important;
    }

    body.page-ui-post-ai:not(.layout-embed) .chat-input-wrap {
        bottom: 70px !important;
    }

    .market-create-tabs {
        grid-template-columns: 1fr;
    }

    .market-ai-iframe {
        min-height: 620px;
        height: calc(100vh - 210px);
        border-radius: 8px;
    }
}

/* Cleaner home/news reading layout */
.brand-link {
    gap: 13px !important;
}

.brand-logo-wrap {
    width: 52px !important;
    height: 52px !important;
    border-radius: 18px !important;
}

.brand-logo-img {
    width: 42px !important;
    height: 42px !important;
    border-radius: 13px !important;
}

.brand-title {
    display: inline-flex !important;
    align-items: baseline !important;
    gap: 5px !important;
    font-size: 25px !important;
    font-weight: 950 !important;
    line-height: .95 !important;
    color: #08705f !important;
    letter-spacing: 0 !important;
    text-shadow: none !important;
}

.brand-title span {
    color: #6a1a1a !important;
}

.brand-title em {
    position: relative;
    color: #d39a08 !important;
    font-style: normal !important;
}

.brand-title em::after {
    content: "";
    position: absolute;
    left: 2px;
    right: 1px;
    bottom: -5px;
    height: 3px;
    border-radius: 99px;
    background: linear-gradient(90deg, #08705f, #e4aa19);
}

.hero-action-row,
.hero-trust-row {
    display: none !important;
}

.hero-content {
    max-width: min(760px, 100%) !important;
}

.hero-title {
    max-width: 760px !important;
    font-size: 46px !important;
    line-height: 1.08 !important;
}

.hero-desc {
    display: none !important;
}

.home-market .section-head {
    margin-bottom: 12px !important;
}

.home-market .section-desc,
.home-market .market-highlight-head p,
.home-market .market-category small,
.home-market .market-post-trust {
    display: none !important;
}

.home-market .market-category {
    min-height: 78px !important;
    align-items: center !important;
}

.home-market .market-category b {
    font-size: 14px !important;
}

.news-page .news-filter-bar {
    align-items: center !important;
    gap: 8px !important;
    padding: 8px !important;
    margin-bottom: 12px !important;
    border-radius: 12px !important;
}

.news-page .news-filter-label {
    display: none !important;
}

.news-page .news-page-filter {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 6px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.news-page .news-page-filter::-webkit-scrollbar {
    display: none;
}

.news-page .news-filter-btn {
    flex: 0 0 auto !important;
    min-height: 34px !important;
    padding: 7px 12px !important;
    border-radius: 999px !important;
    font-size: 13px !important;
    line-height: 1 !important;
}

.news-page .news-section-title {
    margin-top: 6px !important;
    margin-bottom: 12px !important;
}

.news-page .news-trust-panel.news-trust-compact {
    margin-top: 18px !important;
    padding: 10px !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    background: #f8fafc !important;
}

.news-page .news-trust-panel.news-trust-compact > div {
    min-height: 0 !important;
    padding: 8px !important;
    align-items: center !important;
    gap: 8px !important;
}

.news-page .news-trust-panel.news-trust-compact span {
    width: 28px !important;
    height: 28px !important;
    flex: 0 0 28px !important;
}

.news-page .news-trust-panel.news-trust-compact b {
    font-size: 12.5px !important;
}

.news-page .news-trust-panel.news-trust-compact small {
    display: none !important;
}

@media (max-width: 767px) {
    .brand-link {
        gap: 9px !important;
    }

    .brand-logo-wrap {
        width: 42px !important;
        height: 42px !important;
        border-radius: 14px !important;
    }

    .brand-logo-img {
        width: 34px !important;
        height: 34px !important;
        border-radius: 10px !important;
    }

    .brand-title {
        font-size: 19px !important;
        gap: 4px !important;
    }

    .brand-title em::after {
        bottom: -4px;
        height: 2px;
    }

    .hero-content {
        padding: 18px !important;
    }

    .hero-kicker {
        display: none !important;
    }

    .hero-title {
        font-size: 25px !important;
        line-height: 1.12 !important;
        max-width: 100% !important;
    }

    .hero-desc {
        display: none !important;
    }

    .hero-meta {
        margin-top: 12px !important;
        gap: 7px !important;
    }

    .hero-meta span {
        min-height: 32px !important;
        padding: 7px 10px !important;
        font-size: 12px !important;
    }

    .home-market .market-category-grid {
        gap: 8px !important;
    }

    .home-market .market-category {
        min-height: 68px !important;
        padding: 10px !important;
        gap: 9px !important;
    }

    .home-market .market-icon {
        width: 38px !important;
        height: 38px !important;
        flex: 0 0 38px !important;
    }

    .news-page .news-shell {
        padding-top: 8px !important;
    }

    .news-page .news-filter-bar {
        margin-left: -4px !important;
        margin-right: -4px !important;
        border-radius: 10px !important;
    }

    .news-page .news-section-title h2 {
        font-size: 21px !important;
    }

    .news-page .news-trust-panel.news-trust-compact {
        grid-template-columns: 1fr 1fr 1fr !important;
        gap: 6px !important;
        padding: 8px !important;
    }

    .news-page .news-trust-panel.news-trust-compact > div {
        justify-content: center !important;
        text-align: center !important;
        padding: 7px 5px !important;
    }

    .news-page .news-trust-panel.news-trust-compact span {
        display: none !important;
    }
}

/* Compact mobile news, market and explore */
.trend-primary-mobile,
.trend-more-link {
    display: none !important;
}

.market-home-title,
.market-page-title {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    color: #08705f !important;
    letter-spacing: 0 !important;
}

.market-home-title i,
.market-page-title i {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: linear-gradient(135deg, #08705f, #10a27d);
    color: #fff;
    font-size: 17px;
    box-shadow: 0 10px 22px rgba(8, 112, 95, .18);
}

.market-page .market-page-hero,
.market-page .market-page-categories,
.market-page .market-page-list {
    border-radius: 16px !important;
}

.market-page .market-page-hero {
    padding: 18px !important;
}

.market-page .section-desc,
.market-page .market-category small,
.market-page .market-post-trust {
    display: none !important;
}

.market-page .market-category {
    min-height: 76px !important;
    align-items: center !important;
}

.market-page .market-highlight-head {
    margin-bottom: 10px !important;
}

.explore-page .explore-hero {
    min-height: 0 !important;
    padding: 18px 20px !important;
    border-radius: 16px !important;
}

.explore-page .explore-hero h1 {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 !important;
    color: #08705f !important;
    font-size: 28px !important;
    letter-spacing: 0 !important;
}

.explore-page .explore-hero h1 i {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: #ecfdf5;
    color: #08705f;
}

.explore-page .explore-hero-kicker,
.explore-page .explore-hero p,
.explore-page .explore-card-body p {
    display: none !important;
}

.explore-page .explore-filter-row {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 7px !important;
    overflow-x: auto !important;
    padding-bottom: 4px !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.explore-page .explore-filter-row::-webkit-scrollbar {
    display: none;
}

.explore-page .explore-filter {
    flex: 0 0 auto !important;
    min-height: 36px !important;
    padding: 8px 12px !important;
    border-radius: 999px !important;
    font-size: 13px !important;
}

@media (max-width: 767px) {
    .top-layout {
        display: block !important;
    }

    .top-layout .hero-news {
        display: none !important;
    }

    .side-stack {
        display: block !important;
    }

    .trend-card {
        padding: 12px !important;
        border-radius: 14px !important;
    }

    .trend-head {
        margin-bottom: 10px !important;
    }

    .trend-head .trend-top-link {
        display: none !important;
    }

    .trend-more-link {
        min-height: 40px;
        margin-top: 10px;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        gap: 6px;
        width: 100%;
        border-radius: 999px;
        background: #ecfdf5;
        color: #08705f;
        font-weight: 850;
        text-decoration: none;
    }

    .trend-list {
        gap: 8px !important;
    }

    .trend-list .trend-item,
    .trend-list .trend-item:nth-child(n+4),
    .trend-primary-mobile {
        display: grid !important;
        grid-template-columns: 72px minmax(0, 1fr) !important;
        gap: 10px !important;
        min-height: 88px !important;
        padding: 8px !important;
        border-radius: 12px !important;
    }

    .trend-item .thumb,
    .trend-item .news-thumb-img {
        width: 72px !important;
        height: 72px !important;
        border-radius: 10px !important;
    }

    .trend-item b {
        font-size: 13.5px !important;
        line-height: 1.32 !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .trend-item small {
        margin-top: 4px !important;
        font-size: 11.5px !important;
        line-height: 1.3 !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .home-market .section-head,
    .market-page .section-head,
    .explore-page .explore-hero {
        gap: 10px !important;
    }

    .market-home-title,
    .market-page-title,
    .explore-page .explore-hero h1 {
        font-size: 23px !important;
    }

    .market-home-title i,
    .market-page-title i,
    .explore-page .explore-hero h1 i {
        width: 34px !important;
        height: 34px !important;
        border-radius: 11px !important;
        font-size: 16px !important;
    }

    .market-page .market-page-hero,
    .market-page .market-page-categories,
    .market-page .market-page-list,
    .explore-page .explore-hero {
        padding: 14px !important;
        border-radius: 14px !important;
    }

    .market-page .market-category-grid {
        gap: 8px !important;
    }

    .market-page .market-category {
        min-height: 64px !important;
        padding: 9px !important;
        gap: 8px !important;
    }

    .market-page .market-icon {
        width: 36px !important;
        height: 36px !important;
        flex: 0 0 36px !important;
    }

    .market-page .market-listing-grid,
    .explore-page .explore-grid {
        gap: 10px !important;
    }

    .explore-page .explore-card-body {
        padding: 11px !important;
    }

    .explore-page .explore-card-body h2 {
        font-size: 15px !important;
        line-height: 1.35 !important;
    }

    .explore-page .explore-card-meta {
        gap: 6px !important;
        font-size: 11px !important;
    }
}

/* Mobile bottom navigation should cover the viewport edge cleanly */
@media (max-width: 991px) {
    .main {
        margin-bottom: calc(88px + env(safe-area-inset-bottom, 0px)) !important;
    }

    .main-wrap {
        padding-bottom: calc(118px + env(safe-area-inset-bottom, 0px)) !important;
    }

    .bottom-nav {
        left: 0 !important;
        right: auto !important;
        bottom: 0 !important;
        width: min(390px, 100vw) !important;
        max-width: 100vw !important;
        transform: none !important;
        min-height: calc(72px + env(safe-area-inset-bottom, 0px)) !important;
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 0 !important;
        padding: 7px 10px calc(8px + env(safe-area-inset-bottom, 0px)) !important;
        border-width: 1px 0 0 !important;
        border-radius: 18px 18px 0 0 !important;
        background: #ffffff !important;
        box-shadow: 0 -12px 34px rgba(15, 23, 42, .14) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    .bottom-nav::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: env(safe-area-inset-bottom, 0px);
        background: #ffffff;
        pointer-events: none;
    }

    .bottom-nav a {
        min-width: 0 !important;
        width: auto !important;
        max-width: none !important;
        min-height: 54px !important;
        border-radius: 12px !important;
        padding: 5px 2px !important;
    }

    .bottom-nav span {
        width: 100% !important;
        overflow: hidden !important;
        text-align: center !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        font-size: 10px !important;
        line-height: 1.15 !important;
    }

    .floating-ai-shortcut {
        display: none !important;
    }

    .ios-install-tip {
        bottom: calc(88px + env(safe-area-inset-bottom, 0px));
    }
}

.is-pwa .ios-install-tip {
    display: none !important;
}

/* Save/bookmark and related content */
.market-post-image,
.explore-card-media {
    position: relative;
}

.section-actions,
.explore-detail-actions,
.saved-card-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.lc-save-btn {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid rgba(8, 112, 95, .18);
    border-radius: 999px;
    background: #ffffff;
    color: #08705f;
    font-size: 12px;
    font-weight: 850;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    user-select: none;
    transition: .16s ease;
}

.lc-save-btn:hover,
.lc-save-btn.is-saved {
    border-color: rgba(8, 112, 95, .28);
    background: #ecfdf5;
    color: #08705f;
}

.lc-save-btn i {
    font-size: 14px;
}

.lc-save-floating {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 4;
    min-height: 32px;
    padding: 0 10px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .14);
}

.lc-save-detail,
.explore-back-link {
    min-height: 42px;
    padding: 0 14px;
}

.explore-back-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid var(--lc-line);
    border-radius: 999px;
    background: #ffffff;
    color: #08705f;
    font-weight: 850;
    text-decoration: none;
}

.explore-detail-actions {
    margin-top: 16px;
}

.explore-related-grid,
.saved-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.explore-related-card,
.saved-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--lc-line);
    border-radius: 12px;
    background: #ffffff;
    text-decoration: none;
}

.explore-related-card {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    align-items: center;
    color: var(--lc-text);
}

.explore-related-card img {
    width: 112px;
    height: 92px;
    object-fit: cover;
}

.explore-related-card span {
    min-width: 0;
    display: grid;
    gap: 6px;
    padding: 10px;
}

.explore-related-card b,
.saved-card h2 {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.explore-related-card b {
    font-size: 14px;
    line-height: 1.35;
}

.explore-related-card small,
.saved-card small {
    color: var(--lc-muted);
    font-size: 12px;
}

.explore-related-empty {
    padding: 14px;
    border: 1px dashed rgba(8, 112, 95, .24);
    border-radius: 12px;
    background: #f8fffc;
    color: var(--lc-muted);
    font-weight: 650;
}

.saved-hero .section-title {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #08705f;
}

.saved-tabs {
    display: inline-flex;
    gap: 6px;
    padding: 5px;
    margin-bottom: 14px;
    border: 1px solid var(--lc-line);
    border-radius: 999px;
    background: #f8fafc;
}

.saved-tab {
    min-height: 34px;
    padding: 0 14px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--lc-muted);
    font-weight: 850;
}

.saved-tab.active {
    background: #ffffff;
    color: #08705f;
    box-shadow: 0 6px 16px rgba(15, 23, 42, .08);
}

.saved-card {
    display: grid;
    grid-template-columns: 136px minmax(0, 1fr);
}

.saved-card-media img {
    width: 136px;
    height: 100%;
    min-height: 128px;
    object-fit: cover;
}

.saved-card-body {
    min-width: 0;
    display: grid;
    gap: 8px;
    padding: 12px;
}

.saved-type {
    width: fit-content;
    padding: 5px 8px;
    border-radius: 999px;
    background: #ecfdf5;
    color: #08705f;
    font-size: 11px;
    font-weight: 850;
}

.saved-card h2 {
    margin: 0;
    font-size: 15px;
    line-height: 1.38;
}

.saved-card h2 a {
    color: var(--lc-text);
    text-decoration: none;
}

.saved-card-actions a,
.saved-card-actions button {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 0 11px;
    border: 1px solid var(--lc-line);
    border-radius: 999px;
    background: #ffffff;
    color: #08705f;
    font-size: 12px;
    font-weight: 850;
    text-decoration: none;
}

.saved-card-actions button {
    color: #b42318;
}

.saved-empty {
    padding: 36px 16px;
    text-align: center;
}

.saved-empty span {
    width: 54px;
    height: 54px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
    border-radius: 18px;
    background: #ecfdf5;
    color: #08705f;
    font-size: 24px;
}

.saved-empty h2 {
    margin: 0 0 6px;
    font-size: 20px;
}

.saved-empty p {
    max-width: 420px;
    margin: 0 auto 14px;
    color: var(--lc-muted);
}

.saved-empty div {
    display: flex;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
}

.saved-empty a {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    padding: 0 14px;
    border-radius: 999px;
    background: #08705f;
    color: #ffffff;
    font-weight: 850;
    text-decoration: none;
}

@media (max-width: 991px) {
    .explore-related-grid,
    .saved-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .lc-save-floating {
        min-height: 30px;
        padding: 0 8px;
        font-size: 11px;
    }

    .section-actions,
    .explore-detail-actions {
        width: 100%;
    }

    .section-actions > *,
    .explore-detail-actions > * {
        flex: 1 1 150px;
    }

    .explore-related-card,
    .saved-card {
        grid-template-columns: 96px minmax(0, 1fr);
    }

    .explore-related-card img {
        width: 96px;
        height: 86px;
    }

    .saved-card-media img {
        width: 96px;
        min-height: 116px;
    }

    .saved-card-body {
        padding: 10px;
    }

    .saved-tabs {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .saved-tab {
        padding: 0 8px;
        font-size: 12px;
    }
}

/* Explore v2 final cascade locks */
.explore-page-v2 .explore-hero {
    display: grid !important;
}

.explore-page-v2 .explore-card-media {
    position: relative !important;
}

.explore-page-v2 .explore-card--featured {
    grid-column: 1 / -1 !important;
}

.explore-detail .explore-detail-side .explore-detail-cover {
    position: relative !important;
    top: auto !important;
    grid-column: auto !important;
    grid-row: auto !important;
}

@media (min-width: 992px) {
    .explore-detail .explore-detail-layout {
        display: grid !important;
        grid-template-columns: minmax(0, 760px) minmax(320px, 420px) !important;
        grid-template-areas:
            "hero hero"
            "article side" !important;
    }

    .explore-detail .explore-detail-hero {
        grid-area: hero !important;
    }

    .explore-detail .explore-article {
        grid-area: article !important;
        grid-column: auto !important;
        grid-row: auto !important;
    }

    .explore-detail .explore-detail-side {
        grid-area: side !important;
        position: sticky !important;
        top: 92px !important;
    }
}

/* Explore v2 mobile overflow guard */
.explore-page-v2,
.explore-page-v2 * {
    min-width: 0;
}

.explore-page-v2 {
    overflow-x: hidden;
}

.explore-content-head .section-title,
.explore-page-v2 .explore-card-body h2,
.explore-page-v2 .explore-card-body h2 a,
.explore-hero-visual__caption b {
    max-width: 100%;
    overflow-wrap: anywhere;
}

@media (max-width: 767px) {
    html,
    body {
        max-width: 100%;
        overflow-x: hidden !important;
    }

    .explore-page-v2,
    .explore-page-v2 .explore-hero,
    .explore-page-v2 .explore-content-head,
    .explore-page-v2 .explore-content-shell,
    .explore-page-v2 .explore-grid,
    .explore-page-v2 .explore-card,
    .explore-page-v2 .explore-card-body,
    .explore-page-v2 .explore-card-media,
    .explore-page-v2 .explore-rail {
        width: 100% !important;
        max-width: 100% !important;
    }

    .explore-content-head .section-title,
    .explore-page-v2 .explore-card-body h2,
    .explore-page-v2 .explore-card-body h2 a,
    .explore-hero-visual__caption b {
        display: block !important;
        white-space: normal !important;
        word-break: break-word !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }

    .explore-page-v2 .explore-hero-stats {
        max-width: 100%;
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto;
        padding-bottom: 3px;
        scrollbar-width: none;
    }

    .explore-page-v2 .explore-hero-stats::-webkit-scrollbar {
        display: none;
    }

    .explore-page-v2 .explore-hero-stats span,
    .explore-page-v2 .explore-filter {
        flex: 0 0 auto;
    }

    .explore-page-v2 .explore-filter-row {
        max-width: 100%;
        overflow-x: auto;
    }

    .explore-content-head .section-title {
        width: calc(100vw - 32px) !important;
        max-width: calc(100vw - 32px) !important;
    }

    .explore-page-v2 .explore-card-body h2,
    .explore-page-v2 .explore-card-body h2 a {
        width: calc(100vw - 56px) !important;
        max-width: calc(100vw - 56px) !important;
    }

    .explore-page-v2 .explore-card--featured .explore-card-body h2,
    .explore-page-v2 .explore-card--featured .explore-card-body h2 a {
        width: calc(100vw - 56px) !important;
        max-width: calc(100vw - 56px) !important;
        font-size: 24px !important;
        line-height: 1.18 !important;
    }
}


/* UX upgrade: vertical news story feed + horizontal swipe albums */
.news-modal.news-story-active {
    padding: 18px;
}

.news-modal.news-story-active .news-story-modal-box {
    display: block !important;
    width: min(1180px, 100%) !important;
    height: min(92vh, 860px) !important;
    overflow: hidden !important;
    border-radius: 32px !important;
    background: #020617 !important;
}

.news-story-feed {
    position: relative;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    scroll-snap-type: y mandatory;
    overscroll-behavior: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

.news-story-feed::-webkit-scrollbar {
    display: none;
}

.news-story-slide {
    min-height: 100%;
    display: grid;
    grid-template-columns: minmax(360px, .9fr) minmax(420px, 1.1fr);
    scroll-snap-align: start;
    scroll-snap-stop: always;
    background: #ffffff;
}

.news-story-slide.is-active .news-modal-image-main {
    transform: scale(1.015);
}

.news-story-media {
    min-height: 0;
    height: 100% !important;
}

.news-story-copy {
    min-height: 0;
    height: 100%;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.news-story-progress {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 0 0 14px;
    color: #64748b;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.news-story-progress span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    background: #eef6ff;
    color: #2563eb;
}

.news-story-progress b {
    color: #94a3b8;
    font-size: 11px;
    font-weight: 950;
}

.news-story-read {
    display: grid;
    gap: 10px;
    margin-top: 18px;
    padding: 18px;
    border: 1px solid #e2e8f0;
    border-radius: 22px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.news-story-read > b {
    color: #0f766e;
    font-size: 13px;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.news-story-read p {
    margin: 0;
    color: #1e293b;
    font-size: 16px;
    line-height: 1.78;
    font-weight: 650;
}

.news-story-hint {
    position: absolute;
    left: 50%;
    bottom: 14px;
    z-index: 12;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    background: rgba(15, 23, 42, .66);
    color: #ffffff;
    font-size: 12px;
    font-weight: 850;
    transform: translateX(-50%);
    backdrop-filter: blur(12px);
    pointer-events: none;
}

.market-image-track {
    display: flex;
    width: 100%;
    height: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x pan-y;
}

.market-image-track::-webkit-scrollbar,
.explore-image-strip[data-swipe-gallery]::-webkit-scrollbar {
    display: none;
}

.market-image-slide {
    flex: 0 0 100%;
    width: 100%;
    height: 100%;
    scroll-snap-align: center;
}

.market-image-slide img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

[data-swipe-gallery].is-dragging {
    cursor: grabbing;
    scroll-behavior: auto !important;
}

.explore-image-strip[data-swipe-gallery] {
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

.explore-image-strip[data-swipe-gallery] a {
    scroll-snap-align: center;
}

@media (max-width: 768px) {
    .news-modal.news-story-active {
        align-items: stretch !important;
        padding: 0 !important;
    }

    .news-modal.news-story-active .news-modal-backdrop {
        background: #020617 !important;
        backdrop-filter: none !important;
    }

    .news-modal.news-story-active .news-story-modal-box {
        width: 100vw !important;
        height: 100vh !important;
        height: 100dvh !important;
        max-height: none !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }

    .news-story-slide {
        min-height: 100vh;
        min-height: 100dvh;
        grid-template-columns: 1fr;
        grid-template-rows: minmax(250px, 42vh) minmax(0, 1fr);
    }

    .news-story-media {
        height: 42vh !important;
        min-height: 250px;
        box-shadow: inset 0 -1px 0 rgba(15, 23, 42, .28);
    }

    .news-story-copy {
        height: auto;
        max-height: none;
        padding: 16px 16px calc(92px + env(safe-area-inset-bottom, 0px)) !important;
    }

    .news-story-progress {
        margin-bottom: 11px;
    }

    .news-story-progress b {
        display: none;
    }

    .news-story-read {
        margin-top: 14px;
        padding: 14px;
        border-radius: 18px;
    }

    .news-story-read p {
        font-size: 15px;
        line-height: 1.7;
    }

    .news-story-hint {
        bottom: calc(72px + env(safe-area-inset-bottom, 0px));
        font-size: 11px;
    }

    .explore-image-strip[data-swipe-gallery] {
        display: flex !important;
        grid-template-columns: none !important;
        gap: 10px !important;
        padding: 0 2px 8px;
        margin-inline: -2px;
    }

    .explore-image-strip[data-swipe-gallery] a {
        flex: 0 0 72%;
        max-width: 72%;
    }

    .explore-image-strip[data-swipe-gallery] img {
        width: 100%;
        min-height: 150px;
    }
}

/* 2026-06-04: compact mobile polish for Explore and bottom navigation */
@media (max-width: 768px) {
    html,
    body {
        overflow-x: hidden;
    }

    body .main,
    body .main-wrap {
        padding-bottom: calc(74px + env(safe-area-inset-bottom, 0px)) !important;
    }

    body .explore-page-v2 {
        width: 100% !important;
        max-width: 100vw !important;
        padding: 10px 10px calc(78px + env(safe-area-inset-bottom, 0px)) !important;
        overflow-x: hidden !important;
    }

    body .explore-page-v2 .explore-hero {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        min-height: 0 !important;
        margin: 0 0 12px !important;
        padding: 16px !important;
        border-radius: 24px !important;
        box-shadow: 0 14px 34px rgba(15, 23, 42, .08) !important;
    }

    body .explore-page-v2 .explore-hero-copy {
        gap: 8px !important;
    }

    body .explore-page-v2 .explore-hero-kicker {
        width: fit-content !important;
        min-height: 28px !important;
        padding: 5px 10px !important;
        border-radius: 999px !important;
        font-size: 11px !important;
        line-height: 1 !important;
    }

    body .explore-page-v2 .explore-hero h1 {
        margin: 0 !important;
        font-size: clamp(30px, 9vw, 38px) !important;
        line-height: 1.02 !important;
        letter-spacing: -.95px !important;
    }

    body .explore-page-v2 .explore-hero h1 i {
        display: none !important;
    }

    body .explore-page-v2 .explore-hero p {
        max-width: none !important;
        font-size: 14px !important;
        line-height: 1.52 !important;
        margin: 0 !important;
    }

    body .explore-page-v2 .explore-hero-stats {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 4px 0 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        scrollbar-width: none !important;
        -webkit-overflow-scrolling: touch !important;
    }

    body .explore-page-v2 .explore-hero-stats::-webkit-scrollbar {
        display: none !important;
    }

    body .explore-page-v2 .explore-hero-stats span {
        flex: 0 1 auto !important;
        min-height: 36px !important;
        padding: 8px 10px !important;
        border-radius: 999px !important;
        font-size: 12.5px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    body .explore-page-v2 .explore-hero-visual {
        width: 100% !important;
        min-height: 0 !important;
        height: auto !important;
        aspect-ratio: 1.08 / 1 !important;
        border: 7px solid rgba(255, 255, 255, .9) !important;
        border-radius: 22px !important;
        box-shadow: 0 12px 28px rgba(15, 23, 42, .14) !important;
    }

    body .explore-page-v2 .explore-hero-visual img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    body .explore-page-v2 .explore-hero-visual__label {
        top: 12px !important;
        left: 12px !important;
        min-height: 36px !important;
        padding: 7px 12px !important;
        font-size: 13px !important;
        border-radius: 999px !important;
    }

    body .explore-page-v2 .explore-hero-visual__caption {
        left: 14px !important;
        right: 14px !important;
        bottom: 14px !important;
        gap: 7px !important;
    }

    body .explore-page-v2 .explore-hero-visual__caption b {
        font-size: clamp(22px, 7.4vw, 30px) !important;
        line-height: 1.08 !important;
        letter-spacing: -.55px !important;
    }

    body .explore-page-v2 .explore-hero-visual__caption small {
        font-size: 13px !important;
        line-height: 1.25 !important;
    }

    body .explore-page-v2 .explore-hero-actions {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 9px !important;
        margin-top: 0 !important;
    }

    body .explore-page-v2 .explore-hero-action {
        min-height: 48px !important;
        padding: 0 14px !important;
        border-radius: 18px !important;
        font-size: 16px !important;
        box-shadow: 0 10px 22px rgba(15, 118, 110, .14) !important;
    }

    body .explore-page-v2 .explore-filter-row {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: calc(100vw - 20px) !important;
        margin: 0 0 14px !important;
        padding: 7px !important;
        border-radius: 20px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        scrollbar-width: none !important;
        box-shadow: 0 10px 26px rgba(15, 23, 42, .08) !important;
        -webkit-overflow-scrolling: touch !important;
    }

    body .explore-page-v2 .explore-filter-row::-webkit-scrollbar {
        display: none !important;
    }

    body .explore-page-v2 .explore-filter {
        flex: 0 0 auto !important;
        min-height: 42px !important;
        padding: 0 14px !important;
        border-radius: 16px !important;
        font-size: 15px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    body .explore-page-v2 .explore-filter i {
        font-size: 16px !important;
    }

    body .explore-page-v2 .explore-content-head {
        display: grid !important;
        gap: 10px !important;
        margin: 4px 0 14px !important;
        padding: 0 2px !important;
    }

    body .explore-page-v2 .section-kicker {
        font-size: 13px !important;
        letter-spacing: .04em !important;
    }

    body .explore-page-v2 .section-title,
    body .explore-page-v2 .explore-content-head h2 {
        max-width: 100% !important;
        font-size: clamp(27px, 8vw, 34px) !important;
        line-height: 1.08 !important;
        letter-spacing: -.75px !important;
    }

    body .explore-page-v2 .explore-content-count {
        width: fit-content !important;
        min-height: 36px !important;
        padding: 8px 12px !important;
        border-radius: 999px !important;
        font-size: 14px !important;
    }

    body .explore-page-v2 .explore-content-shell {
        gap: 14px !important;
    }

    body .explore-page-v2 .explore-grid {
        gap: 14px !important;
    }

    body .explore-page-v2 .explore-card {
        border-radius: 22px !important;
        box-shadow: 0 10px 26px rgba(15, 23, 42, .07) !important;
    }

    body .explore-page-v2 .explore-card-media {
        border-radius: 20px 20px 0 0 !important;
        aspect-ratio: 16 / 11 !important;
    }

    body .explore-page-v2 .explore-card--featured .explore-card-media {
        aspect-ratio: 16 / 10 !important;
    }

    body .explore-page-v2 .explore-card-body {
        padding: 15px !important;
    }

    body .explore-page-v2 .explore-card-meta {
        gap: 6px !important;
        margin-bottom: 9px !important;
        overflow-x: auto !important;
        flex-wrap: nowrap !important;
        scrollbar-width: none !important;
    }

    body .explore-page-v2 .explore-card-meta::-webkit-scrollbar {
        display: none !important;
    }

    body .explore-page-v2 .explore-card-meta span {
        flex: 0 0 auto !important;
        min-height: 28px !important;
        padding: 5px 8px !important;
        font-size: 11.5px !important;
        white-space: nowrap !important;
    }

    body .explore-page-v2 .explore-card-body h2,
    body .explore-page-v2 .explore-card-body h2 a {
        font-size: clamp(22px, 6.4vw, 28px) !important;
        line-height: 1.12 !important;
        letter-spacing: -.45px !important;
    }

    body .explore-page-v2 .explore-card-body p {
        font-size: 14px !important;
        line-height: 1.58 !important;
    }
}

@media (max-width: 390px) {
    body .explore-page-v2 .explore-hero h1 {
        font-size: 31px !important;
    }

    body .explore-page-v2 .explore-hero-visual__caption b {
        font-size: 23px !important;
    }

    body .explore-page-v2 .explore-hero-action {
        min-height: 46px !important;
        font-size: 15px !important;
    }
}

/* 2026-06-04: hard stop mobile horizontal overflow */
@media (max-width: 768px) {
    body .explore-page-v2,
    body .explore-page-v2 .explore-hero,
    body .explore-page-v2 .explore-filter-row,
    body .explore-page-v2 .explore-content-shell,
    body .explore-page-v2 .explore-grid,
    body .explore-page-v2 .explore-card {
        width: 100% !important;
        max-width: calc(100dvw - 20px) !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    body .explore-page-v2 .explore-hero-stats {
        width: 100% !important;
        max-width: 100% !important;
        flex-wrap: wrap !important;
    }

    body .bottom-nav {
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        contain: layout paint !important;
    }

    body .bottom-nav > a:not([data-nav-key="ai"]) {
        display: flex !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    body .bottom-nav > a[data-nav-key="ai"] {
        display: none !important;
    }
}

/* 2026-06-04: final mobile nav authority */
@media (max-width: 991px) {
    html body nav.bottom-nav.d-lg-none,
    html body nav.bottom-nav {
        left: 0 !important;
        right: 0 !important;
        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        grid-auto-flow: column !important;
        grid-auto-columns: minmax(0, 1fr) !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    html body nav.bottom-nav > a.bottom-nav__link,
    html body nav.bottom-nav > a:not([data-nav-key="ai"]) {
        display: flex !important;
        min-width: 0 !important;
        max-width: none !important;
        width: auto !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
    }

    html body nav.bottom-nav > a[data-nav-key="ai"] {
        display: none !important;
    }

    html body .ios-install-tip {
        display: none !important;
    }
}

/* 2026-06-04: force five visible mobile nav items via flex */
@media (max-width: 991px) {
    html body nav.bottom-nav.d-lg-none,
    html body nav.bottom-nav {
        display: flex !important;
        align-items: stretch !important;
        justify-content: stretch !important;
        left: 0 !important;
        right: 0 !important;
        width: auto !important;
        max-width: none !important;
        overflow: hidden !important;
    }

    html body nav.bottom-nav > a.bottom-nav__link:not([data-nav-key="ai"]),
    html body nav.bottom-nav > a[data-nav-key="nearby"] {
        display: flex !important;
        flex: 1 1 20% !important;
        width: 20% !important;
        min-width: 0 !important;
        max-width: 20% !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    html body nav.bottom-nav > a[data-nav-key="ai"] {
        display: none !important;
        flex: 0 0 0 !important;
        width: 0 !important;
        max-width: 0 !important;
        overflow: hidden !important;
    }
}

/* 2026-06-04: remove oversized mobile blank space */
@media (max-width: 991px) {
    html body .main {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }

    html body .main-wrap,
    html body .explore-page-v2,
    html body .market-page,
    html body .news-page {
        margin-bottom: 0 !important;
        padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px)) !important;
    }

    html body footer.footer {
        margin: 0 !important;
        padding: 0 !important;
        min-height: 0 !important;
    }

    html body nav.bottom-nav {
        min-height: auto !important;
        padding-top: 5px !important;
        padding-bottom: calc(5px + env(safe-area-inset-bottom, 0px)) !important;
    }
}

/* 2026-06-04: compact mobile news story feed with audio play overlay */
.news-story-media {
    position: relative !important;
}

.news-story-play {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 8;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 94px;
    min-height: 48px;
    padding: 0 18px;
    border: 1px solid rgba(255, 255, 255, .68);
    border-radius: 999px;
    background: rgba(15, 23, 42, .72);
    color: #ffffff;
    font-size: 14px;
    font-weight: 900;
    transform: translate(-50%, -50%);
    box-shadow: 0 18px 40px rgba(2, 6, 23, .34);
    backdrop-filter: blur(16px);
    transition: transform .18s ease, background .18s ease, opacity .18s ease;
}

.news-story-play i {
    font-size: 24px;
    line-height: 1;
}

.news-story-play:not(.is-disabled):active {
    transform: translate(-50%, -50%) scale(.96);
}

.news-story-play.is-playing {
    background: rgba(14, 116, 144, .88);
}

.news-story-play.is-disabled {
    opacity: .72;
    cursor: not-allowed;
}

@media (max-width: 768px) {
    .news-page .news-shell {
        padding-top: 8px !important;
    }

    .news-page .news-filter-bar {
        margin: 0 -2px 10px !important;
        padding: 4px 0 6px !important;
    }

    .news-page .news-page-filter {
        gap: 8px !important;
        padding-bottom: 2px !important;
    }

    .news-page .news-filter-btn {
        min-height: 36px !important;
        padding: 0 12px !important;
        border-radius: 999px !important;
        font-size: 13px !important;
        white-space: nowrap !important;
    }

    .news-page .news-section-title {
        margin: 6px 0 10px !important;
    }

    .news-page .news-section-title h2 {
        font-size: 24px !important;
        line-height: 1.12 !important;
    }

    .news-page .news-main-grid {
        gap: 10px !important;
    }

    .news-page .news-card {
        display: grid !important;
        grid-template-columns: 108px minmax(0, 1fr) !important;
        min-height: 108px !important;
        overflow: hidden !important;
        border-radius: 18px !important;
    }

    .news-page .news-card-thumb {
        width: 108px !important;
        height: 100% !important;
        min-height: 108px !important;
        aspect-ratio: auto !important;
    }

    .news-page .news-card-body {
        min-width: 0 !important;
        padding: 10px !important;
    }

    .news-page .news-card h3 {
        display: -webkit-box !important;
        margin: 0 !important;
        overflow: hidden !important;
        font-size: 15.5px !important;
        line-height: 1.22 !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
    }

    .news-page .news-card p {
        display: -webkit-box !important;
        margin: 6px 0 0 !important;
        overflow: hidden !important;
        font-size: 13px !important;
        line-height: 1.35 !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
    }

    .news-page .news-card-tags {
        gap: 5px !important;
        margin-top: 7px !important;
        overflow: hidden !important;
        flex-wrap: nowrap !important;
    }

    .news-page .news-pill {
        max-width: 92px !important;
        min-height: 24px !important;
        padding: 4px 6px !important;
        overflow: hidden !important;
        font-size: 10.5px !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .news-story-feed {
        scroll-snap-type: y proximity !important;
    }

    .news-story-slide {
        scroll-snap-stop: normal !important;
        grid-template-rows: minmax(188px, 34dvh) minmax(0, 1fr) !important;
    }

    .news-story-media {
        height: 34dvh !important;
        min-height: 188px !important;
    }

    .news-story-play {
        min-width: 82px !important;
        min-height: 44px !important;
        padding: 0 15px !important;
        font-size: 13px !important;
    }

    .news-story-play i {
        font-size: 22px !important;
    }

    .news-story-copy {
        display: flex !important;
        min-height: 0 !important;
        overflow-y: auto !important;
        flex-direction: column !important;
        padding: 12px 14px calc(72px + env(safe-area-inset-bottom, 0px)) !important;
        overscroll-behavior-y: contain !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .news-story-copy .news-modal-tags {
        gap: 6px !important;
        margin-bottom: 6px !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        scrollbar-width: none !important;
    }

    .news-story-copy .news-modal-tags::-webkit-scrollbar {
        display: none !important;
    }

    .news-story-copy .news-pill {
        flex: 0 0 auto !important;
        min-height: 26px !important;
        padding: 5px 8px !important;
        font-size: 11px !important;
    }

    .news-story-copy h2 {
        margin: 6px 0 8px !important;
        font-size: clamp(20px, 5.5vw, 25px) !important;
        line-height: 1.14 !important;
        letter-spacing: -.35px !important;
    }

    .news-story-progress {
        margin-bottom: 7px !important;
    }

    .news-story-read {
        gap: 7px !important;
        margin-top: 8px !important;
        padding: 12px !important;
        border-radius: 16px !important;
    }

    .news-story-read > b {
        font-size: 12px !important;
    }

    .news-story-read p {
        font-size: 14px !important;
        line-height: 1.55 !important;
    }

    .news-story-hint {
        bottom: calc(62px + env(safe-area-inset-bottom, 0px)) !important;
        max-width: calc(100vw - 28px) !important;
    }
}

/* 2026-06-04: horizontal news story navigation + subtle audio pill + synced subtitles */
.news-modal.news-story-active .news-story-feed {
    display: flex !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory !important;
    scroll-behavior: smooth;
    overscroll-behavior-x: contain !important;
    overscroll-behavior-y: none !important;
    touch-action: pan-x pan-y;
}

.news-modal.news-story-active .news-story-slide {
    flex: 0 0 100% !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 100% !important;
    min-height: 100% !important;
    scroll-snap-align: start !important;
}

.news-modal.news-story-active .news-story-copy {
    overflow-y: auto !important;
    overscroll-behavior-y: contain !important;
    -webkit-overflow-scrolling: touch !important;
}

.news-modal.news-story-active .news-story-progress b {
    text-transform: none !important;
    letter-spacing: 0 !important;
}

.news-modal.news-story-active .news-story-hint {
    bottom: calc(14px + env(safe-area-inset-bottom, 0px)) !important;
    max-width: min(520px, calc(100vw - 28px)) !important;
    opacity: .78 !important;
}

.news-story-subtitle {
    position: absolute;
    left: 50%;
    right: auto;
    bottom: 18px;
    z-index: 9;
    width: min(86%, 640px);
    padding: 10px 14px 12px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(2, 6, 23, .52), rgba(2, 6, 23, .78));
    color: #ffffff;
    font-size: clamp(15px, 2.2vw, 20px);
    font-weight: 900;
    line-height: 1.35;
    text-align: center;
    text-shadow: 0 2px 8px rgba(0, 0, 0, .65);
    transform: translateX(-50%);
    box-shadow: 0 18px 46px rgba(2, 6, 23, .28);
    backdrop-filter: blur(12px);
    pointer-events: none;
}

.news-story-subtitle[hidden] {
    display: none !important;
}

.news-story-subtitle span {
    display: block;
}

.news-story-subtitle i {
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 6px;
    height: 2px;
    border-radius: 999px;
    background: #38bdf8;
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .18s linear;
    opacity: .9;
}

.news-story-play {
    left: auto !important;
    right: 14px !important;
    top: 14px !important;
    z-index: 10 !important;
    min-width: 0 !important;
    min-height: 34px !important;
    gap: 6px !important;
    padding: 0 10px !important;
    border: 1px solid rgba(255, 255, 255, .28) !important;
    border-radius: 999px !important;
    background: rgba(2, 6, 23, .42) !important;
    color: rgba(255, 255, 255, .96) !important;
    font-size: 12px !important;
    font-weight: 950 !important;
    letter-spacing: -.1px !important;
    opacity: .62 !important;
    transform: none !important;
    box-shadow: 0 10px 26px rgba(2, 6, 23, .18) !important;
    backdrop-filter: blur(14px) saturate(1.08) !important;
}

.news-story-play i {
    font-size: 17px !important;
}

.news-story-play:not(.is-disabled):active {
    transform: scale(.96) !important;
}

.news-story-play.is-playing {
    background: rgba(14, 116, 144, .52) !important;
    opacity: .78 !important;
}

.news-story-play.is-disabled {
    opacity: .38 !important;
}

@media (max-width: 768px) {
    .news-modal.news-story-active .news-story-feed {
        scroll-snap-type: x mandatory !important;
    }

    .news-modal.news-story-active .news-story-slide {
        grid-template-rows: minmax(188px, 34dvh) minmax(0, 1fr) !important;
    }

    .news-story-subtitle {
        bottom: 10px !important;
        width: calc(100% - 28px) !important;
        padding: 8px 11px 11px !important;
        border-radius: 15px !important;
        font-size: 14px !important;
        line-height: 1.32 !important;
    }

    .news-story-play {
        right: 10px !important;
        top: 10px !important;
        min-height: 30px !important;
        padding: 0 8px !important;
        font-size: 11px !important;
    }

    .news-story-play i {
        font-size: 15px !important;
    }

    .news-modal.news-story-active .news-story-hint {
        bottom: calc(62px + env(safe-area-inset-bottom, 0px)) !important;
        padding: 0 10px !important;
        font-size: 10.5px !important;
    }
}

/* 2026-06-04: homepage mixed news/explore feed + destination map modal helper */
.page-ui-home .trend-type {
    display: inline-flex;
    align-items: center;
    width: max-content;
    min-height: 21px;
    margin-bottom: 4px;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 10.5px;
    line-height: 1;
    font-weight: 900;
    letter-spacing: .01em;
}

.page-ui-home .trend-type--news {
    background: #e0f2fe;
    color: #0369a1;
}

.page-ui-home .trend-type--explore {
    background: #ecfdf5;
    color: #047857;
}

.page-ui-home .trend-item > div {
    min-width: 0;
}

body.dest-map-open {
    overflow: hidden;
}

@media (max-width: 767px) {
    .page-ui-home .trend-type {
        min-height: 19px;
        padding: 0 7px;
        font-size: 10px;
        margin-bottom: 3px;
    }
}
/* 2026-06-04: app-like story audio button state. Idle stays centered; playing moves away from image focus. */
.news-modal.news-story-active .news-story-play {
    left: 50% !important;
    right: auto !important;
    top: 50% !important;
    width: 64px !important;
    height: 64px !important;
    min-width: 64px !important;
    min-height: 64px !important;
    padding: 0 !important;
    border-radius: 999px !important;
    transform: translate(-50%, -50%) !important;
    border: 1px solid rgba(255, 255, 255, .34) !important;
    background: radial-gradient(circle at 32% 24%, rgba(255,255,255,.34), rgba(255,255,255,.08) 38%, rgba(15,23,42,.42)) !important;
    color: #ffffff !important;
    opacity: .94 !important;
    box-shadow: 0 18px 46px rgba(2, 6, 23, .28), inset 0 1px 0 rgba(255,255,255,.2) !important;
    backdrop-filter: blur(16px) saturate(1.08) !important;
    transition: left .28s cubic-bezier(.2,.8,.2,1), right .28s cubic-bezier(.2,.8,.2,1), top .28s cubic-bezier(.2,.8,.2,1), transform .28s cubic-bezier(.2,.8,.2,1), width .24s ease, height .24s ease, min-width .24s ease, min-height .24s ease, padding .24s ease, opacity .18s ease, background .18s ease !important;
}

.news-modal.news-story-active .news-story-play span {
    display: none !important;
}

.news-modal.news-story-active .news-story-play i {
    margin-left: 3px !important;
    font-size: 34px !important;
    line-height: 1 !important;
    filter: drop-shadow(0 2px 4px rgba(2,6,23,.22));
}

.news-modal.news-story-active .news-story-play:not(.is-disabled):not(.is-playing):active {
    transform: translate(-50%, -50%) scale(.94) !important;
}

.news-modal.news-story-active .news-story-play.is-playing {
    left: auto !important;
    right: 72px !important;
    top: 14px !important;
    width: auto !important;
    height: 34px !important;
    min-width: 0 !important;
    min-height: 34px !important;
    padding: 0 10px !important;
    transform: none !important;
    gap: 5px !important;
    border-radius: 999px !important;
    background: rgba(15, 23, 42, .42) !important;
    opacity: .58 !important;
    box-shadow: 0 10px 26px rgba(2, 6, 23, .18) !important;
}

.news-modal.news-story-active .news-story-play.is-playing:hover,
.news-modal.news-story-active .news-story-play.is-playing:focus-visible {
    opacity: .86 !important;
    background: rgba(15, 23, 42, .62) !important;
}

.news-modal.news-story-active .news-story-play.is-playing:active {
    transform: scale(.96) !important;
}

.news-modal.news-story-active .news-story-play.is-playing span {
    display: inline !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 850 !important;
    letter-spacing: .01em !important;
}

.news-modal.news-story-active .news-story-play.is-playing i {
    margin-left: 0 !important;
    font-size: 15px !important;
    filter: none !important;
}

.news-modal.news-story-active .news-story-play.is-disabled {
    opacity: .45 !important;
}

@media (max-width: 768px) {
    .news-modal.news-story-active .news-story-play {
        width: 58px !important;
        height: 58px !important;
        min-width: 58px !important;
        min-height: 58px !important;
    }

    .news-modal.news-story-active .news-story-play i {
        font-size: 31px !important;
    }

    .news-modal.news-story-active .news-story-play.is-playing {
        right: max(68px, calc(env(safe-area-inset-right, 0px) + 68px)) !important;
        top: max(12px, calc(env(safe-area-inset-top, 0px) + 12px)) !important;
        height: 30px !important;
        min-height: 30px !important;
        padding: 0 8px !important;
        opacity: .52 !important;
    }

    .news-modal.news-story-active .news-story-play.is-playing span {
        display: none !important;
    }
}
/* 2026-06-04: story progress badge top-left and source inline in quick read. */
.news-modal.news-story-active .news-story-media {
    position: relative !important;
}

.news-modal.news-story-active .news-story-media .news-story-progress {
    position: absolute !important;
    left: max(12px, calc(env(safe-area-inset-left, 0px) + 12px)) !important;
    top: max(12px, calc(env(safe-area-inset-top, 0px) + 12px)) !important;
    z-index: 11 !important;
    display: inline-flex !important;
    align-items: center !important;
    width: auto !important;
    margin: 0 !important;
    pointer-events: none !important;
}

.news-modal.news-story-active .news-story-media .news-story-progress span {
    min-height: 28px !important;
    padding: 0 10px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255,255,255,.32) !important;
    background: rgba(15, 23, 42, .42) !important;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
    letter-spacing: .02em !important;
    box-shadow: 0 10px 28px rgba(2, 6, 23, .2) !important;
    backdrop-filter: blur(14px) saturate(1.05) !important;
}

.news-modal.news-story-active .news-story-media .news-story-progress b {
    display: none !important;
}

.news-modal.news-story-active .news-story-copy > .news-story-progress,
.news-modal.news-story-active .news-modal-source-row[data-news-source-row] {
    display: none !important;
}

.news-modal.news-story-active .news-story-read-head {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 5px 8px !important;
    min-width: 0 !important;
}

.news-modal.news-story-active .news-story-read-head b {
    color: #0f766e !important;
    font-size: 13px !important;
    font-weight: 950 !important;
    text-transform: uppercase !important;
    letter-spacing: .08em !important;
}

.news-modal.news-story-active .news-story-source-sep {
    color: #94a3b8 !important;
    font-weight: 900 !important;
}

.news-modal.news-story-active .news-story-source-inline {
    display: inline-flex !important;
    align-items: center !important;
    min-width: 0 !important;
    max-width: 100% !important;
    color: #2563eb !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
}

.news-modal.news-story-active a.news-story-source-inline:hover {
    color: #1d4ed8 !important;
    text-decoration: underline !important;
}

@media (max-width: 768px) {
    .news-modal.news-story-active .news-story-media .news-story-progress {
        left: max(10px, calc(env(safe-area-inset-left, 0px) + 10px)) !important;
        top: max(10px, calc(env(safe-area-inset-top, 0px) + 10px)) !important;
    }

    .news-modal.news-story-active .news-story-media .news-story-progress span {
        min-height: 25px !important;
        padding: 0 8px !important;
        font-size: 11px !important;
    }

    .news-modal.news-story-active .news-story-read-head b {
        font-size: 12px !important;
    }

    .news-modal.news-story-active .news-story-source-inline {
        font-size: 11px !important;
    }
}
/* 2026-06-04: one-line large story subtitles for app-like audio reading. */
.news-modal.news-story-active .news-story-subtitle {
    width: min(92%, 760px) !important;
    max-width: calc(100% - 32px) !important;
    padding: 9px 16px 13px !important;
    border-radius: 18px !important;
    font-size: clamp(20px, 3.4vw, 34px) !important;
    line-height: 1.12 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.news-modal.news-story-active .news-story-subtitle span {
    display: block !important;
    width: 100% !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.news-modal.news-story-active .news-story-subtitle i {
    left: 16px !important;
    right: 16px !important;
    bottom: 6px !important;
}

@media (max-width: 768px) {
    .news-modal.news-story-active .news-story-subtitle {
        bottom: 11px !important;
        width: calc(100% - 28px) !important;
        max-width: calc(100% - 28px) !important;
        padding: 8px 13px 12px !important;
        border-radius: 16px !important;
        font-size: clamp(21px, 6.4vw, 30px) !important;
        line-height: 1.08 !important;
    }
}
/* 2026-06-04: compact one-line subtitles and image-foot swipe hint. */
.news-modal.news-story-active .news-story-subtitle {
    width: min(94%, 820px) !important;
    max-width: calc(100% - 28px) !important;
    padding: 8px 14px 12px !important;
    border-radius: 16px !important;
    font-size: clamp(16px, 2.35vw, 24px) !important;
    line-height: 1.12 !important;
}

.news-modal.news-story-active .news-story-hint {
    min-height: 30px !important;
    padding: 0 11px !important;
    gap: 8px !important;
    border-color: rgba(255,255,255,.2) !important;
    background: rgba(15,23,42,.46) !important;
    font-size: 11.5px !important;
    font-weight: 900 !important;
    opacity: .74 !important;
    box-shadow: 0 10px 26px rgba(2,6,23,.18) !important;
}

.news-modal.news-story-active .news-story-hint i {
    font-size: 13px !important;
    line-height: 1 !important;
    opacity: .92 !important;
}

.news-modal.news-story-active .news-story-hint span {
    white-space: nowrap !important;
    letter-spacing: .01em !important;
}

@media (max-width: 768px) {
    .news-modal.news-story-active .news-story-subtitle {
        bottom: 10px !important;
        width: calc(100% - 32px) !important;
        max-width: calc(100% - 32px) !important;
        padding: 7px 12px 11px !important;
        border-radius: 15px !important;
        font-size: clamp(15px, 4.25vw, 20px) !important;
        line-height: 1.1 !important;
    }

    .news-modal.news-story-active .news-story-hint {
        top: calc(max(188px, 34dvh) - 42px) !important;
        bottom: auto !important;
        min-height: 28px !important;
        padding: 0 10px !important;
        gap: 7px !important;
        font-size: 11px !important;
        opacity: .76 !important;
    }
}
/* 2026-06-04: refined story mobile typography and hint-only swipe label. */
.news-modal.news-story-active .news-story-hint {
    min-height: 27px !important;
    padding: 0 12px !important;
    border-radius: 999px !important;
    background: rgba(15, 23, 42, .46) !important;
    color: #fff !important;
    opacity: .72 !important;
    box-shadow: 0 10px 24px rgba(2,6,23,.18) !important;
}

.news-modal.news-story-active .news-story-hint i {
    display: none !important;
}

.news-modal.news-story-active .news-story-hint span {
    display: inline-block !important;
    width: auto !important;
    max-width: none !important;
    font-size: 0 !important;
    line-height: 1 !important;
}

.news-modal.news-story-active .news-story-hint span::after {
    content: "Vuốt chuyển tin";
    font-size: 11px !important;
    font-weight: 850 !important;
    letter-spacing: .01em !important;
    white-space: nowrap !important;
}

.news-modal.news-story-active .news-story-subtitle {
    width: min(90%, 720px) !important;
    max-width: calc(100% - 36px) !important;
    padding: 6px 12px 10px !important;
    border-radius: 15px !important;
    background: linear-gradient(180deg, rgba(2,6,23,.38), rgba(2,6,23,.62)) !important;
    font-size: clamp(13px, 1.9vw, 19px) !important;
    line-height: 1.12 !important;
    font-weight: 850 !important;
    letter-spacing: -.01em !important;
}

.news-modal.news-story-active .news-story-copy {
    background: linear-gradient(180deg, #fff 0%, #fbfdff 100%) !important;
}

.news-modal.news-story-active .news-story-copy .news-modal-tags {
    margin-bottom: 9px !important;
}

.news-modal.news-story-active .news-story-copy .news-pill {
    min-height: 25px !important;
    padding: 4px 8px !important;
    font-size: 10.8px !important;
    font-weight: 850 !important;
}

.news-modal.news-story-active .news-story-copy .news-pill i,
.news-modal.news-story-active .news-story-copy .news-pill svg {
    width: 13px !important;
    height: 13px !important;
    font-size: 13px !important;
}

.news-modal.news-story-active .news-story-copy h2[data-news-title] {
    margin: 7px 0 10px !important;
    max-width: 100% !important;
    color: #0f172a !important;
    font-size: clamp(22px, 3.2vw, 34px) !important;
    line-height: 1.14 !important;
    font-weight: 900 !important;
    letter-spacing: -.045em !important;
}

.news-modal.news-story-active .news-story-read {
    gap: 8px !important;
    margin-top: 10px !important;
    padding: 14px !important;
    border-color: rgba(148, 163, 184, .26) !important;
    border-radius: 18px !important;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
    box-shadow: 0 10px 26px rgba(15, 23, 42, .045) !important;
}

.news-modal.news-story-active .news-story-read-head {
    gap: 4px 7px !important;
}

.news-modal.news-story-active .news-story-read-head b {
    font-size: 11px !important;
    letter-spacing: .075em !important;
}

.news-modal.news-story-active .news-story-source-inline {
    font-size: 11px !important;
    font-weight: 800 !important;
}

.news-modal.news-story-active .news-story-read p {
    color: #1e293b !important;
    font-size: 15.5px !important;
    line-height: 1.58 !important;
    font-weight: 720 !important;
    letter-spacing: -.01em !important;
}

@media (max-width: 768px) {
    .news-modal.news-story-active .news-story-subtitle {
        bottom: 42px !important;
        width: calc(100% - 40px) !important;
        max-width: calc(100% - 40px) !important;
        padding: 5px 11px 9px !important;
        border-radius: 13px !important;
        font-size: clamp(12.5px, 3.35vw, 15.5px) !important;
        line-height: 1.08 !important;
        opacity: .96 !important;
    }

    .news-modal.news-story-active .news-story-hint {
        top: calc(max(188px, 34dvh) - 31px) !important;
        bottom: auto !important;
        min-height: 24px !important;
        padding: 0 9px !important;
        opacity: .7 !important;
    }

    .news-modal.news-story-active .news-story-hint span::after {
        font-size: 10.5px !important;
    }

    .news-modal.news-story-active .news-story-copy {
        padding: 12px 14px calc(80px + env(safe-area-inset-bottom, 0px)) !important;
    }

    .news-modal.news-story-active .news-story-copy .news-modal-tags {
        gap: 6px !important;
        margin-bottom: 7px !important;
    }

    .news-modal.news-story-active .news-story-copy h2[data-news-title] {
        margin: 7px 0 9px !important;
        font-size: clamp(20px, 5vw, 23px) !important;
        line-height: 1.16 !important;
        letter-spacing: -.04em !important;
    }

    .news-modal.news-story-active .news-story-read {
        margin-top: 9px !important;
        padding: 12px 13px !important;
        border-radius: 17px !important;
    }

    .news-modal.news-story-active .news-story-read p {
        font-size: 14.5px !important;
        line-height: 1.54 !important;
        font-weight: 680 !important;
    }
}
/* 2026-06-04: visible MP3 audio control on news cards. */
.news-page .news-card-audio {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: fit-content;
    max-width: 100%;
    min-height: 34px;
    margin-top: 10px;
    padding: 7px 11px;
    border-radius: 999px;
    background: linear-gradient(135deg, #0f172a, #1e293b);
    color: #fff;
    font-size: 12.5px;
    font-weight: 900;
    line-height: 1;
    box-shadow: 0 10px 22px rgba(15, 23, 42, .16);
    cursor: pointer;
    user-select: none;
    transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.news-page .news-card-audio svg {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
}

.news-page .news-card-audio:hover,
.news-page .news-card-audio:focus-visible {
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 14px 28px rgba(15, 23, 42, .22);
    outline: none;
}

.news-page .news-card-audio.is-playing {
    background: linear-gradient(135deg, #0f766e, #0d9488);
    box-shadow: 0 14px 28px rgba(13, 148, 136, .24);
}

.news-page .news-card-audio.is-playing svg {
    animation: lc-news-audio-pulse 1s ease-in-out infinite;
}

@keyframes lc-news-audio-pulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.08); opacity: .78; }
}

@media (max-width: 768px) {
    .news-page .news-card-audio {
        min-height: 30px;
        margin-top: 8px;
        padding: 6px 9px;
        font-size: 11.5px;
        gap: 6px;
    }

    .news-page .news-card-audio svg {
        width: 15px;
        height: 15px;
        flex-basis: 15px;
    }
}

/* 2026-06-05: clear view counters for news cards and home Tin list. */
.page-ui-home .trend-view-count {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    width: fit-content;
    max-width: 100%;
    min-height: 23px;
    margin-top: 5px;
    padding: 3px 8px;
    border: 1px solid rgba(15, 118, 110, .12);
    border-radius: 999px;
    background: rgba(236, 253, 245, .9);
    color: #0f766e;
    font-size: 11px;
    line-height: 1;
    font-weight: 850;
}

.page-ui-home .trend-view-count i {
    font-size: 12px;
    line-height: 1;
}

.page-ui-home .trend-view-count b {
    font: inherit;
}

.page-ui-home .trend-view-count em {
    color: #64748b;
    font-style: normal;
    font-weight: 750;
}

.news-page .news-card-tags .pill-view {
    top: 0 !important;
    margin-top: 0 !important;
    background: #ecfdf5;
    color: #0f766e;
    font-size: 12px;
}

/* 2026-06-05: homepage top news must stay compact and balanced. */
@media (min-width: 992px) {
    .page-ui-home .top-layout {
        display: grid !important;
        grid-template-columns: minmax(0, 1.52fr) minmax(300px, .58fr) !important;
        gap: 14px !important;
        align-items: stretch !important;
        margin-bottom: 16px !important;
    }

    .page-ui-home .hero-news {
        min-height: 0 !important;
        height: clamp(330px, 29vw, 430px) !important;
        border-radius: 14px !important;
        box-shadow: 0 16px 40px rgba(15, 23, 42, .10) !important;
    }

    .page-ui-home .hero-news::after {
        display: none !important;
    }

    .page-ui-home .hero-news-bg {
        background-size: cover !important;
        background-position: center !important;
        transform: none !important;
        filter: saturate(1.03) contrast(1.02) !important;
    }

    .page-ui-home .hero-news-overlay {
        background: linear-gradient(90deg, rgba(2, 6, 23, .74) 0%, rgba(15, 23, 42, .48) 50%, rgba(15, 23, 42, .16) 100%) !important;
    }

    .page-ui-home .hero-content {
        max-width: 760px !important;
        padding: 24px !important;
    }

    .page-ui-home .hero-title {
        max-width: 720px !important;
        height: auto !important;
        max-height: 2.18em !important;
        margin-bottom: 10px !important;
        overflow: hidden !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        color: #fff !important;
        font-size: clamp(28px, 3.1vw, 46px) !important;
        line-height: 1.08 !important;
        letter-spacing: -.055em !important;
    }

    .page-ui-home .hero-desc {
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        max-width: 620px !important;
        margin-bottom: 12px !important;
        overflow: hidden !important;
        color: rgba(255,255,255,.86) !important;
        font-size: 14px !important;
        line-height: 1.45 !important;
    }

    .page-ui-home .hero-meta {
        gap: 6px !important;
    }

    .page-ui-home .hero-meta span {
        min-height: 28px !important;
        padding: 0 9px !important;
        gap: 5px !important;
        border-radius: 999px !important;
        font-size: 11.5px !important;
        font-weight: 800 !important;
    }

    .page-ui-home .side-stack,
    .page-ui-home .trend-card {
        min-height: 0 !important;
        height: clamp(330px, 29vw, 430px) !important;
    }

    .page-ui-home .trend-card {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        padding: 13px !important;
        border-radius: 14px !important;
        overflow: hidden !important;
    }

    .page-ui-home .trend-head {
        flex: 0 0 auto !important;
        min-height: 28px !important;
        margin: 0 !important;
        padding: 0 0 8px !important;
        border-bottom: 1px solid rgba(226, 232, 240, .82) !important;
    }

    .page-ui-home .trend-list {
        flex: 1 1 auto !important;
        display: grid !important;
        align-content: start !important;
        gap: 8px !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }

    .page-ui-home .trend-list .trend-item:nth-child(n+5) {
        display: none !important;
    }

    .page-ui-home .trend-item,
    .page-ui-home .trend-primary-mobile {
        display: grid !important;
        grid-template-columns: 76px minmax(0, 1fr) !important;
        gap: 9px !important;
        align-items: center !important;
        min-height: 82px !important;
        padding: 7px !important;
        border-radius: 11px !important;
        background: #fff !important;
        border: 1px solid rgba(226, 232, 240, .82) !important;
        box-shadow: none !important;
    }

    .page-ui-home .trend-item .thumb,
    .page-ui-home .trend-item .news-thumb-img {
        width: 76px !important;
        height: 68px !important;
        min-height: 68px !important;
        border-radius: 9px !important;
        background-size: cover !important;
        background-position: center !important;
    }

    .page-ui-home .trend-type {
        min-height: 20px !important;
        padding: 3px 8px !important;
        border-radius: 999px !important;
        font-size: 10px !important;
        line-height: 1 !important;
        font-weight: 850 !important;
    }

    .page-ui-home .trend-item b {
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        margin-top: 4px !important;
        overflow: hidden !important;
        color: #0f172a !important;
        font-size: 14px !important;
        line-height: 1.22 !important;
        font-weight: 880 !important;
        letter-spacing: -.012em !important;
    }

    .page-ui-home .trend-item small {
        display: block !important;
        margin-top: 4px !important;
        overflow: hidden !important;
        color: #64748b !important;
        font-size: 11px !important;
        line-height: 1.25 !important;
        font-weight: 700 !important;
        white-space: nowrap !important;
        text-overflow: ellipsis !important;
    }

    .page-ui-home .trend-view-count {
        display: inline-flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 4px !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: 120px !important;
        min-height: 22px !important;
        margin-top: 5px !important;
        padding: 3px 7px !important;
        border-radius: 999px !important;
        font-size: 10.5px !important;
        line-height: 1 !important;
        box-shadow: none !important;
    }

    .page-ui-home .trend-view-count i {
        font-size: 11px !important;
    }

    .page-ui-home .trend-view-count b,
    .page-ui-home .trend-view-count em {
        display: inline !important;
        font-size: 10.5px !important;
        line-height: 1 !important;
    }

    .page-ui-home .trend-more-link {
        flex: 0 0 auto !important;
        min-height: 32px !important;
        margin-top: auto !important;
        padding: 7px 10px !important;
        border-radius: 10px !important;
        font-size: 12px !important;
    }
}

@media (max-width: 991.98px) {
    .page-ui-home .trend-view-count {
        flex-direction: row !important;
        width: auto !important;
        min-height: 22px !important;
        padding: 3px 7px !important;
        font-size: 10.5px !important;
    }
}

/* 2026-06-05: tighten the homepage lead block after visual review. */
@media (min-width: 992px) {
    .page-ui-home .top-layout {
        grid-template-columns: minmax(0, 1.42fr) minmax(320px, .58fr) !important;
        gap: 12px !important;
    }

    .page-ui-home #newsHero.hero-news {
        height: clamp(350px, 25vw, 380px) !important;
        border-radius: 18px !important;
    }

    .page-ui-home #newsHero .hero-content {
        max-width: 680px !important;
        padding: 22px !important;
    }

    .page-ui-home #newsHero .hero-title {
        max-width: 660px !important;
        max-height: 2.28em !important;
        margin: 0 0 12px !important;
        font-size: clamp(22px, 1.9vw, 32px) !important;
        line-height: 1.14 !important;
        letter-spacing: -.025em !important;
    }

    .page-ui-home #newsHero .hero-desc {
        display: none !important;
    }

    .page-ui-home #newsHero .hero-meta span {
        min-height: 29px !important;
        padding: 0 10px !important;
        font-size: 11.5px !important;
        background: rgba(15, 23, 42, .44) !important;
    }

    .page-ui-home .side-stack,
    .page-ui-home #tin.trend-card {
        height: clamp(350px, 25vw, 380px) !important;
    }

    .page-ui-home #tin.trend-card {
        gap: 8px !important;
        padding: 12px !important;
        border-radius: 18px !important;
    }

    .page-ui-home #tin .trend-head {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        min-height: 28px !important;
        padding-bottom: 8px !important;
    }

    .page-ui-home #tin .trend-head span {
        font-size: clamp(17px, 1.35vw, 21px) !important;
        line-height: 1.08 !important;
        letter-spacing: -.025em !important;
    }

    .page-ui-home #tin .trend-top-link {
        flex: 0 0 auto !important;
        font-size: 13px !important;
        font-weight: 850 !important;
        white-space: nowrap !important;
    }

    .page-ui-home #newsList.trend-list {
        gap: 7px !important;
        overflow: hidden !important;
    }

    .page-ui-home #newsList .trend-item:nth-child(n+5) {
        display: none !important;
    }

    .page-ui-home #newsList .trend-item,
    .page-ui-home #newsList .trend-primary-mobile {
        grid-template-columns: 58px minmax(0, 1fr) !important;
        gap: 7px !important;
        height: 58px !important;
        min-height: 58px !important;
        padding: 5px !important;
        border-radius: 12px !important;
        overflow: hidden !important;
    }

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

    .page-ui-home #newsList .trend-item > div {
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-areas:
            "type meta"
            "title title"
            "views views";
        align-items: center !important;
        column-gap: 6px !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    .page-ui-home #newsList .trend-type {
        grid-area: type;
        min-height: 16px !important;
        padding: 1px 6px !important;
        font-size: 9px !important;
    }

    .page-ui-home #newsList .trend-item b {
        grid-area: title;
        margin: 0 !important;
        font-size: 12.2px !important;
        line-height: 1.13 !important;
        letter-spacing: 0 !important;
    }

    .page-ui-home #newsList .trend-item small {
        grid-area: meta;
        min-width: 0 !important;
        margin: 0 !important;
        font-size: 9.8px !important;
        line-height: 1 !important;
    }

    .page-ui-home #newsList .trend-view-count {
        grid-area: views;
        min-height: 12px !important;
        margin-top: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        color: #64748b !important;
        font-size: 9.2px !important;
        box-shadow: none !important;
    }

    .page-ui-home #newsList .trend-view-count em {
        display: none !important;
    }

    .page-ui-home #tin .trend-more-link {
        display: none !important;
    }
}

/* 2026-06-05: home news teasers show image + two-line title only; views stay in detail/story. */
.page-ui-home #newsHero .hero-meta span:has(#newsHeroViews),
.page-ui-home #newsList .trend-type,
.page-ui-home #newsList .trend-item small,
.page-ui-home #newsList .trend-view-count {
    display: none !important;
}

.page-ui-home #newsList .trend-item > div {
    display: flex !important;
    align-items: center !important;
    min-width: 0 !important;
    overflow: hidden !important;
}

.page-ui-home #newsList .trend-item b {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
}

@media (min-width: 992px) {
    .page-ui-home #newsList.trend-list {
        flex: 1 1 auto !important;
        display: grid !important;
        grid-template-rows: repeat(4, minmax(0, 1fr)) !important;
        gap: 6px !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }

    .page-ui-home #newsList .trend-item,
    .page-ui-home #newsList .trend-primary-mobile {
        grid-template-columns: 86px minmax(0, 1fr) !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 5px 4px !important;
        gap: 11px !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .page-ui-home #newsList .trend-item:hover,
    .page-ui-home #newsList .trend-primary-mobile:hover {
        border: 0 !important;
        background: rgba(15, 118, 110, .045) !important;
        box-shadow: none !important;
        transform: none !important;
    }

    .page-ui-home #newsList .trend-item .thumb,
    .page-ui-home #newsList .trend-item .news-thumb-img {
        width: 86px !important;
        height: 56px !important;
        min-height: 56px !important;
        border-radius: 12px !important;
    }

    .page-ui-home #newsList .trend-item b {
        font-size: 13.8px !important;
        line-height: 1.22 !important;
        font-weight: 880 !important;
        max-height: 2.44em !important;
        letter-spacing: -.01em !important;
    }
}

@media (max-width: 991.98px) {
    .page-ui-home .top-layout,
    .page-ui-home .side-stack,
    .page-ui-home #tin.trend-card {
        width: calc(100vw - 20px) !important;
        max-width: calc(100vw - 20px) !important;
        min-width: 0 !important;
        margin-left: auto !important;
        margin-right: auto !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    .page-ui-home #newsList.trend-list {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        width: 100% !important;
        max-width: 100% !important;
        gap: 9px !important;
    }

    .page-ui-home #newsList .trend-item,
    .page-ui-home #newsList .trend-primary-mobile {
        display: grid !important;
        grid-template-columns: 72px 210px !important;
        align-items: center !important;
        min-height: 78px !important;
        padding: 8px !important;
        gap: 10px !important;
        border-radius: 16px !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    .page-ui-home #newsList .trend-item .thumb,
    .page-ui-home #newsList .trend-item .news-thumb-img {
        width: 72px !important;
        height: 56px !important;
        min-height: 56px !important;
        border-radius: 12px !important;
    }

    .page-ui-home #newsList .trend-item b {
        width: 210px !important;
        max-width: 210px !important;
        font-size: 15px !important;
        line-height: 1.2 !important;
        font-weight: 880 !important;
        word-break: normal !important;
    }
}