/* ==================== CHAT ==================== */
        .chat-page { max-width:1100px; margin:0 auto; padding:28px 20px 70px; }
        .chat-shell { background:#fff; border:1px solid var(--border); border-radius:20px; overflow:hidden; box-shadow:var(--shadow); min-height:520px; display:grid; grid-template-columns:340px 1fr; }
        .chat-sidebar { border-right:1px solid var(--border); background:#fbfcfe; }
        .chat-sidebar-header { padding:20px; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; }
        .chat-sidebar-header h2 { font-size:20px; color:var(--secondary); }
        .chat-list { max-height:620px; overflow:auto; }
        .chat-list-empty { padding:40px 24px; text-align:center; color:var(--text-light); font-size:14px; }
        .chat-list-item { width:100%; border:0; background:transparent; text-align:left; padding:15px 18px; display:flex; gap:12px; cursor:pointer; border-bottom:1px solid #edf1f5; transition:var(--transition); }
        .chat-list-item:hover,.chat-list-item.active { background:#fff4ef; }
        .chat-avatar { width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex:0 0 44px; background:linear-gradient(135deg,var(--primary),#ff8b72); color:#fff; font-weight:800; }
        .chat-list-main { min-width:0; flex:1; }
        .chat-list-top { display:flex; justify-content:space-between; gap:8px; }
        .chat-list-name { font-weight:800; color:var(--secondary); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
        .chat-list-time { font-size:11px; color:var(--text-light); white-space:nowrap; }
        .chat-list-product { font-size:12px; color:var(--primary); font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
        .chat-list-preview { font-size:12px; color:var(--text-light); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:2px; }
        .chat-main { display:flex; flex-direction:column; min-width:0; background:#fff; }
        .chat-header { padding:16px 20px; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:12px; }
        .chat-header-info { min-width:0; flex:1; }
        .chat-header-name { font-weight:800; color:var(--secondary); }
        .chat-header-product { font-size:12px; color:var(--text-light); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
        .chat-back { display:none; }
        .chat-messages { flex:1; min-height:380px; max-height:560px; overflow:auto; padding:20px; background:linear-gradient(180deg,#f8fafc,#fff); }
        .chat-empty { height:100%; min-height:320px; display:flex; align-items:center; justify-content:center; text-align:center; color:var(--text-light); padding:30px; }
        .chat-message-row { display:flex; margin:8px 0; }
        .chat-message-row.mine { justify-content:flex-end; }
        .chat-bubble { max-width:min(78%,520px); padding:10px 13px; border-radius:16px 16px 16px 4px; background:#eef2f7; color:var(--text); box-shadow:0 1px 2px rgba(0,0,0,.04); white-space:pre-wrap; overflow-wrap:anywhere; }
        .chat-message-row.mine .chat-bubble { background:var(--primary); color:#fff; border-radius:16px 16px 4px 16px; }
        .chat-message-time { display:block; font-size:10px; opacity:.7; margin-top:4px; text-align:right; }
        .chat-compose { padding:14px; border-top:1px solid var(--border); display:flex; gap:10px; background:#fff; }
        .chat-compose textarea { flex:1; min-height:46px; max-height:130px; resize:none; border:1px solid var(--border); border-radius:14px; padding:12px 14px; font:inherit; outline:none; }
        .chat-compose textarea:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(255,90,60,.1); }
        .chat-compose button { align-self:flex-end; min-width:90px; }
        .chat-notice { margin:0 20px 14px; padding:10px 12px; border-radius:10px; background:#fff8e7; color:#735000; font-size:12px; border:1px solid #f3d98b; }
        .chat-nav-badge { display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 5px; border-radius:999px; background:var(--primary); color:#fff; font-size:10px; font-weight:800; margin-left:4px; }
        .product-chat-actions { display:flex; gap:10px; flex-wrap:wrap; }
        .product-chat-actions .btn { flex:1; min-width:160px; }
        @media (max-width:760px) {
            .chat-shell { grid-template-columns:1fr; min-height:600px; }
            .chat-sidebar { border-right:0; }
            .chat-sidebar.hidden-mobile { display:none; }
            .chat-main.hidden-mobile { display:none; }
            .chat-back { display:inline-flex; }
            .chat-messages { min-height:400px; }
            .chat-list { max-height:none; }
        }

        /* ==================== GLOBAL ==================== */
        :root {
            --primary: #FF5A3C;
            --primary-dark: #E64A2E;
            --primary-light: #FFF0EB;
            --secondary: #0B2B40;
            --secondary-light: #1A4A63;
            --accent: #00A896;
            --accent-light: #E0F5F3;
            --gold: #D4A853;
            --gold-light: #FDF6E9;
            --purple: #7C3AED;
            --purple-light: #F0EBFF;
            --red: #DC2626;
            --red-light: #FEF2F2;
            --blue: #2563EB;
            --blue-light: #EFF6FF;
            --bg: #F5F7FA;
            --white: #FFFFFF;
            --text: #1E2A3A;
            --text-light: #64748B;
            --border: #E2E8F0;
            --shadow-sm: 0 1px 3px rgba(0,0,0,0.05);
            --shadow: 0 4px 16px rgba(0,0,0,0.08);
            --shadow-lg: 0 12px 30px rgba(0,0,0,0.12);
            --radius: 14px;
            --radius-sm: 8px;
            --transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
            --font: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
        }
        * { margin: 0; padding: 0; box-sizing: border-box; }
        body {
            font-family: var(--font);
            background: var(--bg);
            color: var(--text);
            line-height: 1.6;
            -webkit-font-smoothing: antialiased;
            padding-bottom: 70px;
        }
        /* Top Bar */
        .top-bar {
            background: var(--secondary);
            color: rgba(255,255,255,0.85);
            font-size: 12px;
            padding: 6px 24px;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }
        .top-bar a { color: #FFB49A; text-decoration: none; }
        .top-bar .left span { margin-right: 20px; }
        /* Navbar */
        .navbar {
            background: var(--white);
            padding: 0 24px;
            height: 72px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            box-shadow: var(--shadow-sm);
            position: sticky;
            top: 0;
            z-index: 1000;
            border-bottom: 1px solid var(--border);
        }
        .nav-brand { display: flex; align-items: center; gap: 10px; cursor: pointer; }
        .nav-brand .logo-icon {
            width: 42px; height: 42px;
            background: linear-gradient(135deg, var(--primary), #FF7A5C);
            border-radius: 12px;
            display: flex; align-items: center; justify-content: center;
            font-size: 20px; font-weight: 800; color: white;
        }
        .nav-brand .brand-text { font-size: 24px; font-weight: 800; color: var(--secondary); }
        .nav-brand .brand-text span { color: var(--primary); }
        .nav-search {
            display: flex; align-items: center;
            background: var(--bg);
            border-radius: 50px;
            padding: 4px 4px 4px 18px;
            gap: 6px; border: 1px solid var(--border);
            width: 360px; height: 44px;
        }
        .nav-search input { border: none; background: transparent; padding: 8px 0; font-size: 14px; outline: none; width: 100%; }
        .nav-actions { display: flex; align-items: center; gap: 10px; }
        .btn {
            padding: 10px 20px; border-radius: 50px; border: none; cursor: pointer;
            font-weight: 600; font-size: 14px; transition: var(--transition);
            display: inline-flex; align-items: center; gap: 8px;
            font-family: var(--font);
        }
        .btn-primary { background: var(--primary); color: white; box-shadow: 0 4px 14px rgba(255,90,60,0.3); }
        .btn-primary:hover { background: var(--primary-dark); transform: translateY(-1px); }
        .btn-outline { background: transparent; color: var(--secondary); border: 1.5px solid var(--secondary); }
        .btn-outline:hover { background: var(--secondary); color: white; }
        .btn-ghost { background: transparent; color: var(--text-light); font-weight: 500; padding: 8px 12px; }
        .btn-ghost:hover { background: var(--bg); }
        .btn-sm { padding: 7px 16px; font-size: 13px; }
        .btn-whatsapp { background: #25D366; color: white; }
        /* Hero */
        .hero {
            background: linear-gradient(140deg, #0B2B40 0%, #164A63 45%, #1B5E7A 100%);
            padding: 50px 24px 70px; text-align: center; position: relative; overflow: hidden;
        }
        .hero::before, .hero::after { content: ''; position: absolute; border-radius: 50%; }
        .hero::before { top: -120px; right: -80px; width: 500px; height: 500px; background: radial-gradient(circle, rgba(255,255,255,0.08) 0%, transparent 70%); }
        .hero::after { bottom: -100px; left: -60px; width: 400px; height: 400px; background: radial-gradient(circle, rgba(0,168,150,0.1) 0%, transparent 70%); }
        .hero-content { position: relative; z-index: 2; max-width: 700px; margin: 0 auto; }
        .hero-badge {
            display: inline-block; background: rgba(255,255,255,0.12); color: #FFD0B8;
            padding: 8px 18px; border-radius: 30px; font-size: 13px; font-weight: 600;
            margin-bottom: 20px; border: 1px solid rgba(255,255,255,0.2);
        }
        .hero h1 { font-size: 42px; font-weight: 800; color: white; margin-bottom: 16px; }
        .hero h1 span { color: #FF9D7A; }
        .hero p { font-size: 17px; color: rgba(255,255,255,0.85); margin-bottom: 28px; }
        .hero-search {
            display: flex; gap: 10px; max-width: 560px; margin: 0 auto;
            background: white; padding: 6px; border-radius: 50px;
            box-shadow: 0 14px 40px rgba(0,0,0,0.25);
        }
        .hero-search input { flex: 1; border: none; padding: 14px 22px; font-size: 15px; outline: none; border-radius: 50px; background: transparent; }
        .hero-search .btn { border-radius: 50px; padding: 12px 30px; font-size: 15px; font-weight: 700; }
        /* Flash Sale */
        .flash-sale-section { max-width: 1200px; margin: -30px auto 0; padding: 0 24px; position: relative; z-index: 5; }
        .flash-sale-banner {
            background: linear-gradient(135deg, #DC2626 0%, #B91C1C 100%);
            border-radius: var(--radius); padding: 20px 24px;
            display: flex; align-items: center; justify-content: space-between;
            flex-wrap: wrap; gap: 12px; box-shadow: var(--shadow-lg);
        }
        .flash-sale-left { display: flex; align-items: center; gap: 16px; }
        .flash-sale-title { color: white; font-size: 22px; font-weight: 800; }
        .flash-sale-timer { display: flex; gap: 6px; align-items: center; }
        .timer-box { background: rgba(0,0,0,0.3); color: white; padding: 6px 10px; border-radius: 6px; font-size: 14px; font-weight: 700; min-width: 32px; text-align: center; }
        .timer-separator { color: rgba(255,255,255,0.7); font-size: 16px; }
        .flash-products-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; margin-top: 14px; }
        .flash-product-card { background: var(--white); border-radius: var(--radius); overflow: hidden; cursor: pointer; border: 1px solid var(--border); transition: var(--transition); }
        .flash-product-card:hover { box-shadow: var(--shadow); transform: translateY(-3px); }
        .flash-product-image { width: 100%; height: 160px; display: flex; align-items: center; justify-content: center; font-size: 50px; background: #f0f7fa; position: relative; overflow: hidden; }
        .flash-product-image img { width: 100%; height: 100%; object-fit: cover; }
        .flash-product-discount { position: absolute; top: 8px; right: 8px; background: var(--red); color: white; padding: 4px 8px; border-radius: 4px; font-size: 11px; font-weight: 700; }
        .flash-product-body { padding: 12px 14px; }
        .flash-product-title { font-size: 13px; font-weight: 700; margin-bottom: 4px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
        .flash-product-price { font-size: 16px; font-weight: 800; color: var(--secondary); margin-bottom: 8px; }
        .flash-product-old-price { font-size: 12px; color: var(--text-light); text-decoration: line-through; margin-right: 6px; }
        .flash-stock-bar { width: 100%; height: 6px; background: var(--border); border-radius: 3px; overflow: hidden; margin-top: 6px; }
        .flash-stock-fill { height: 100%; background: linear-gradient(90deg, #FFB400, #FF5A3C); border-radius: 3px; }
        .flash-stock-text { font-size: 10px; color: var(--text-light); }
        /* Promo Banners */
        .promo-banners { max-width: 1200px; margin: 24px auto; padding: 0 24px; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; }
        .promo-banner { border-radius: var(--radius); padding: 20px; min-height: 120px; display: flex; align-items: center; justify-content: space-between; cursor: pointer; transition: var(--transition); overflow: hidden; }
        .promo-banner:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
        .promo-banner.gold { background: linear-gradient(135deg, #FDF6E9, #F5E6C8); border: 1px solid #E8D5B0; }
        .promo-banner.purple { background: linear-gradient(135deg, #F0EBFF, #DDD0FF); border: 1px solid #C4B5FD; }
        .promo-banner.blue { background: linear-gradient(135deg, #EFF6FF, #D0E7FF); border: 1px solid #93C5FD; }
        .promo-text h4 { font-size: 16px; font-weight: 800; }
        .promo-text p { font-size: 12px; color: var(--text-light); }
        .promo-emoji { font-size: 40px; }
        /* Featured Items */
        /* Normal paid Featured Listings use bronze. Featured Seller products use gold. */
        .product-card.is-featured { border:2px solid #b87333; box-shadow:0 10px 28px rgba(184,115,51,.22); }
        .product-card.is-featured .product-image { background:linear-gradient(135deg,#fff7ef,#f3d3b2); }
        .product-featured-tag { position:absolute; top:10px; left:10px; z-index:2; background:linear-gradient(135deg,#8b4f20,#c77b3d); color:#fffaf5; font-size:10px; font-weight:900; letter-spacing:.6px; padding:6px 10px; border-radius:999px; box-shadow:0 5px 12px rgba(120,67,30,.28); }
        .featured-section { max-width:1200px; margin:-28px auto 22px; padding:0 24px; position:relative; z-index:5; }
        .featured-shell { background:linear-gradient(145deg,#ffffff 0%,#fff7f4 100%); border:1px solid #ffe1d8; border-radius:24px; padding:26px; box-shadow:0 18px 55px rgba(15,42,67,.10); }
        .featured-header { margin-bottom:20px; }
        .eyebrow { color:var(--primary); font-size:10px; font-weight:800; letter-spacing:1.5px; margin-bottom:4px; }
        .featured-subtitle { font-size:13px; color:var(--text-light); margin-top:3px; }
        .featured-products-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
        .featured-product-card { min-width:0; background:#fffaf5; border:1px solid #d6a06b; border-radius:16px; overflow:hidden; cursor:pointer; box-shadow:0 4px 14px rgba(120,67,30,.08); transition:transform .25s,box-shadow .25s,border-color .25s; }
        .featured-product-card:hover { transform:translateY(-5px); box-shadow:0 18px 34px rgba(120,67,30,.16); border-color:#b87333; }
        .featured-product-card.featured-seller-featured-card { background:linear-gradient(135deg,#fffdf2 0%,#fff4c7 55%,#ffedb0 100%); border:1px solid #d9b348; box-shadow:0 10px 28px rgba(138,98,0,.18); }
        .featured-product-card.featured-seller-featured-card .featured-product-body { background:linear-gradient(180deg,rgba(255,252,231,.96),rgba(255,241,190,.96)); }
        .featured-product-card.featured-seller-featured-card .featured-product-category { color:#8a6200; }
        .featured-product-card.featured-seller-featured-card .featured-product-title { color:#6e5000; }
        .featured-product-card.featured-seller-featured-card .featured-product-price { color:#a66b00; }
        .featured-product-card.featured-seller-featured-card .featured-tag { background:linear-gradient(135deg,#8a6200,#d5a421); color:#fffdf4; }
        .featured-product-image { height:150px; display:flex; align-items:center; justify-content:center; font-size:48px; background:#f2f6f8; position:relative; overflow:hidden; }
        .featured-product-image img { width:100%; height:100%; object-fit:cover; }
        .featured-tag { position:absolute; top:10px; left:10px; background:var(--primary); color:#fff; font-size:10px; font-weight:800; padding:5px 9px; border-radius:999px; box-shadow:0 5px 12px rgba(255,90,60,.25); }
        .featured-product-body { padding:12px; }
        .featured-product-category { font-size:10px; text-transform:uppercase; letter-spacing:1px; color:var(--primary); font-weight:800; }
        .featured-product-title { font-size:14px; font-weight:750; line-height:1.35; margin:4px 0 8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
        .featured-product-price { font-size:17px; font-weight:850; color:var(--secondary); }
        .featured-empty { grid-column:1/-1; padding:34px 18px; text-align:center; color:var(--text-light); background:rgba(255,255,255,.75); border:1px dashed #f0b8aa; border-radius:16px; }


        /* Priority theme: Diamond inside Chrome = Featured Seller + individually Featured.
           Stronger contrast: vivid diamond interior with a darker metallic chrome frame. */
        .product-card.featured-seller-product.is-featured,
        .product-card.is-chrome-featured,
        .featured-product-card.chrome-featured-card {
            background:linear-gradient(135deg,#6f7a82 0%,#eef4f7 8%,#3d474e 16%,#aab6bd 24%,#2e373d 31%,#d9f7ff 39%,#79d9ff 62%,#c9f5ff 82%,#59646b 100%) !important;
            border:3px solid #59636a !important;
            box-shadow:0 0 0 2px #dce7ec inset,0 0 0 5px rgba(45,57,64,.45) inset,0 14px 34px rgba(28,53,66,.38) !important;
        }
        .product-card.featured-seller-product.is-featured .product-image {
            background:linear-gradient(135deg,#d9fbff,#5dd7ff 52%,#c8f6ff) !important;
        }
        .product-card.featured-seller-product.is-featured .product-body,
        .featured-product-card.chrome-featured-card .featured-product-body {
            background:linear-gradient(180deg,#e9fbff 0%,#a9eaff 52%,#d7f8ff 100%) !important;
        }
        .product-card.featured-seller-product.is-featured .product-category,
        .featured-product-card.chrome-featured-card .featured-product-category { color:#075f83 !important; }
        .product-card.featured-seller-product.is-featured .product-title,
        .featured-product-card.chrome-featured-card .featured-product-title { color:#082b3b !important; }
        .product-card.featured-seller-product.is-featured .product-price,
        .featured-product-card.chrome-featured-card .featured-product-price { color:#0078aa !important; }
        .product-card.featured-seller-product.is-featured .product-seller { color:#17465b !important; }
        .product-card.featured-seller-product.is-featured::before {
            content:'💎 DIAMOND FEATURED';
            background:linear-gradient(135deg,#edfeff 0%,#48d4ff 48%,#008ac0 100%) !important;
            color:#042b3b !important;
            border:2px solid #59636a;
            text-shadow:0 1px 0 rgba(255,255,255,.55);
        }
        .product-card.featured-seller-product.is-featured .product-featured-tag,
        .featured-product-card.chrome-featured-card .featured-tag {
            background:linear-gradient(135deg,#dffbff 0%,#35cdfb 52%,#007aa9 100%) !important;
            color:#032a3b !important;
            border:1px solid #506069;
        }
        .product-card.featured-seller-product.is-featured .featured-seller-badge {
            color:#063f57 !important;
            background:#9feaff !important;
            border-color:#237c9e !important;
        }

        .featured-product-card.chrome-featured-card .featured-product-image {
            background:linear-gradient(135deg,#dffbff,#57d7ff 50%,#c7f5ff) !important;
        }
        .featured-product-card.chrome-featured-card { position:relative; }
        .featured-product-card.chrome-featured-card::after {
            content:'💎 DIAMOND + CHROME';
            position:absolute; top:10px; right:8px; z-index:4; padding:5px 8px; border-radius:999px;
            background:linear-gradient(135deg,#eefcff,#4fd4ff 48%,#087ca9 100%);
            color:#03293a; border:2px solid #59636a; font-size:8px; font-weight:900; letter-spacing:.45px;
            box-shadow:0 2px 8px rgba(17,72,92,.25);
        }

        /* Product detail page themes */
        .product-detail-modal.theme-gold { background:linear-gradient(145deg,#fffdf3,#fff5cb) !important; border:2px solid #d9b348; }
        .product-detail-modal.theme-gold .gallery-thumbs,
        .product-detail-modal.theme-gold .modal-actions { background:rgba(255,250,228,.97); }
        .product-detail-modal.theme-gold .product-detail-content { background:linear-gradient(180deg,#fffdf4,#fff4cc); }
        .product-detail-modal.theme-gold .detail-category { color:#8a6200; }
        .product-detail-modal.theme-gold .modal-product-price { color:#a66b00; }
        .product-detail-modal.theme-gold .detail-info-item,
        .product-detail-modal.theme-gold .modal-product-desc,
        .product-detail-modal.theme-gold .seller-detail-card { background:#fff9df; border-color:#e9cf72; }
        .product-detail-modal.theme-gold .seller-detail-avatar { background:linear-gradient(135deg,#8a6200,#d5a421); }

        .product-detail-modal.theme-bronze { background:linear-gradient(145deg,#fffaf5,#f5e0cc) !important; border:2px solid #b87333; }
        .product-detail-modal.theme-bronze .gallery-thumbs,
        .product-detail-modal.theme-bronze .modal-actions { background:rgba(255,248,241,.97); }
        .product-detail-modal.theme-bronze .product-detail-content { background:linear-gradient(180deg,#fffaf5,#f7e4d2); }
        .product-detail-modal.theme-bronze .detail-category { color:#8b4f20; }
        .product-detail-modal.theme-bronze .modal-product-price { color:#a45f2c; }
        .product-detail-modal.theme-bronze .detail-info-item,
        .product-detail-modal.theme-bronze .modal-product-desc,
        .product-detail-modal.theme-bronze .seller-detail-card { background:#fff7ef; border-color:#d9ae88; }
        .product-detail-modal.theme-bronze .seller-detail-avatar { background:linear-gradient(135deg,#8b4f20,#c77b3d); }

        .product-detail-modal.theme-chrome {
            background:linear-gradient(135deg,#566068 0%,#e8eef1 6%,#343d43 12%,#aeb9bf 18%,#4b555b 25%,#d8f8ff 34%,#53d6ff 62%,#b8f1ff 84%,#566068 100%) !important;
            border:3px solid #4f5a61;
            box-shadow:0 0 0 2px #eaf3f6 inset,0 0 0 6px rgba(39,49,55,.38) inset,0 18px 45px rgba(30,55,66,.35);
        }
        .product-detail-modal.theme-chrome .gallery-thumbs,
        .product-detail-modal.theme-chrome .modal-actions {
            background:linear-gradient(135deg,#e5faff,#7bddff 55%,#c8f4ff) !important;
        }
        .product-detail-modal.theme-chrome .product-detail-content {
            background:linear-gradient(145deg,#ecfcff 0%,#9ae6ff 55%,#d8f8ff 100%) !important;
        }
        .product-detail-modal.theme-chrome .detail-category { color:#00658d; }
        .product-detail-modal.theme-chrome .modal-product-price { color:#007eb0; }
        .product-detail-modal.theme-chrome .detail-info-item,
        .product-detail-modal.theme-chrome .modal-product-desc,
        .product-detail-modal.theme-chrome .seller-detail-card {
            background:#d9f7ff !important; border-color:#4da2c2 !important;
        }
        .product-detail-modal.theme-chrome .seller-detail-avatar {
            background:linear-gradient(135deg,#e9fcff,#45cfff,#007ba8) !important; color:#032b3b;
        }
        .product-detail-badge { display:none; width:max-content; margin:0 0 12px; padding:6px 10px; border-radius:999px; font-size:10px; font-weight:900; letter-spacing:.7px; }
        .product-detail-modal.theme-gold .product-detail-badge,
        .product-detail-modal.theme-bronze .product-detail-badge,
        .product-detail-modal.theme-chrome .product-detail-badge { display:inline-flex; align-items:center; }
        .product-detail-modal.theme-gold .product-detail-badge { background:#fff0b0; color:#7d5b00; border:1px solid #d9b348; }
        .product-detail-modal.theme-bronze .product-detail-badge { background:#f5dcc6; color:#7f431a; border:1px solid #c98752; }
        .product-detail-modal.theme-chrome .product-detail-badge {
            background:linear-gradient(135deg,#effdff,#43d2ff,#007ba8) !important;
            color:#032b3b; border:2px solid #4f5a61;
        }

        .featured-seller-product {
            background: linear-gradient(135deg, #fffdf2 0%, #fff4c7 55%, #ffedb0 100%) !important;
            border: 1px solid #d9b348 !important;
            box-shadow: 0 10px 28px rgba(138,98,0,.18) !important;
            position: relative;
            overflow: hidden;
        }
        .featured-seller-product::before {
            content: '👑 FEATURED SELLER';
            position: absolute;
            top: 10px;
            right: 10px;
            z-index: 10;
            background: linear-gradient(135deg, #8a6200, #d5a421);
            color: #fffdf4;
            padding: 5px 9px;
            border-radius: 999px;
            font-size: 9px;
            font-weight: 900;
            letter-spacing: .7px;
            box-shadow: 0 4px 12px rgba(90,63,0,.22);
            pointer-events: none;
        }
        .featured-seller-product .product-body {
            background: linear-gradient(180deg, rgba(255,252,231,.96), rgba(255,241,190,.96)) !important;
        }
        .featured-seller-product .product-category { color: #8a6200 !important; }
        .featured-seller-product .product-title { color: #6e5000 !important; }
        .featured-seller-product .product-price { color: #a66b00 !important; }
        .featured-seller-product .product-seller { color: #755c19 !important; }
        .featured-seller-product .seller-avatar {
            background: linear-gradient(135deg, #8a6200, #d5a421) !important;
            color: #fffdf4 !important;
        }
        .featured-seller-product .btn-contact {
            background: #fff8d9 !important;
            border-color: #d9b348 !important;
        }
        .featured-seller-badge { margin-left:6px; font-size:10px; font-weight:800; color:#8a6200; background:#fff4c2; border:1px solid #e9cf72; padding:3px 6px; border-radius:999px; }
        .seller-spotlight { grid-column:1/-1; background:linear-gradient(135deg,#fff9df,#fff3b5); border:1px solid #e9cf72; border-radius:18px; padding:20px; margin-bottom:2px; box-shadow:0 10px 25px rgba(138,98,0,.08); }
        .seller-spotlight-heading { font-size:11px; font-weight:900; letter-spacing:1.4px; color:#8a6200; }
        .seller-spotlight-name { font-size:22px; font-weight:900; color:var(--secondary); margin-top:4px; }
        .seller-spotlight-copy { font-size:13px; color:#6f5a1a; margin-top:6px; }

        .featured-seller-picks { grid-column:1/-1; background:linear-gradient(135deg,#fffdf5,#f8fbf7); border:1px solid #e9cf72; border-radius:18px; padding:18px; margin-bottom:2px; box-shadow:0 8px 22px rgba(52,82,67,.07); }
        .featured-seller-picks-heading { font-size:12px; font-weight:900; letter-spacing:1.35px; color:#8a6200; }
        .featured-seller-picks-copy { font-size:13px; color:#65736f; margin-top:4px; }
        .featured-seller-picks-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-top:14px; }
        .featured-seller-picks-grid .product-card { min-width:0; }
        @media (max-width:900px){ .featured-seller-picks-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
        @media (max-width:520px){ .featured-seller-picks{padding:14px;} .featured-seller-picks-grid{grid-template-columns:1fr 1fr;gap:9px;} .featured-seller-picks-copy{font-size:12px;} }
        /* Categories */
        .categories-section { padding: 24px 24px 10px; max-width: 1200px; margin: 0 auto; }
        .section-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; flex-wrap: wrap; gap: 12px; }
        .section-title { font-size: 24px; font-weight: 800; color: var(--secondary); position: relative; padding-left: 14px; }
        .section-title::before { content: ''; position: absolute; left: 0; top: 8px; bottom: 8px; width: 4px; background: var(--primary); border-radius: 4px; }
        .categories-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 10px; }
        .category-card { background: var(--white); border-radius: var(--radius-sm); padding: 14px 8px; text-align: center; cursor: pointer; transition: var(--transition); border: 2px solid transparent; box-shadow: var(--shadow-sm); }
        .category-card:hover, .category-card.active { border-color: var(--primary); box-shadow: var(--shadow); }
        .category-card.active { background: #FFF3EF; }
        .category-icon { font-size: 28px; margin-bottom: 6px; }
        .category-name { font-size: 12px; font-weight: 600; }
        /* Filters */
        .filters-bar {
            max-width: 1200px;
            margin: 0 auto 18px;
            padding: 0 24px;
            display: flex;
            flex-wrap: wrap;
            gap: 12px;
            align-items: center;
        }
        .filter-group {
            display: flex;
            align-items: center;
            gap: 8px;
        }
        .filter-group label { font-size: 13px; font-weight: 600; color: var(--text-light); }
        .filter-group select, .filter-group input {
            padding: 8px 12px;
            border: 1px solid var(--border);
            border-radius: var(--radius-sm);
            font-size: 13px;
            outline: none;
            background: var(--white);
        }
        /* Products */
        .products-section { padding: 20px 24px 40px; max-width: 1200px; margin: 0 auto; }
        .products-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
        .product-card { background: var(--white); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-sm); transition: var(--transition); cursor: pointer; border: 1px solid var(--border); }
        .product-card:hover { box-shadow: var(--shadow-lg); transform: translateY(-4px); }
        .product-image { width: 100%; height: 190px; display: flex; align-items: center; justify-content: center; font-size: 56px; background: #f0f7fa; position: relative; overflow: hidden; }
        .product-image img { width: 100%; height: 100%; object-fit: cover; }
        .product-image .badge { position: absolute; top: 10px; left: 10px; background: var(--primary); color: white; padding: 4px 10px; border-radius: 20px; font-size: 10px; font-weight: 700; }
        .product-image .badge.used { background: var(--secondary); }
        .product-image .badge.new { background: var(--accent); }
        .product-body { padding: 14px; }
        .product-category { font-size: 10px; text-transform: uppercase; letter-spacing: 1.2px; color: var(--primary); font-weight: 700; margin-bottom: 4px; }
        .product-title { font-size: 14px; font-weight: 700; margin-bottom: 4px; line-height: 1.4; }
        .product-seller { font-size: 11px; color: var(--text-light); margin-bottom: 10px; display: flex; align-items: center; gap: 6px; }
        .seller-avatar { width: 20px; height: 20px; border-radius: 50%; background: var(--secondary); color: white; display: inline-flex; align-items: center; justify-content: center; font-size: 9px; font-weight: 700; }
        .verified-badge { background: #00A896; color: white; font-size: 9px; padding: 2px 5px; border-radius: 4px; }
        .product-price-row { display: flex; align-items: center; justify-content: space-between; }
        .product-price { font-size: 18px; font-weight: 800; color: var(--secondary); }
        .product-price .naira { font-size: 14px; font-weight: 700; color: var(--primary); }
        .btn-contact { background: var(--primary); color: white; border: none; padding: 6px 12px; border-radius: 20px; font-size: 11px; font-weight: 600; cursor: pointer; }
        /* Product Modal Gallery */
        .modal-product-image { width: 100%; height: 220px; border-radius: var(--radius-sm); display: flex; align-items: center; justify-content: center; font-size: 80px; background: #f0f7fa; margin-bottom: 20px; overflow: hidden; position: relative; }
        .modal-product-image img { width: 100%; height: 100%; object-fit: contain; }
        .gallery-thumbs { display: flex; gap: 6px; margin-bottom: 12px; flex-wrap: wrap; }
        .gallery-thumb { width: 50px; height: 50px; border-radius: 6px; overflow: hidden; cursor: pointer; border: 2px solid transparent; }
        .gallery-thumb.active { border-color: var(--primary); }
        .gallery-thumb img { width: 100%; height: 100%; object-fit: cover; }
        .gallery-nav { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(0,0,0,0.5); color: white; border: none; width: 36px; height: 36px; border-radius: 50%; cursor: pointer; font-size: 18px; display: flex; align-items: center; justify-content: center; }
        .gallery-prev { left: 10px; }
        .gallery-next { right: 10px; }
        /* Sell Modal Image Upload */
        .image-upload-container { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
        .image-upload-item { position: relative; width: 80px; height: 80px; border-radius: 8px; overflow: hidden; border: 1px solid var(--border); }
        .image-upload-item img { width: 100%; height: 100%; object-fit: cover; }
        .image-upload-item .remove-image { position: absolute; top: 2px; right: 2px; background: rgba(0,0,0,0.6); color: white; border: none; border-radius: 50%; width: 20px; height: 20px; font-size: 12px; cursor: pointer; }
        .image-upload-placeholder { width: 80px; height: 80px; border: 2px dashed var(--border); border-radius: 8px; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 24px; color: var(--text-light); }
        .image-upload-placeholder:hover { border-color: var(--primary); background: var(--primary-light); }
        /* Account Page */
        .account-page { max-width: 600px; margin: 30px auto; padding: 0 24px; }
        .account-header { text-align: center; margin-bottom: 24px; }
        .account-avatar { width: 80px; height: 80px; border-radius: 50%; background: linear-gradient(135deg, var(--primary), var(--secondary)); color: white; display: flex; align-items: center; justify-content: center; font-size: 32px; font-weight: 800; margin: 0 auto 12px; }
        .account-name { font-size: 22px; font-weight: 800; color: var(--secondary); }
        .account-email { font-size: 13px; color: var(--text-light); }
        .account-card { background: var(--white); border-radius: var(--radius); box-shadow: var(--shadow-sm); overflow: hidden; margin-bottom: 16px; border: 1px solid var(--border); }
        .account-card-header { padding: 14px 18px; font-size: 13px; font-weight: 700; color: var(--text-light); text-transform: uppercase; background: var(--bg); border-bottom: 1px solid var(--border); }
        .account-menu-item { padding: 14px 18px; display: flex; align-items: center; gap: 12px; cursor: pointer; transition: var(--transition); border-bottom: 1px solid var(--border); font-size: 14px; }
        .account-menu-item:last-child { border-bottom: none; }
        .account-menu-item:hover { background: var(--bg); padding-left: 22px; }
        .menu-icon { font-size: 18px; width: 24px; text-align: center; }
        .menu-arrow { margin-left: auto; color: var(--text-light); }
        .logout-btn { padding: 14px 18px; display: flex; align-items: center; justify-content: center; gap: 8px; color: var(--red); font-weight: 700; cursor: pointer; font-size: 14px; background: transparent; border: none; width: 100%; }
        .logout-btn:hover { background: var(--red-light); }
        /* Seller Dashboard */
        .seller-dashboard { padding: 14px 18px; }
        .seller-listing { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--border); }
        .seller-listing:last-child { border-bottom: none; }
        .seller-listing-info { flex: 1; }
        .seller-listing-title { font-weight: 600; font-size: 14px; }
        .seller-listing-meta { font-size: 12px; color: var(--text-light); }
        .seller-listing-actions { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
        .seller-details-section.hidden { display:none; }
        /* Bottom Nav */
        .bottom-nav { display: none; position: fixed; bottom: 0; left: 0; right: 0; background: var(--white); border-top: 1px solid var(--border); z-index: 1500; padding: 8px 0; }
        .bottom-nav-inner { display: flex; justify-content: space-around; align-items: center; }
        .bottom-nav-item { display: flex; flex-direction: column; align-items: center; gap: 2px; cursor: pointer; font-size: 10px; font-weight: 600; color: var(--text-light); border: none; background: transparent; }
        .bottom-nav-item.active { color: var(--primary); }
        .bottom-nav-item .nav-icon { font-size: 20px; }
        .toast { position: fixed; left: 50%; bottom: 80px; transform: translateX(-50%); width: min(760px, calc(100vw - 32px)); box-sizing: border-box; background: var(--secondary); color: white; padding: 18px 20px; border-radius: 16px; font-weight: 600; z-index: 3000; animation: toastIn 0.3s ease; display: flex; align-items: center; justify-content: space-between; gap: 16px; max-width: calc(100vw - 32px); }
        .toast-message { flex: 1; line-height: 1.45; overflow-wrap: anywhere; }
        .toast-cancel { flex: 0 0 auto; border: 0; border-radius: 10px; padding: 10px 16px; font: inherit; font-weight: 700; cursor: pointer; background: white; color: #E74C3C; }
        @keyframes toastIn { from { transform: translate(-50%, 20px); opacity: 0; } to { transform: translate(-50%, 0); opacity: 1; } }
        .toast.error { background: #E74C3C; }
        @keyframes slideInRight { from { transform: translateX(100px); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
        /* Footer */
        .footer { background: var(--secondary); color: white; padding: 40px 24px 20px; margin-top: 40px; border-top: 4px solid var(--primary); }
        .footer-content { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 40px; }
        .footer-brand { font-size: 26px; font-weight: 800; }
        .footer-brand span { color: var(--primary); }
        .footer p { font-size: 13px; opacity: 0.7; }
        .footer h4 { font-size: 15px; font-weight: 700; margin-bottom: 14px; color: #FFB49A; }
        .footer ul { list-style: none; }
        .footer ul li { margin-bottom: 10px; font-size: 13px; opacity: 0.85; cursor: pointer; }
        .footer-bottom { max-width: 1200px; margin: 30px auto 0; padding-top: 20px; border-top: 1px solid rgba(255,255,255,0.15); text-align: center; font-size: 12px; opacity: 0.6; }
        /* Responsive */
        @media (max-width: 900px) { .footer-content { grid-template-columns: 1fr 1fr; } .nav-search { width: 220px; } .promo-banners { grid-template-columns: 1fr; } }
        @media (max-width: 768px) {
            body { padding-bottom: 70px; }
            .navbar { padding: 0 16px; height: auto; flex-wrap: wrap; padding-top: 8px; padding-bottom: 8px; gap: 6px; }
            .nav-brand .brand-text { font-size: 18px; }
            .nav-search { width: 100%; order: 3; margin: 4px 0 6px; height: 38px; }
            .btn { padding: 7px 12px; font-size: 12px; }
            .hero { padding: 40px 16px 60px; }
            .hero h1 { font-size: 28px; }
            .hero p { font-size: 13px; }
            .hero-search { flex-direction: column; border-radius: var(--radius); padding: 12px; gap: 8px; }
            .hero-search input { padding: 10px 14px; font-size: 14px; border-radius: var(--radius-sm); background: var(--bg); }
            .hero-search .btn { border-radius: var(--radius-sm); padding: 10px; font-size: 14px; justify-content: center; }
            .flash-sale-section { padding: 0 16px; margin-top: -20px; }
            .flash-products-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
            .flash-product-image { height: 120px; font-size: 36px; }
            .promo-banners { padding: 0 16px; }
            .categories-section, .products-section { padding-left: 16px; padding-right: 16px; }
            .categories-grid { grid-template-columns: repeat(auto-fill, minmax(85px, 1fr)); gap: 8px; }
            .category-card { padding: 10px 6px; }
            .category-icon { font-size: 22px; }
            .category-name { font-size: 10px; }
            .products-grid { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 10px; }
            .product-image { height: 130px; font-size: 36px; }
            .product-title { font-size: 12px; }
            .product-price { font-size: 15px; }
            .modal { padding: 20px; margin: 10px; }
            .form-row { grid-template-columns: 1fr; gap: 0; }
            .footer-content { grid-template-columns: 1fr; gap: 25px; }
            .section-title { font-size: 20px; }
            .bottom-nav { display: block; }
            .footer { margin-bottom: 60px; }
            .account-page { padding: 0 16px; }
            .filters-bar { padding: 0 16px; gap: 8px; }
            .filter-group { flex-wrap: wrap; }
        }
        @media (max-width: 480px) {
            .products-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
            .product-image { height: 100px; font-size: 28px; }
            .product-body { padding: 8px; }
            .product-title { font-size: 11px; }
            .product-price { font-size: 13px; }
            .btn-contact { padding: 4px 8px; font-size: 9px; }
            .flash-products-grid { grid-template-columns: 1fr 1fr; }
        }

        /* ==================== PHASE 2 VISUAL REDESIGN ==================== */
        :root { --primary:#ff5a3c; --secondary:#102a43; --ink:#102a43; --bg:#f6f8fc; }
        html { scroll-behavior:smooth; }
        body { background: radial-gradient(circle at 8% 0%, #fff2ed 0, transparent 22rem), var(--bg); }
        .top-bar { background: linear-gradient(90deg,#081f33,#143d56); padding:7px max(20px, calc((100vw - 1240px)/2)); }
        .navbar { height:78px; padding:0 max(20px, calc((100vw - 1240px)/2)); backdrop-filter:blur(18px); background:rgba(255,255,255,.90); }
        .nav-brand { transition:transform .25s ease; } .nav-brand:hover { transform:translateY(-1px) scale(1.02); }
        .logo-icon { box-shadow:0 12px 24px rgba(255,90,60,.24); }
        .nav-search { width:min(440px,38vw); background:#f4f6f9; transition:.25s; }
        .nav-search:focus-within { background:white; border-color:#ffb29f; box-shadow:0 0 0 4px rgba(255,90,60,.08); }
        .hero { min-height:520px; display:grid; place-items:center; padding:70px 24px 115px; background:linear-gradient(125deg,#071d30 0%,#0d344c 50%,#155b68 100%); }
        .hero::before { animation:floatBlob 10s ease-in-out infinite alternate; }
        .hero::after { animation:floatBlob 12s ease-in-out infinite alternate-reverse; }
        @keyframes floatBlob { to { transform:translate(-35px,28px) scale(1.08); } }
        .hero-content { position:relative; z-index:2; max-width:860px; animation:heroEnter .7s cubic-bezier(.2,.8,.2,1) both; }
        @keyframes heroEnter { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:none} }
        .hero-badge { box-shadow:0 10px 30px rgba(0,0,0,.15); backdrop-filter:blur(10px); }
        .hero h1 { letter-spacing:-1.8px; text-wrap:balance; }
        .hero p { max-width:680px; margin-inline:auto; }
        .hero-search { box-shadow:0 18px 45px rgba(0,0,0,.2); transform:translateY(4px); }
        .hero-search:focus-within { transform:translateY(0); }
        .flash-sale-section { margin-top:-56px; }
        .flash-sale-banner { box-shadow:0 18px 45px rgba(7,29,48,.16); border:1px solid rgba(255,255,255,.35); }
        .promo-banner, .category-card, .product-card { will-change:transform; }
        .promo-banner { transition:transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s; }
        .promo-banner:hover { transform:translateY(-6px); box-shadow:var(--shadow-lg); }
        .categories-grid { gap:12px; }
        .category-card { position:relative; overflow:hidden; border:1px solid rgba(226,232,240,.9); transition:transform .25s, box-shadow .25s, border-color .25s; }
        .category-card::after { content:''; position:absolute; inset:auto -30% -55% auto; width:80px; height:80px; border-radius:50%; background:rgba(255,90,60,.07); transition:.35s; }
        .category-card:hover { transform:translateY(-5px); border-color:#ffd0c5; box-shadow:0 15px 30px rgba(15,42,67,.09); }
        .category-card:hover::after { transform:scale(1.8); }
        .filters-bar { position:sticky; top:78px; z-index:50; border-radius:18px; margin:10px auto 0; max-width:1152px; box-shadow:0 10px 30px rgba(15,42,67,.08); }
        .product-card { border:1px solid rgba(226,232,240,.85); overflow:hidden; box-shadow:0 5px 18px rgba(15,42,67,.055); transition:transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s, border-color .28s; }
        .product-card:hover { transform:translateY(-7px); box-shadow:0 22px 42px rgba(15,42,67,.14); border-color:#ffd0c5; }
        .product-image { transition:transform .35s ease; } .product-card:hover .product-image { transform:scale(1.035); }
        .btn { transition:transform .2s, box-shadow .2s, background .2s; } .btn:active { transform:scale(.97); }
        .btn-primary:hover { box-shadow:0 10px 24px rgba(255,90,60,.28); }
        /* Modals must be hidden until JavaScript explicitly opens them. */
        .modal-overlay {
            display:none;
            position:fixed;
            inset:0;
            z-index:5000;
            align-items:center;
            justify-content:center;
            padding:18px;
            overflow-y:auto;
            backdrop-filter:blur(7px);
            background:rgba(5,20,33,.52);
        }
        .modal-overlay.active { display:flex; }
        .modal-overlay .modal { width:min(100%, 760px); margin:auto; }
        .modal-overlay { backdrop-filter:blur(7px); background:rgba(5,20,33,.52); }
        .modal { border:1px solid rgba(255,255,255,.7); box-shadow:0 28px 80px rgba(0,0,0,.25); animation:modalPop .24s ease both; }
        @keyframes modalPop { from{opacity:0;transform:translateY(14px) scale(.985)} to{opacity:1;transform:none} }
        .toast { box-shadow:0 18px 40px rgba(15,42,67,.2); }
        @media (max-width: 700px) {
            .top-bar .left span:nth-child(2), .top-bar .right { display:none; }
            .navbar { height:68px; } .nav-search { display:none; }
            .nav-brand .brand-text { font-size:21px; }
            .hero { min-height:470px; padding:58px 16px 88px; }
            .hero h1 { font-size:38px; letter-spacing:-1px; }
            .featured-section { margin-top:-34px; padding:0 16px; }
            .featured-shell { padding:20px 14px; border-radius:20px; }
            .featured-products-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
            .featured-product-image { height:135px; }
            .filters-bar { position:static; margin:12px 16px; }
        }
        .featured-section, .categories-section, .products-section { opacity:0; transform:translateY(18px); transition:opacity .55s ease, transform .55s ease; }
        .featured-section.in-view, .categories-section.in-view, .products-section.in-view { opacity:1; transform:none; }


        /* ==================== MARKETPLACE DETAIL + SELLER REDESIGN ==================== */
        .modal-overlay.product-detail-overlay { align-items:flex-end; padding:0; background:rgba(5,20,33,.56); }
        .modal-overlay.product-detail-overlay .modal.product-detail-modal { width:min(100%, 760px); max-height:94vh; margin:0; padding:0; border-radius:28px 28px 0 0; overflow:auto; background:#fff; }
        .product-gallery-hero { position:relative; height:clamp(280px,52vh,520px); background:linear-gradient(145deg,#edf2f6,#dfe8ee); overflow:hidden; display:flex; align-items:center; justify-content:center; }
        .product-gallery-hero img { width:100%; height:100%; object-fit:cover; }
        .product-detail-close { position:absolute; top:14px; right:14px; z-index:4; width:42px; height:42px; border:0; border-radius:50%; background:rgba(255,255,255,.94); color:var(--secondary); box-shadow:0 8px 24px rgba(0,0,0,.16); font-size:18px; cursor:pointer; }
        .gallery-counter { position:absolute; right:16px; bottom:16px; z-index:3; background:rgba(11,43,64,.82); color:#fff; padding:6px 10px; border-radius:999px; font-size:12px; font-weight:800; }
        .product-detail-content { padding:22px 20px 18px; }
        .detail-kicker { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:12px; }
        .detail-category { color:var(--primary); font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:1.2px; }
        .detail-status { background:#e7f8ef; color:#138a4b; border-radius:999px; padding:5px 9px; font-size:10px; font-weight:800; }
        .modal-product-title { font-size:clamp(26px,6vw,34px); line-height:1.12; color:var(--secondary); margin:0 0 9px; letter-spacing:-.4px; }
        .modal-product-price { font-size:29px; font-weight:900; color:var(--primary); margin-bottom:20px; }
        .detail-chips { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin:0 0 18px; }
        .detail-info-item { min-width:0; padding:12px 11px; border:1px solid #e8edf2; background:#fbfcfd; border-radius:15px; display:flex; flex-direction:column; gap:5px; }
        .detail-info-label { font-size:10px; text-transform:uppercase; letter-spacing:.8px; color:#7a8793; font-weight:800; }
        .detail-info-value { font-size:12px; line-height:1.3; color:#263b4c; overflow-wrap:anywhere; }
        .modal-product-desc { background:#f8fafc; border:1px solid #edf1f5; border-radius:16px; padding:16px; line-height:1.65; margin-bottom:15px; color:#455767; }
        .modal-product-desc:before { content:'About this item'; display:block; margin-bottom:7px; color:var(--secondary); font-weight:850; font-size:12px; letter-spacing:.2px; }
        .seller-detail-card { display:flex; align-items:center; gap:12px; padding:13px; border:1px solid #e8edf2; border-radius:16px; margin-bottom:16px; background:#fff; box-shadow:0 8px 24px rgba(15,42,67,.05); }
        .seller-detail-avatar { width:42px; height:42px; border-radius:14px; display:grid; place-items:center; background:linear-gradient(135deg,var(--secondary),#315d75); color:#fff; font-weight:900; }
        .seller-detail-name { font-weight:800; color:var(--secondary); font-size:14px; }
        .seller-detail-note { color:var(--text-light); font-size:11px; }
        .modal-actions { position:sticky; bottom:0; background:rgba(255,255,255,.96); backdrop-filter:blur(12px); padding-top:12px; display:grid; grid-template-columns:1fr auto; gap:10px; }
        .modal-actions .btn { justify-content:center; }
        .modal-product-image { display:none; }
        .gallery-thumbs { padding:10px 20px 0; margin:0; background:#fff; }
        .gallery-thumb { width:56px; height:56px; border-radius:12px; }
        .gallery-nav { width:44px; height:44px; background:rgba(11,43,64,.72); backdrop-filter:blur(8px); }

        .account-page { max-width:1000px; margin:24px auto 42px; }
        .account-header { position:relative; overflow:hidden; text-align:left; padding:26px; border-radius:24px; background:linear-gradient(135deg,#0b2b40,#164a63); color:#fff; box-shadow:0 18px 45px rgba(11,43,64,.18); display:grid; grid-template-columns:auto 1fr; column-gap:16px; align-items:center; }
        .account-header::after { content:''; position:absolute; width:240px; height:240px; border-radius:50%; right:-85px; top:-130px; background:rgba(255,255,255,.07); }
        .account-avatar { margin:0; width:72px; height:72px; font-size:28px; box-shadow:none; }
        .account-name { color:#fff; font-size:25px; }
        .account-email { color:rgba(255,255,255,.72); }
        .account-credit { grid-column:2; color:#ffb49a; font-size:13px; }
        .account-card { border-radius:22px; box-shadow:0 14px 36px rgba(15,42,67,.07); }
        .account-card-header { background:linear-gradient(135deg,#fff,#f7fafc); padding:18px 20px; color:var(--secondary); font-size:14px; letter-spacing:.6px; display:flex; align-items:center; justify-content:space-between; }
        .seller-dashboard { padding:18px; }
        .seller-summary { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:18px; }
        .seller-stat { border:1px solid #e8edf2; border-radius:16px; padding:13px; background:#f9fbfd; }
        .seller-stat strong { display:block; font-size:20px; color:var(--secondary); line-height:1.1; }
        .seller-stat span { font-size:10px; color:var(--text-light); text-transform:uppercase; letter-spacing:.8px; }
        .seller-listings-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:14px; }
        .seller-listing { display:flex; flex-direction:column; gap:12px; padding:0; border:1px solid #e7edf2; border-radius:18px; overflow:hidden; background:#fff; box-shadow:0 7px 20px rgba(15,42,67,.055); transition:transform .22s,box-shadow .22s; }
        .seller-listing:hover { transform:translateY(-3px); box-shadow:0 16px 30px rgba(15,42,67,.1); }
        .seller-listing-media { height:155px; background:#edf2f6; position:relative; display:grid; place-items:center; overflow:hidden; font-size:44px; }
        .seller-listing-media img { width:100%; height:100%; object-fit:cover; }
        .seller-listing-status { position:absolute; top:10px; left:10px; border-radius:999px; padding:5px 9px; font-size:10px; font-weight:900; background:#e7f8ef; color:#138a4b; box-shadow:0 4px 12px rgba(0,0,0,.08); }
        .seller-listing-status.paused { background:#fff4d8; color:#9a6700; }
        .seller-listing-status.sold { background:#eef1f4; color:#52606d; }
        .seller-listing-info { padding:0 14px; }
        .seller-listing-title { color:var(--secondary); font-size:16px; font-weight:850; margin-bottom:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
        .seller-listing-price { color:var(--primary); font-size:18px; font-weight:900; }
        .seller-listing-meta { margin-top:6px; font-size:11px; color:var(--text-light); }
        .seller-listing-actions { padding:0 14px 14px; display:grid; grid-template-columns:1fr 1fr 1fr; gap:7px; }
        .seller-listing-actions .btn { min-height:36px; justify-content:center; padding:6px 8px; font-size:11px; }
        .seller-delete { border-color:#fecaca; color:#c53030; }
        .seller-delete:hover { background:#fff1f2; color:#b91c1c; }
        .seller-empty { padding:34px 16px; text-align:center; border:1px dashed #d9e1e8; border-radius:18px; color:var(--text-light); background:#fafcff; }
        .seller-empty strong { display:block; color:var(--secondary); margin-bottom:4px; }

        .categories-section .section-header > div { max-width:680px; }
        .categories-subtitle { color:var(--text-light); font-size:13px; margin-top:3px; }
        .categories-grid { grid-template-columns:repeat(auto-fill,minmax(145px,1fr)); gap:12px; }
        .category-card { min-height:112px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
        .category-icon { font-size:31px; }
        .category-name { font-size:12px; font-weight:750; }
        @media (max-width:700px) {
            .modal-overlay.product-detail-overlay .modal.product-detail-modal { max-height:96vh; border-radius:24px 24px 0 0; }
            .product-gallery-hero { height:42vh; min-height:260px; }
            .product-detail-content { padding:16px; }
            .gallery-thumbs { padding:9px 16px 0; }
            .seller-summary { grid-template-columns:1fr 1fr; }
            .seller-listings-grid { grid-template-columns:1fr; }
            .account-header { padding:22px 18px; }
            .account-name { font-size:21px; }
            .categories-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
            .category-card { min-height:92px; padding:9px 5px; }
            .category-icon { font-size:25px; }
        }
    
        /* ===== VERIFIED SELLER TRUST THEME ===== */
        .verified-seller-card{position:relative;overflow:hidden;border:1px solid #78d6c9!important;background:linear-gradient(145deg,#f4fffd,#ffffff 55%,#effcf9)!important;box-shadow:0 10px 26px rgba(13,148,136,.12)!important}
        .verified-seller-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#0f766e,#2dd4bf)}
        .verified-trust-strip{display:flex;align-items:center;gap:10px;margin-top:12px;padding:10px 12px;border-radius:14px;background:#e9faf7;border:1px solid #b9ebe3;color:#115e59}
        .verified-trust-icon{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#0f766e,#14b8a6);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:16px;box-shadow:0 5px 12px rgba(15,118,110,.18)}
        .verified-trust-copy strong{display:block;font-size:12px;font-weight:900;letter-spacing:.3px}.verified-trust-copy small{display:block;font-size:10.5px;color:#4b716c;margin-top:2px}
        .verified-badge{display:inline-flex;align-items:center;gap:4px;background:#e5f8f5;color:#0f766e;border:1px solid #a7e5dc;border-radius:999px;padding:3px 8px;font-size:9.5px;font-weight:900;letter-spacing:.55px;text-transform:uppercase}
        .verified-badge::before{content:'✓';width:13px;height:13px;border-radius:50%;background:#0f766e;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:8px}
        .product-card.verified-seller-product:not(.featured-seller-product){border-color:#a7e5dc!important;box-shadow:0 8px 22px rgba(13,148,136,.09)!important}
        .product-card.verified-seller-product:not(.featured-seller-product)::after{content:'✓ VERIFIED SELLER';position:absolute;top:10px;left:10px;z-index:8;background:#e5f8f5;color:#0f766e;border:1px solid #9cddd4;border-radius:999px;padding:4px 8px;font-size:8px;font-weight:900;letter-spacing:.7px;box-shadow:0 3px 9px rgba(13,148,136,.12)}
        .seller-page-hero.verified-seller-hero{background:linear-gradient(135deg,#effcf9,#dff8f3 58%,#ffffff);border:1px solid #8bdcd0;box-shadow:0 14px 34px rgba(13,148,136,.13)}.seller-page-hero.verified-seller-hero{color:#0f3d3e}.seller-page-hero.verified-seller-hero .seller-page-eyebrow{opacity:.78;color:#276c67}.seller-page-hero.verified-seller-hero .seller-page-username{color:#356d68;opacity:1}.seller-page-hero.verified-seller-hero .seller-page-badges span{background:#dff8f3;color:#0f766e;border-color:#a7e5dc}
        .seller-page-hero.verified-seller-hero .seller-page-avatar{background:linear-gradient(135deg,#0f766e,#14b8a6);box-shadow:0 0 0 5px #d8f7f1,0 10px 22px rgba(13,148,136,.2)}
        .verified-seller-profile-label{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#dff8f3;color:#0f766e;border:1px solid #9edfd6;font-size:10px;font-weight:900;letter-spacing:.9px;text-transform:uppercase;margin-top:7px}
        .verified-seller-profile-label::before{content:'✓';width:15px;height:15px;border-radius:50%;background:#0f766e;color:#fff;display:flex;align-items:center;justify-content:center;font-size:9px}
        .admin-verified-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px}
        .admin-verified-card{display:flex;align-items:center;gap:11px;padding:12px;border:1px solid #bde8e1;border-radius:14px;background:linear-gradient(145deg,#f7fffd,#fff)}
        .admin-verified-avatar{width:42px;height:42px;flex:0 0 42px;border-radius:12px;background:linear-gradient(135deg,#0f766e,#2dd4bf);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:17px}
        .admin-verified-main{min-width:0;flex:1}.admin-verified-main strong{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.admin-verified-main small{display:block;color:var(--text-light);font-size:10px;margin-top:2px}.admin-verified-actions{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
        @media(max-width:700px){.admin-verified-grid{grid-template-columns:1fr}}

        /* ===== FEATURED SELLER GOLD THEME ===== */
        #sellerDashboardCard.featured-seller-gold {
            background: linear-gradient(135deg, #fff9df 0%, #fff0a8 48%, #ffe7a0 100%);
            border: 1px solid #d8ad37;
            box-shadow: 0 16px 42px rgba(150, 105, 0, .20);
        }
        #sellerDashboardCard.featured-seller-gold .account-card-header {
            background: linear-gradient(135deg, #8a6200, #c99718);
            color: #fffdf4;
            border-bottom-color: rgba(255,255,255,.22);
        }
        #sellerDashboardCard.featured-seller-gold .seller-dashboard {
            background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.08));
        }
        #sellerDashboardCard.featured-seller-gold .seller-stat {
            background: rgba(255, 253, 240, .70);
            border-color: #e1bd55;
            box-shadow: 0 6px 18px rgba(137, 98, 0, .07);
        }
        #sellerDashboardCard.featured-seller-gold .seller-listing.featured-seller-listing {
            background: linear-gradient(135deg, #fffdf2 0%, #fff5c8 100%);
            border: 1px solid #d9b348;
            box-shadow: 0 10px 28px rgba(137, 98, 0, .14);
        }
        #sellerDashboardCard.featured-seller-gold .seller-listing.featured-seller-listing:hover {
            box-shadow: 0 18px 36px rgba(137, 98, 0, .22);
        }
        #sellerDashboardCard.featured-seller-gold .seller-listing-info,
        #sellerDashboardCard.featured-seller-gold .seller-listing-actions {
            background: transparent;
        }
        #sellerDashboardCard.featured-seller-gold .seller-listing-title {
            color: #6e5000;
        }
        #sellerDashboardCard.featured-seller-gold .seller-listing-price {
            color: #a66b00;
        }
        #sellerDashboardCard.featured-seller-gold .seller-listing-meta {
            color: #75633a;
        }
        #sellerDashboardCard.featured-seller-gold .seller-listing-media::after {
            content: '👑 FEATURED SELLER';
            position: absolute;
            top: 10px;
            right: 10px;
            z-index: 3;
            background: linear-gradient(135deg, #8a6200, #d5a421);
            color: #fffdf4;
            padding: 5px 9px;
            border-radius: 999px;
            font-size: 9px;
            font-weight: 900;
            letter-spacing: .7px;
            box-shadow: 0 4px 12px rgba(90, 63, 0, .22);
        }
        #sellerDashboardCard.featured-seller-gold .seller-listing-status {
            z-index: 4;
        }

    
        /* ==================== TERMS GATE ==================== */
        body.terms-locked { overflow:hidden; }
        .terms-overlay { position:fixed; inset:0; z-index:99999; background:rgba(7,15,25,.72); backdrop-filter:blur(8px); display:flex; align-items:center; justify-content:center; padding:18px; }
        .terms-overlay.hidden { display:none; }
        .terms-card { width:min(760px,100%); max-height:min(88vh,760px); overflow:auto; background:#fff; border-radius:24px; box-shadow:0 24px 80px rgba(0,0,0,.28); padding:28px; }
        .terms-brand { display:flex; align-items:center; gap:12px; margin-bottom:18px; }
        .terms-brand img { width:52px; height:52px; border-radius:14px; object-fit:cover; box-shadow:0 8px 20px rgba(0,0,0,.12); }
        .terms-brand h2 { margin:0; color:var(--secondary); }
        .terms-card h3 { margin:18px 0 7px; color:var(--secondary); font-size:15px; }
        .terms-card p,.terms-card li { color:var(--text); font-size:13px; line-height:1.65; }
        .terms-card ul { padding-left:20px; }
        .terms-scroll-note { padding:10px 12px; border-radius:10px; background:#f5f7fa; color:var(--text-light); font-size:12px; margin:14px 0; }
        .terms-check { display:flex; gap:10px; align-items:flex-start; margin:18px 0; padding:13px; border:1px solid var(--border); border-radius:12px; background:#fafbfc; }
        .terms-check input { margin-top:3px; width:18px; height:18px; accent-color:var(--primary); flex:0 0 auto; }
        .terms-actions { display:flex; justify-content:flex-end; gap:10px; position:sticky; bottom:0; background:#fff; padding-top:12px; }
        .terms-actions button { min-width:150px; }
        @media(max-width:600px){ .terms-card{padding:20px;border-radius:20px;max-height:92vh}.terms-actions{flex-direction:column}.terms-actions button{width:100%} }

        /* ==================== ADMIN DASHBOARD ==================== */
        .admin-page{max-width:1180px;margin:0 auto;padding:28px 20px 80px}
        .admin-hero{background:linear-gradient(135deg,#0B2B40,#164A63);color:#fff;border-radius:24px;padding:26px;margin-bottom:20px;box-shadow:var(--shadow-lg)}
        .admin-hero h1{font-size:28px;margin-bottom:5px}.admin-hero p{color:rgba(255,255,255,.78);font-size:13px}
        .admin-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:18px 0}
        .admin-stat{background:#fff;border:1px solid var(--border);border-radius:16px;padding:18px;box-shadow:var(--shadow-sm)}
        .admin-stat strong{display:block;font-size:25px;color:var(--secondary)}.admin-stat span{font-size:12px;color:var(--text-light)}
        /* V76 — compact expandable admin cards */
        .admin-card.admin-collapsible{overflow:hidden;}
        .admin-card.admin-collapsible>.admin-card-header{cursor:pointer;user-select:none;position:relative;padding-right:42px;margin-bottom:0;}
        .admin-card.admin-collapsible>.admin-card-header::after{content:'⌄';position:absolute;right:10px;top:50%;transform:translateY(-50%);width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#f1f5f3;color:#31564b;font-size:18px;font-weight:900;transition:transform .2s,background .2s;}
        .admin-card.admin-collapsible.is-collapsed>.admin-card-header::after{transform:translateY(-50%) rotate(-90deg);}
        .admin-card.admin-collapsible.is-collapsed>.admin-card-header{margin-bottom:0;}
        .admin-card.admin-collapsible.is-collapsed>.admin-collapsible-body{display:none!important;}
        .admin-card.admin-collapsible:not(.is-collapsed)>.admin-card-header::after{background:#e6f5ef;}
        .admin-card.admin-collapsible>.admin-card-header .btn,.admin-card.admin-collapsible>.admin-card-header input,.admin-card.admin-collapsible>.admin-card-header select{cursor:pointer;}
        @media(max-width:620px){.admin-card.admin-collapsible>.admin-card-header{padding-right:38px;}}
        .admin-card{background:#fff;border:1px solid var(--border);border-radius:18px;padding:18px;margin-top:16px;box-shadow:var(--shadow-sm)}
        .admin-card-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.admin-card-header h2{font-size:18px;color:var(--secondary)}
        .admin-table-wrap{overflow:auto}.admin-table{width:100%;border-collapse:collapse;font-size:13px}.admin-table th,.admin-table td{padding:11px 9px;border-bottom:1px solid #edf1f5;text-align:left;vertical-align:top}.admin-table th{color:var(--text-light);font-size:11px;text-transform:uppercase;letter-spacing:.4px}
        .admin-actions{display:flex;gap:6px;flex-wrap:wrap}.admin-empty{padding:24px;text-align:center;color:var(--text-light);background:#f8fafc;border-radius:12px}
        .admin-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.admin-form-grid .full{grid-column:1/-1}
        .admin-form-grid label{display:block;font-size:12px;font-weight:700;color:var(--secondary);margin-bottom:5px}.admin-form-grid input,.admin-form-grid select{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:#fff;font:inherit;outline:none}.admin-form-grid input:focus,.admin-form-grid select:focus{border-color:var(--primary)}
        .admin-search{width:100%;padding:11px 13px;border:1px solid var(--border);border-radius:11px;background:#fff;font:inherit;outline:none;margin-bottom:12px}.admin-search:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(21,122,88,.08)}
        .admin-pill{display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;font-size:10px;font-weight:800;background:#eef2f7;color:#526170}.admin-pill.ok{background:#e4f7ef;color:#087443}.admin-pill.warn{background:#fff3d6;color:#8a6200}.admin-pill.bad{background:#fee8e8;color:#a61b1b}
        @media(max-width:800px){.admin-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-form-grid{grid-template-columns:1fr}}
        @media(max-width:520px){.admin-grid{grid-template-columns:1fr 1fr}.admin-page{padding-left:12px;padding-right:12px}.admin-hero{padding:20px}.admin-card{padding:14px}}


        /* ==================== UI/UX OVERHAUL v3 ==================== */
        :root {
            --primary:#ff5a3c; --primary-dark:#e94a2f; --primary-light:#fff1ed;
            --secondary:#092b40; --bg:#f6f8fb; --text:#172433; --text-light:#64748b;
            --border:#e6ebf1; --radius:18px; --radius-sm:12px;
            --shadow-sm:0 2px 10px rgba(9,43,64,.055); --shadow:0 10px 30px rgba(9,43,64,.09); --shadow-lg:0 24px 60px rgba(9,43,64,.14);
        }
        html { scroll-behavior:smooth; }
        body { background:linear-gradient(180deg,#f8fafc 0%,#f4f7fa 100%); }
        body::selection { background:rgba(255,90,60,.2); }
        .top-bar { min-height:34px; padding:7px max(18px,calc((100vw - 1240px)/2)); background:#06263a; border-bottom:1px solid rgba(255,255,255,.06); }
        .top-bar .left span { margin-right:16px; }
        .navbar { height:76px; padding:0 max(18px,calc((100vw - 1240px)/2)); border-bottom:1px solid rgba(226,232,240,.9); box-shadow:0 4px 20px rgba(9,43,64,.06); }
        .nav-brand .logo-icon { width:44px;height:44px;border-radius:14px;background:#fff;box-shadow:0 4px 14px rgba(9,43,64,.12);overflow:hidden; }
        .nav-brand .brand-text { font-size:23px; letter-spacing:-.7px; }
        .nav-search { width:min(430px,38vw); height:46px; background:#f5f7fa; border-color:#e4e9ef; box-shadow:inset 0 1px 2px rgba(9,43,64,.02); }
        .nav-search input::placeholder,.hero-search input::placeholder { color:#8a97a6; }
        .nav-actions { gap:5px; }
        .nav-actions .btn { min-height:40px; }
        .btn { min-height:40px; border-radius:12px; padding:9px 15px; font-weight:750; letter-spacing:-.1px; }
        .btn-primary { box-shadow:0 8px 18px rgba(255,90,60,.20); }
        .btn-primary:hover { box-shadow:0 12px 24px rgba(255,90,60,.24); }
        .btn-outline { border-color:#cbd5df; }
        .hero { min-height:500px; padding:76px 20px 125px; background:radial-gradient(circle at 78% 20%,rgba(0,168,150,.18),transparent 28%),radial-gradient(circle at 18% 85%,rgba(255,90,60,.12),transparent 25%),linear-gradient(135deg,#06263a 0%,#0b344c 52%,#0d5960 100%); overflow:hidden; }
        .hero-content { max-width:900px; }
        .hero-badge { display:inline-flex; align-items:center; gap:7px; padding:8px 13px; border:1px solid rgba(255,255,255,.15); background:rgba(255,255,255,.09); font-size:11px; letter-spacing:.35px; }
        .hero h1 { max-width:820px; margin:18px auto 15px; font-size:clamp(38px,6vw,64px); line-height:1.02; letter-spacing:-3px; }
        .hero h1 span { color:#ffad91; }
        .hero p { max-width:650px; font-size:16px; line-height:1.65; color:rgba(255,255,255,.78); }
        .hero-search { max-width:720px; margin:25px auto 0; min-height:64px; padding:7px; border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.97); border-radius:18px; box-shadow:0 25px 60px rgba(0,0,0,.22); }
        .hero-search input { padding:14px 16px; font-size:15px; }
        .hero-search .btn { min-height:50px; padding-inline:25px; border-radius:14px; }
        .featured-section { margin:-42px auto 30px; }
        .featured-shell { padding:24px; border-radius:26px; background:rgba(255,255,255,.96); border:1px solid #edf0f4; box-shadow:0 22px 55px rgba(9,43,64,.10); }
        .eyebrow { font-size:10px; letter-spacing:1.8px; }
        .section-title { font-size:27px; letter-spacing:-.8px; }
        .section-title::before { top:7px; bottom:7px; width:3px; }
        .featured-product-card,.product-card { border-radius:18px; }
        .featured-product-card { border-color:#e6d0bf; }
        .featured-product-image { height:168px; }
        .featured-product-body { padding:14px; }
        .featured-product-title { font-size:14px; }
        .featured-product-price { font-size:18px; }
        .categories-section,.products-section { max-width:1240px; }
        .categories-section { padding-top:20px; }
        .categories-grid { gap:13px; }
        .category-card { min-height:120px; border-radius:16px; padding:16px 10px; box-shadow:var(--shadow-sm); }
        .category-card:hover,.category-card.active { transform:translateY(-3px); border-color:#ffc4b5; box-shadow:0 14px 28px rgba(9,43,64,.09); }
        .category-icon { width:48px;height:48px;display:grid;place-items:center;margin-bottom:8px;border-radius:14px;background:#f8fafc;font-size:25px; }
        .category-name { font-size:12px; font-weight:750; }
        .filters-bar { max-width:1192px; margin:20px auto 6px; padding:12px 14px; background:rgba(255,255,255,.92); border:1px solid #e8edf2; border-radius:18px; box-shadow:0 10px 28px rgba(9,43,64,.06); top:84px; }
        .filter-group { padding:4px 8px; border-right:1px solid #edf1f5; }
        .filter-group:last-child { border-right:0; }
        .filter-group label { font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.45px; }
        .filter-group select,.filter-group input { height:38px; border-radius:10px; background:#f8fafc; border-color:#e6ebf0; }
        .products-section { padding-top:24px; }
        .products-section .section-header { align-items:end; }
        .products-grid { grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:18px; }
        .product-card { box-shadow:0 6px 20px rgba(9,43,64,.055); border-color:#e7ebef; }
        .product-card:hover { transform:translateY(-6px); box-shadow:0 20px 40px rgba(9,43,64,.12); }
        .product-image { height:210px; background:#f4f7f9; }
        .product-body { padding:15px; }
        .product-category { font-size:9px; letter-spacing:1.3px; }
        .product-title { font-size:15px; min-height:42px; }
        .product-seller { margin-bottom:13px; }
        .product-price { font-size:19px; }
        .btn-contact { padding:8px 12px; border-radius:10px; font-weight:750; }
        .account-page,.chat-page,.admin-page { max-width:1180px; }
        .account-header { border-radius:26px; padding:30px; }
        .account-card { border-radius:20px; }
        .account-card-header { padding:17px 20px; }
        .chat-shell { border-radius:24px; box-shadow:var(--shadow); }
        .chat-sidebar { background:#f9fbfc; }
        .chat-list-item { padding:16px 18px; }
        .admin-hero { border-radius:26px; padding:30px; background:radial-gradient(circle at 90% 15%,rgba(0,168,150,.25),transparent 25%),linear-gradient(135deg,#06263a,#164b61); }
        .admin-stat { border-radius:18px; padding:20px; transition:.2s ease; }
        .admin-stat:hover { transform:translateY(-2px); box-shadow:var(--shadow); }
        .admin-card { border-radius:20px; padding:20px; }
        .admin-search { height:46px; border-radius:13px; background:#f8fafc; }
        .modal-overlay { backdrop-filter:blur(10px); }
        .modal { border-radius:24px; }
        .product-detail-modal { border-radius:28px 28px 0 0 !important; }
        .seller-detail-card { border-radius:16px; }
        .toast { border-radius:13px !important; box-shadow:0 15px 35px rgba(0,0,0,.16) !important; }
        @media (max-width:760px) {
            body { padding-bottom:76px; }
            .top-bar { display:none; }
            .navbar { height:66px; padding:0 12px; }
            .nav-brand { gap:8px; }
            .nav-brand .logo-icon { width:38px;height:38px;border-radius:12px; }
            .nav-brand .brand-text { font-size:20px; }
            .nav-actions .btn { display:none; }
            .nav-actions #sellBtn { display:inline-flex; width:40px; padding:0; justify-content:center; font-size:0; }
            .nav-actions #sellBtn::after { content:'+'; font-size:22px; line-height:1; }
            .hero { min-height:430px; padding:55px 15px 92px; }
            .hero h1 { font-size:40px; letter-spacing:-1.8px; }
            .hero p { font-size:14px; }
            .hero-search { min-height:0; padding:7px; border-radius:16px; }
            .hero-search input { min-height:48px; }
            .hero-search .btn { width:100%; }
            .featured-section { margin:-28px 10px 24px; padding:0; }
            .featured-shell { padding:18px; border-radius:22px; }
            .featured-products-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
            .featured-product-image { height:125px; }
            .featured-product-body { padding:10px; }
            .featured-product-price { font-size:16px; }
            .categories-section,.products-section { padding-left:14px; padding-right:14px; }
            .section-title { font-size:23px; }
            .filters-bar { margin:10px 14px 0; padding:10px; top:66px; gap:7px; }
            .filter-group { border:0; flex:1 1 45%; padding:2px; display:block; }
            .filter-group label { display:block; margin-bottom:4px; }
            .filter-group select,.filter-group input { width:100%; }
            .products-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
            .product-image { height:165px; }
            .product-body { padding:11px; }
            .product-title { font-size:13px; min-height:36px; }
            .product-price { font-size:16px; }
            .btn-contact { padding:7px 9px; font-size:10px; }
            .product-price-row { gap:5px; }
            .bottom-nav { padding:7px 4px calc(7px + env(safe-area-inset-bottom)); background:rgba(255,255,255,.96); backdrop-filter:blur(16px); box-shadow:0 -8px 25px rgba(9,43,64,.08); }
            .bottom-nav-item { min-width:58px; min-height:48px; border-radius:12px; }
            .bottom-nav-item.active { background:#fff0eb; }
            .bottom-nav-item .nav-icon { font-size:19px; }
            .account-header { border-radius:22px; padding:22px; }
            .admin-grid { gap:8px; }
            .admin-stat { padding:14px; }
            .admin-card { padding:14px; }
        }
        @media (max-width:390px) {
            .hero h1 { font-size:35px; }
            .products-grid { gap:8px; }
            .product-image { height:150px; }
        }
        @media (prefers-reduced-motion:reduce) {
            *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:.01ms !important; }
        }

    
/* ================================================================
   INMALETE — HEAVY UI/UX REDESIGN v4
   Visual system: emerald + lime, clean commerce, mobile-first.
   ================================================================ */
:root{
  --primary:#16a34a;
  --primary-dark:#0f7a36;
  --primary-light:#eaf8ef;
  --secondary:#0b1f17;
  --secondary-light:#173c2b;
  --accent:#b7f34a;
  --accent-light:#f3fbdc;
  --bg:#f7faf8;
  --white:#fff;
  --text:#12231a;
  --text-light:#6b7d73;
  --border:#e3ebe6;
  --shadow-sm:0 2px 10px rgba(16,45,29,.06);
  --shadow:0 10px 30px rgba(16,45,29,.09);
  --shadow-lg:0 24px 60px rgba(16,45,29,.15);
  --radius:18px;
  --radius-sm:12px;
  --transition:all .22s cubic-bezier(.2,.75,.2,1);
}
body{background:linear-gradient(180deg,#f7faf8 0,#fff 35%,#f7faf8 100%);color:var(--text)}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(circle at 8% 12%,rgba(183,243,74,.08),transparent 22%),radial-gradient(circle at 92% 42%,rgba(22,163,74,.06),transparent 25%)}
.top-bar{background:#0b1f17;color:#cbd9d1;padding:7px 28px;font-size:11px;border-bottom:1px solid rgba(183,243,74,.14)}
.top-bar a{color:#b7f34a}.top-bar .left span{margin-right:18px}
.navbar{height:78px;padding:0 clamp(16px,4vw,52px);background:rgba(255,255,255,.94);backdrop-filter:blur(18px);box-shadow:0 1px 0 rgba(16,45,29,.07);border-bottom:1px solid rgba(227,235,230,.8)}
.nav-brand{gap:11px}.nav-brand .logo-icon{width:46px;height:46px;border-radius:14px;background:#0b1f17;box-shadow:0 8px 20px rgba(11,31,23,.18);overflow:hidden}.nav-brand .logo-icon img{object-fit:cover!important}.nav-brand .brand-text{font-size:23px;letter-spacing:-.7px;color:#0b1f17}.nav-brand .brand-text span{color:#16a34a}
.nav-search{width:min(390px,36vw);height:46px;background:#f3f7f4;border:1px solid #e0e9e3;border-radius:15px;padding-left:15px}.nav-search:focus-within{border-color:#74c98d;box-shadow:0 0 0 4px rgba(22,163,74,.08);background:#fff}.nav-search input{font-size:13px}
.nav-actions{gap:4px}.btn{border-radius:12px;padding:10px 16px;font-weight:750;transition:var(--transition)}.btn-primary{background:#16a34a;box-shadow:0 8px 20px rgba(22,163,74,.2)}.btn-primary:hover{background:#0f7a36;transform:translateY(-2px)}.btn-outline{border:1px solid #cbd9d0;color:#173c2b;background:#fff}.btn-outline:hover{background:#0b1f17;color:#fff;border-color:#0b1f17}.btn-ghost{color:#52665b;border-radius:10px}.btn-ghost:hover{background:#eef6f1;color:#0f7a36}
.hero{min-height:555px;padding:86px 22px 135px;background:radial-gradient(circle at 78% 24%,rgba(183,243,74,.22),transparent 20%),radial-gradient(circle at 12% 86%,rgba(22,163,74,.18),transparent 25%),linear-gradient(135deg,#071a12 0%,#0b2b1c 48%,#125b32 100%);position:relative;overflow:hidden}
.hero:before{width:600px;height:600px;top:-260px;right:-170px;background:radial-gradient(circle,rgba(183,243,74,.17),transparent 66%);filter:blur(2px)}.hero:after{width:520px;height:520px;bottom:-270px;left:-160px;background:radial-gradient(circle,rgba(76,213,116,.14),transparent 66%)}
.hero-content{max-width:920px}.hero-badge{display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border:1px solid rgba(183,243,74,.28);background:rgba(255,255,255,.07);color:#dff5c5;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.3px;box-shadow:none;backdrop-filter:blur(12px)}
.hero h1{font-size:clamp(42px,6vw,72px);line-height:.98;letter-spacing:-3px;margin:22px auto 20px;max-width:850px}.hero h1 span{color:#b7f34a}.hero p{font-size:16px;line-height:1.7;color:#c4d5cc;max-width:640px;margin:0 auto 30px}
.hero-search{max-width:760px;height:68px;margin:auto;border-radius:18px;padding:7px;background:#fff;box-shadow:0 25px 55px rgba(0,0,0,.24);border:1px solid rgba(255,255,255,.4);transform:none}.hero-search input{padding:0 17px;font-size:15px}.hero-search .btn{height:54px;padding:0 27px;border-radius:14px}.hero-trust{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:18px}.hero-trust span{padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);color:#d9e8df;font-size:11px;font-weight:700}
.featured-section,.categories-section,.products-section{max-width:1240px;margin:0 auto;padding-left:clamp(16px,4vw,32px);padding-right:clamp(16px,4vw,32px)}.featured-section{margin-top:-65px;position:relative;z-index:3}.featured-shell{background:rgba(255,255,255,.96);border:1px solid #e1ebe4;border-radius:24px;padding:26px;box-shadow:var(--shadow-lg)}.section-header{margin-bottom:20px}.section-title{font-size:26px;letter-spacing:-1px;color:#0b1f17}.eyebrow{color:#16a34a;font-size:10px;font-weight:900;letter-spacing:1.5px;margin-bottom:5px}.featured-subtitle,.categories-subtitle{color:#728278;font-size:13px;margin-top:3px}
.featured-products-grid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px}.featured-product-card{border:1px solid #dfe9e2!important;border-radius:17px!important;box-shadow:none!important;background:#fff!important;transition:var(--transition)}.featured-product-card:hover{transform:translateY(-5px);box-shadow:0 18px 34px rgba(16,45,29,.12)!important}.featured-product-image{height:170px;background:#f0f5f1}.featured-tag{background:#0b1f17;box-shadow:none}.featured-product-category{color:#16a34a}.featured-product-price{color:#0b1f17}
.categories-section{padding-top:48px;padding-bottom:24px}.categories-grid{grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:12px}.category-card{min-height:125px;border-radius:17px;background:#fff;border:1px solid #e0e9e3;box-shadow:var(--shadow-sm);padding:18px 12px}.category-card:hover,.category-card.active{border-color:#6bc58a;background:#f3fbf6;box-shadow:0 12px 26px rgba(22,163,74,.1);transform:translateY(-4px)}.category-card.active{outline:3px solid rgba(22,163,74,.08)}
.filters-bar{max-width:1176px;margin:10px auto 28px;background:#fff;border:1px solid #e0e9e3;border-radius:17px;padding:12px 15px;box-shadow:var(--shadow-sm);gap:10px}.filter-group{background:#f7faf8;border:1px solid #e5ece7;border-radius:11px;padding:7px 10px}.filter-group label{font-size:10px;font-weight:800;color:#718078}.filter-group input,.filter-group select{font-size:12px}
.products-section{padding-bottom:80px}.products-grid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:17px}.product-card{border:1px solid #e1e9e4;background:#fff;border-radius:18px;box-shadow:var(--shadow-sm);transition:var(--transition)}.product-card:hover{transform:translateY(-7px);border-color:#a9d9b8;box-shadow:0 22px 45px rgba(16,45,29,.13)}.product-image{background:#f1f5f2}.product-price{color:#0b1f17!important}.product-category{color:#16a34a!important}.product-seller{color:#738178}
.account-page,.chat-page{max-width:1120px}.account-header{background:linear-gradient(135deg,#0b1f17,#155b32);border-radius:24px;box-shadow:var(--shadow-lg);padding:28px}.account-credit{background:rgba(183,243,74,.12)!important;border-color:rgba(183,243,74,.2)!important;color:#dff5c5!important}.account-card{border:1px solid #e0e9e3;border-radius:18px;box-shadow:var(--shadow-sm)}
.chat-shell{border-radius:22px;border-color:#e0e9e3;box-shadow:var(--shadow)}.chat-sidebar{background:#f8fbf9;border-right-color:#e0e9e3}.chat-list-item:hover,.chat-list-item.active{background:#eef8f1}.chat-avatar{background:linear-gradient(135deg,#16a34a,#75c94d)}.chat-message-row.mine .chat-bubble{background:#16a34a}.chat-messages{background:linear-gradient(180deg,#f6faf7,#fff)}
.admin-hero{background:linear-gradient(135deg,#071a12,#155b32)!important;border-radius:22px!important;box-shadow:var(--shadow-lg)!important}.admin-card{border:1px solid #e0e9e3!important;border-radius:18px!important;box-shadow:var(--shadow-sm)!important}.admin-stat{border:1px solid #e0e9e3!important;background:#fff!important;border-radius:16px!important}.admin-search{border-radius:12px!important;border-color:#dbe6df!important}.admin-table{border-radius:14px;overflow:hidden}
.modal{border-radius:24px!important;border:1px solid #e0e9e3!important;box-shadow:0 30px 80px rgba(5,24,14,.25)!important}.product-detail-content{padding:28px}.product-detail-close{border-radius:12px!important}
.toast{background:#0b1f17!important;border:1px solid #315c45!important;border-radius:13px!important;box-shadow:0 18px 35px rgba(0,0,0,.2)!important}.toast.error{background:#8c2c24!important}
@media(max-width:760px){
 .top-bar{display:none}.navbar{height:64px;padding:0 12px}.nav-brand .logo-icon{width:38px;height:38px;border-radius:11px}.nav-brand .brand-text{font-size:20px}.nav-search{display:none}.nav-actions{margin-left:auto}.nav-actions .btn-ghost{font-size:0;padding:9px}.nav-actions .btn-ghost span{font-size:10px}.nav-actions #messagesBtn:before{content:'💬';font-size:18px}.nav-actions #accountBtn:before{content:'👤';font-size:18px}.nav-actions #adminBtn:before{content:'👑';font-size:18px}.nav-actions #sellBtn{font-size:12px;padding:8px 11px}.hero{min-height:525px;padding:70px 17px 125px}.hero h1{font-size:42px;letter-spacing:-2px}.hero p{font-size:14px}.hero-search{height:auto;display:flex;flex-direction:column;padding:7px;border-radius:16px;gap:7px}.hero-search input{height:48px;background:#f5f8f6;border-radius:11px}.hero-search .btn{height:48px;width:100%}.featured-section{margin-top:-55px}.featured-shell{padding:18px;border-radius:20px}.featured-products-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.featured-product-image{height:125px}.categories-section{padding-top:35px}.categories-grid{grid-template-columns:repeat(3,1fr);gap:9px}.category-card{min-height:105px;padding:12px 7px}.products-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.product-card{border-radius:15px}.product-image{height:170px!important}.filters-bar{margin:6px 12px 22px;padding:9px;overflow-x:auto;flex-wrap:nowrap}.filter-group{min-width:130px}.section-title{font-size:22px}.account-header{border-radius:19px;padding:21px}.modal{width:calc(100% - 18px)!important;border-radius:20px!important}
}
@media(max-width:390px){.nav-brand .brand-text{font-size:18px}.nav-actions #messagesBtn,.nav-actions #accountBtn{display:none}.hero h1{font-size:36px}.categories-grid{grid-template-columns:repeat(2,1fr)}.products-grid{gap:9px}.product-image{height:150px!important}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition:none!important}}


/* ==================== INMALETE MOTION SYSTEM v5 ==================== */
:root{
  --motion-fast:160ms cubic-bezier(.2,.8,.2,1);
  --motion:320ms cubic-bezier(.22,1,.36,1);
  --motion-slow:650ms cubic-bezier(.16,1,.3,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
}
html{scroll-behavior:smooth}
body{overflow-x:hidden}
body:not(.terms-locked){animation:pageFadeIn .55s ease both}
@keyframes pageFadeIn{from{opacity:0}to{opacity:1}}

/* Top chrome */
.top-bar{position:relative;overflow:hidden}
.top-bar:after{content:"";position:absolute;inset:0;transform:translateX(-110%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.13),transparent);animation:shine 5s ease-in-out infinite}
@keyframes shine{0%,70%,100%{transform:translateX(-110%)}85%{transform:translateX(110%)}}
.navbar{position:sticky;top:0;z-index:1200;box-shadow:0 1px 0 rgba(15,23,42,.05);transition:box-shadow var(--motion),background var(--motion),transform var(--motion)}
.navbar:hover{box-shadow:0 8px 28px rgba(15,23,42,.08)}
.nav-brand{transition:transform var(--motion)}
.nav-brand:hover{transform:translateY(-1px)}
.logo-icon{transition:transform var(--motion),box-shadow var(--motion)}
.nav-brand:hover .logo-icon{transform:rotate(-3deg) scale(1.04);box-shadow:0 10px 24px rgba(22,163,74,.18)}
.nav-search{transition:transform var(--motion),box-shadow var(--motion),border-color var(--motion)}
.nav-search:focus-within{transform:translateY(-1px);box-shadow:0 0 0 4px rgba(22,163,74,.10),0 12px 28px rgba(15,23,42,.08)}

/* Buttons: tactile motion */
.btn{position:relative;overflow:hidden;isolation:isolate;transition:transform var(--motion-fast),box-shadow var(--motion-fast),background var(--motion-fast),border-color var(--motion-fast),color var(--motion-fast)}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(1px) scale(.98)}
.btn:focus-visible{outline:3px solid rgba(22,163,74,.22);outline-offset:2px}
.btn::after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,.35);transform:scale(0);opacity:0;pointer-events:none;left:var(--ripple-x,50%);top:var(--ripple-y,50%);translate:-50% -50%;z-index:-1}
.btn.ripple::after{animation:ripple .55s ease-out}
@keyframes ripple{0%{transform:scale(0);opacity:.5}100%{transform:scale(18);opacity:0}}

/* Hero entrance + ambient movement */
.hero{position:relative;overflow:hidden}
.hero:before,.hero:after{content:"";position:absolute;border-radius:50%;pointer-events:none;filter:blur(2px)}
.hero:before{width:340px;height:340px;right:-110px;top:-100px;background:radial-gradient(circle,rgba(183,243,74,.22),transparent 68%);animation:orbFloat 8s ease-in-out infinite}
.hero:after{width:260px;height:260px;left:-100px;bottom:-140px;background:radial-gradient(circle,rgba(22,163,74,.16),transparent 70%);animation:orbFloat 10s ease-in-out -2s infinite reverse}
@keyframes orbFloat{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(0,18px,0) scale(1.08)}}
.hero-content>*{animation:heroItem .7s var(--motion-slow) both}
.hero-content .hero-badge{animation-delay:.05s}
.hero-content h1{animation-delay:.12s}
.hero-content p{animation-delay:.2s}
.hero-content .hero-search{animation-delay:.28s}
.hero-content .hero-trust{animation-delay:.36s}
@keyframes heroItem{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.hero-search{transition:transform var(--motion),box-shadow var(--motion)}
.hero-search:focus-within{transform:translateY(-2px);box-shadow:0 18px 45px rgba(15,23,42,.12),0 0 0 4px rgba(22,163,74,.08)}
.hero-trust span{transition:transform var(--motion-fast),background var(--motion-fast)}
.hero-trust span:hover{transform:translateY(-2px)}

/* Section reveal */
.featured-section,.categories-section,.products-section,.chat-page,.account-page,.admin-page{animation:sectionIn .7s var(--motion-slow) both}
@keyframes sectionIn{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
.section-title{letter-spacing:-.035em}
.eyebrow{animation:eyebrowIn .8s ease both}
@keyframes eyebrowIn{from{opacity:0;letter-spacing:.35em}to{opacity:1;letter-spacing:.12em}}

/* Featured shelf */
.featured-shell{position:relative}
.featured-shell:before{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;background:linear-gradient(110deg,transparent 15%,rgba(255,255,255,.5) 45%,transparent 75%);transform:translateX(-120%);animation:shelfShine 7s ease-in-out infinite}
@keyframes shelfShine{0%,65%,100%{transform:translateX(-120%)}82%{transform:translateX(120%)}}
.featured-product-card,.flash-product-card,.product-card{will-change:transform;transition:transform var(--motion),box-shadow var(--motion),border-color var(--motion)}
.featured-product-card:hover,.flash-product-card:hover,.product-card:hover{transform:translateY(-7px) scale(1.012);box-shadow:0 18px 42px rgba(15,23,42,.13)}
.product-image,.flash-product-image,.featured-product-image{overflow:hidden}
.product-image img,.flash-product-image img,.featured-product-image img{transition:transform 700ms cubic-bezier(.2,.8,.2,1),filter 500ms ease}
.product-card:hover .product-image img,.flash-product-card:hover .flash-product-image img,.featured-product-card:hover .featured-product-image img{transform:scale(1.055);filter:saturate(1.05)}
.product-image .badge,.featured-product-card .badge{transition:transform var(--motion),box-shadow var(--motion)}
.product-card:hover .product-image .badge,.featured-product-card:hover .badge{transform:translateY(-2px) scale(1.04);box-shadow:0 7px 15px rgba(0,0,0,.12)}
.product-title{transition:color var(--motion-fast),transform var(--motion-fast)}
.product-card:hover .product-title{color:var(--primary);transform:translateX(2px)}
.product-price{transition:transform var(--motion-fast)}
.product-card:hover .product-price{transform:scale(1.025)}

/* Category interaction */
.category-card{position:relative;overflow:hidden;transition:transform var(--motion),box-shadow var(--motion),border-color var(--motion),background var(--motion)}
.category-card:before{content:"";position:absolute;inset:auto -30% -65% -30%;height:100%;background:radial-gradient(circle,rgba(22,163,74,.13),transparent 65%);transform:scale(0);transition:transform .5s var(--ease-spring)}
.category-card:hover,.category-card.active{transform:translateY(-5px) scale(1.015)}
.category-card:hover:before,.category-card.active:before{transform:scale(1)}
.category-icon{display:inline-block;transition:transform .45s var(--ease-spring)}
.category-card:hover .category-icon{transform:translateY(-4px) rotate(-5deg) scale(1.12)}
.category-card.active .category-icon{animation:categoryPop .45s var(--ease-spring)}
@keyframes categoryPop{0%{transform:scale(.8)}65%{transform:scale(1.16) rotate(-4deg)}100%{transform:scale(1)}}

/* Filters */
.filters-bar{transition:box-shadow var(--motion),transform var(--motion),background var(--motion)}
.filters-bar:focus-within{transform:translateY(-2px);box-shadow:0 10px 28px rgba(15,23,42,.07)}
.filter-group input,.filter-group select{transition:border-color var(--motion-fast),box-shadow var(--motion-fast),transform var(--motion-fast)}
.filter-group input:focus,.filter-group select:focus{transform:translateY(-1px);border-color:var(--primary);box-shadow:0 0 0 3px rgba(22,163,74,.1)}

/* Cards reveal when JS marks them */
.motion-item{opacity:0;transform:translateY(18px) scale(.985)}
.motion-item.motion-visible{opacity:1;transform:none;transition:opacity .55s ease,transform .65s var(--motion-slow)}
.motion-item:nth-child(2){transition-delay:.045s}.motion-item:nth-child(3){transition-delay:.09s}.motion-item:nth-child(4){transition-delay:.135s}.motion-item:nth-child(5){transition-delay:.18s}.motion-item:nth-child(6){transition-delay:.225s}

/* Modal / overlay */
.modal-overlay{backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);transition:opacity var(--motion),visibility var(--motion)}
.modal-overlay .modal{transform:translateY(22px) scale(.96);opacity:0;transition:transform .42s var(--motion-slow),opacity .28s ease;will-change:transform}
.modal-overlay:not([style*="display: none"]) .modal{transform:none;opacity:1}
.modal-close{transition:transform var(--motion-fast),background var(--motion-fast)}
.modal-close:hover{transform:rotate(90deg) scale(1.08)}

/* Inputs */
input,select,textarea{transition:border-color var(--motion-fast),box-shadow var(--motion-fast),background var(--motion-fast)}
input:focus,select:focus,textarea:focus{box-shadow:0 0 0 4px rgba(22,163,74,.09)}

/* Chat motion */
.chat-list-item{transition:transform var(--motion-fast),background var(--motion-fast),padding-left var(--motion-fast)}
.chat-list-item:hover{transform:translateX(3px)}
.chat-avatar{transition:transform .45s var(--ease-spring)}
.chat-list-item:hover .chat-avatar{transform:scale(1.08) rotate(-4deg)}
.chat-message-row{animation:messageIn .35s var(--motion-slow) both}
@keyframes messageIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
.chat-bubble{transition:transform var(--motion-fast),box-shadow var(--motion-fast)}
.chat-bubble:hover{transform:translateY(-1px);box-shadow:0 5px 14px rgba(15,23,42,.08)}

/* Account */
.account-avatar{animation:avatarFloat 4s ease-in-out infinite;box-shadow:0 12px 30px rgba(22,163,74,.16)}
@keyframes avatarFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.account-card{transition:transform var(--motion),box-shadow var(--motion)}
.account-card:hover{transform:translateY(-3px);box-shadow:0 15px 34px rgba(15,23,42,.09)}
.account-menu-item{transition:background var(--motion-fast),padding-left var(--motion),transform var(--motion-fast)}
.account-menu-item:hover{transform:translateX(3px)}

/* Bottom nav */
.bottom-nav{box-shadow:0 -8px 28px rgba(15,23,42,.08);animation:bottomNavIn .6s var(--motion-slow) both}
@keyframes bottomNavIn{from{transform:translateY(100%)}to{transform:none}}
.bottom-nav-item{transition:transform var(--motion-fast),color var(--motion-fast)}
.bottom-nav-item:hover{transform:translateY(-2px)}
.bottom-nav-item.active .nav-icon{animation:navPop .38s var(--ease-spring)}
@keyframes navPop{0%{transform:scale(.85)}70%{transform:scale(1.18)}100%{transform:scale(1)}}

/* Toasts */
.toast{animation:toastIn .45s var(--motion-slow) both;box-shadow:0 16px 35px rgba(15,23,42,.18)}
@keyframes toastIn{from{opacity:0;transform:translate3d(35px,15px,0) scale(.96)}to{opacity:1;transform:none}}

/* Terms gate */
.terms-overlay{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.terms-card{animation:termsIn .65s var(--motion-slow) both}
@keyframes termsIn{from{opacity:0;transform:translateY(35px) scale(.96)}to{opacity:1;transform:none}}

/* Admin motion */
.admin-card,.admin-stat,.admin-section{transition:transform var(--motion),box-shadow var(--motion)}
.admin-card:hover,.admin-stat:hover,.admin-section:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(15,23,42,.09)}
.admin-table tbody tr{transition:background var(--motion-fast),transform var(--motion-fast)}
.admin-table tbody tr:hover{transform:translateX(2px)}

/* Footer */
.footer{position:relative;overflow:hidden}
.footer:before{content:"";position:absolute;width:420px;height:420px;right:-180px;top:-220px;border-radius:50%;background:radial-gradient(circle,rgba(183,243,74,.11),transparent 68%);animation:orbFloat 12s ease-in-out infinite}

@media(max-width:760px){
  .navbar{padding-top:6px;padding-bottom:6px}
  .nav-search{transition:transform var(--motion),box-shadow var(--motion)}
  .product-card:hover,.featured-product-card:hover,.flash-product-card:hover{transform:translateY(-4px) scale(1.006)}
  .hero:before{width:240px;height:240px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}


/* ==================== INMALETE VISUAL REDESIGN V6 ==================== */
:root{
 --primary:#16a34a;--primary-dark:#15803d;--primary-light:#ecfdf3;
 --secondary:#111827;--secondary-light:#374151;--accent:#f59e0b;
 --bg:#f4f5f7;--text:#1f2937;--text-light:#6b7280;--border:#e5e7eb;
 --shadow-sm:0 1px 2px rgba(0,0,0,.05);--shadow:0 8px 24px rgba(17,24,39,.08);--shadow-lg:0 18px 50px rgba(17,24,39,.13);
 --radius:10px;--radius-sm:7px;
}
html{scroll-behavior:smooth}body{background:#f4f5f7;color:#1f2937}
.top-bar{background:#111827;height:32px;padding:0 4vw;font-size:11px}.top-bar a{color:#d1fae5}
.navbar{height:70px;padding:0 4vw;gap:24px;background:#fff;border:0;box-shadow:0 1px 0 rgba(0,0,0,.08)}
.nav-brand{gap:9px;flex:0 0 auto}.nav-brand .logo-icon{width:40px;height:40px;border-radius:10px;background:#16a34a;box-shadow:0 5px 14px rgba(22,163,74,.22)}
.nav-brand .brand-text{font-size:22px;letter-spacing:-.8px}.nav-brand .brand-text span{color:#16a34a}
.nav-search{height:44px;flex:1;max-width:620px;width:auto;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:6px;padding-left:15px}.nav-search:focus-within{background:#fff;border-color:#16a34a;box-shadow:0 0 0 3px rgba(22,163,74,.1)}
.nav-actions{gap:3px}.nav-actions .btn{border-radius:6px}.nav-actions .btn-primary{background:#16a34a;box-shadow:none}.nav-actions .btn-ghost{color:#374151}
.btn{border-radius:7px;font-weight:700}.btn-primary{background:#16a34a;box-shadow:0 5px 14px rgba(22,163,74,.2)}.btn-primary:hover{background:#15803d}.btn-outline{border-color:#d1d5db;color:#374151}.btn-outline:hover{background:#111827;color:#fff}.btn-ghost:hover{background:#f3f4f6}
.hero{padding:48px 4vw 74px;text-align:left;background:linear-gradient(118deg,#052e16 0%,#087a37 48%,#16a34a 100%);min-height:330px}
.hero-content{max-width:1200px;width:100%;margin:auto}.hero-badge{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);color:#dcfce7;margin-bottom:16px}.hero h1{font-size:46px;line-height:1.06;max-width:690px;letter-spacing:-1.7px}.hero h1 span{color:#bef264}.hero p{max-width:590px;font-size:16px;color:#dcfce7;margin-bottom:22px}.hero-search{margin:0;max-width:720px;border-radius:7px;padding:5px;box-shadow:0 18px 45px rgba(0,0,0,.22)}.hero-search input{font-size:15px}.hero-search .btn{border-radius:5px;background:#f59e0b;color:#111827;padding:12px 27px}.hero-trust{justify-content:flex-start;color:#d1fae5}
.hero::before{width:620px;height:620px;right:-160px;top:-220px;background:radial-gradient(circle,rgba(255,255,255,.11),transparent 67%)}.hero::after{width:500px;height:500px;left:-220px;bottom:-300px;background:radial-gradient(circle,rgba(190,242,100,.16),transparent 68%)}
.flash-sale-section{margin:-32px auto 0;padding:0 4vw}.flash-sale-banner{border-radius:8px;background:#fff;color:#111827;box-shadow:0 10px 30px rgba(0,0,0,.1);border:1px solid #e5e7eb}.flash-sale-title{color:#111827}.timer-box{background:#111827}.flash-products-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.flash-product-card{border-radius:8px;box-shadow:var(--shadow-sm)}
.promo-banners{max-width:1200px;padding:0 4vw;grid-template-columns:repeat(3,1fr);gap:12px}.promo-banner{border-radius:8px;min-height:115px}
.featured-section{max-width:1200px;padding:0 4vw;margin:24px auto}.featured-shell{padding:0;background:transparent;border:0;box-shadow:none}.featured-header{background:#fff;padding:18px 20px;margin:0;border:1px solid #e5e7eb;border-bottom:0;border-radius:8px 8px 0 0}.featured-products-grid{background:#fff;padding:0 12px 14px;border:1px solid #e5e7eb;border-top:0;border-radius:0 0 8px 8px;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.featured-product-card{border:1px solid #e5e7eb;border-radius:6px;background:#fff;box-shadow:none}.featured-product-card:hover{border-color:#16a34a;box-shadow:0 10px 22px rgba(17,24,39,.09);transform:translateY(-4px)}
.categories-section{max-width:1200px;padding:8px 4vw 20px}.section-header{margin-bottom:14px}.section-title{font-size:22px;letter-spacing:-.5px}.section-title::before{width:3px;background:#16a34a}.categories-grid{grid-template-columns:repeat(8,minmax(0,1fr));gap:10px}.category-card{padding:15px 7px;border:1px solid #e5e7eb;border-radius:8px;box-shadow:none}.category-card:hover,.category-card.active{border-color:#16a34a;background:#f0fdf4;box-shadow:0 7px 18px rgba(22,163,74,.08)}
.filters-bar{max-width:1200px;margin:0 auto 18px;padding:12px 4vw;background:#fff;border:1px solid #e5e7eb;box-shadow:none;border-radius:8px}.filter-group label{font-size:11px;font-weight:800;color:#6b7280}.filter-group input,.filter-group select{background:#fff;border:1px solid #d1d5db;border-radius:6px}
.products-section{max-width:1200px;margin:0 auto;padding:4px 4vw 60px}.products-section .section-header{background:#fff;padding:15px 18px;border:1px solid #e5e7eb;border-bottom:0;border-radius:8px 8px 0 0;margin-bottom:0}.products-grid{background:#fff;padding:12px;border:1px solid #e5e7eb;border-radius:0 0 8px 8px;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.product-card{border:1px solid #e5e7eb!important;border-radius:7px!important;box-shadow:none!important;background:#fff;overflow:hidden}.product-card:hover{border-color:#16a34a!important;box-shadow:0 12px 25px rgba(17,24,39,.1)!important;transform:translateY(-4px)}.product-image{background:#f9fafb!important;height:190px}.product-image img{transition:transform .45s cubic-bezier(.2,.8,.2,1)}.product-body{padding:12px}.product-category{font-size:10px;color:#6b7280!important}.product-title{font-size:14px;line-height:1.4;color:#111827}.product-price{font-size:18px;color:#111827!important}.product-seller{font-size:11px}.btn-contact{border-radius:6px!important}
.product-card.is-featured{border:2px solid #f59e0b!important}.product-featured-tag{background:#f59e0b;color:#111827;box-shadow:none}.featured-seller-badge{color:#166534;background:#dcfce7;border-color:#bbf7d0}
/* Pages */
.chat-page,.account-page,.admin-page{max-width:1200px!important;margin:auto!important;padding:28px 4vw 70px!important}.chat-shell{border-radius:8px;box-shadow:var(--shadow);border:1px solid #e5e7eb}.account-header{background:linear-gradient(135deg,#052e16,#16a34a)!important;border-radius:10px!important}.account-card,.admin-card,.admin-stat{border-radius:8px!important;border:1px solid #e5e7eb!important;box-shadow:none!important;background:#fff}.admin-hero{border-radius:10px!important;background:linear-gradient(135deg,#052e16,#16a34a)!important}.admin-stat strong{color:#16a34a!important}
.product-detail-modal{border-radius:12px!important;overflow:hidden}.product-detail-overlay{padding:18px}.product-gallery-hero{background:#f9fafb}.product-detail-content{padding:26px!important}.modal-product-title{font-size:27px!important;letter-spacing:-.7px}.modal-product-price{font-size:28px!important;color:#16a34a!important}.seller-detail-card{border-radius:8px!important}.modal-actions{position:sticky;bottom:0}
.modal{border-radius:12px!important}.modal-close,.product-detail-close{border-radius:50%!important}
.bottom-nav{background:#fff!important;border-top:1px solid #e5e7eb!important}.bottom-nav-item.active{color:#16a34a!important}
/* Motion language */
@keyframes v6FadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.hero-content>*{animation:v6FadeUp .65s cubic-bezier(.2,.8,.2,1) both}.hero-content .hero-badge{animation-delay:.03s}.hero-content h1{animation-delay:.1s}.hero-content p{animation-delay:.17s}.hero-content .hero-search{animation-delay:.24s}.hero-content .hero-trust{animation-delay:.31s}
.product-card,.featured-product-card,.category-card,.promo-banner{will-change:transform}.product-card:active,.featured-product-card:active,.category-card:active,.promo-banner:active{transform:scale(.985)}
.nav-brand:hover .logo-icon{transform:rotate(-3deg) scale(1.04)}
@media(max-width:1000px){.categories-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.products-grid,.featured-products-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.flash-products-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.nav-search{max-width:none}.nav-actions .btn{padding:8px 9px}.hero h1{font-size:40px}}
@media(max-width:760px){.top-bar{display:none}.navbar{height:62px;padding:0 14px;gap:10px}.nav-brand .brand-text{font-size:19px}.nav-brand .logo-icon{width:36px;height:36px}.nav-search{order:3;position:absolute;left:12px;right:12px;top:70px;width:auto;height:42px}.nav-actions{margin-left:auto}.nav-actions #messagesBtn,.nav-actions #accountBtn,.nav-actions #adminBtn{display:none}.navbar{margin-bottom:52px}.hero{padding:34px 16px 62px;min-height:310px}.hero h1{font-size:34px}.hero p{font-size:14px}.hero-search{width:100%}.hero-trust{flex-wrap:wrap;gap:8px;font-size:11px}.flash-sale-section,.promo-banners,.featured-section,.categories-section,.products-section{padding-left:12px;padding-right:12px}.flash-sale-banner{padding:16px}.flash-products-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:5px}.flash-product-card{min-width:180px;scroll-snap-align:start}.promo-banners{grid-template-columns:1fr;display:flex;overflow-x:auto}.promo-banner{min-width:260px}.featured-products-grid,.products-grid{grid-template-columns:repeat(2,minmax(0,1fr));padding:8px}.featured-product-image{height:140px}.product-image{height:155px}.categories-grid{display:flex;overflow-x:auto;gap:8px;padding-bottom:5px}.category-card{min-width:94px}.filters-bar{margin:0 12px 14px;padding:12px;overflow:auto}.products-section .section-header{padding:13px}.section-title{font-size:19px}}
@media(prefers-reduced-motion:reduce){.hero-content>*{animation:none!important}.product-card,.featured-product-card,.category-card,.promo-banner{transition:none!important}}
/* ==================== END V6 ==================== */


/* ==================== INMALETE SIGNATURE UI V7 ==================== */
:root{
  --primary:#16a34a;--primary-dark:#15803d;--primary-light:#ecfdf3;
  --secondary:#111827;--secondary-light:#374151;--accent:#f59e0b;
  --bg:#f5f7f6;--text:#1f2937;--text-light:#667085;--border:#e5e7eb;
  --shadow-sm:0 2px 8px rgba(17,24,39,.05);--shadow:0 10px 28px rgba(17,24,39,.08);--shadow-lg:0 24px 60px rgba(17,24,39,.13);
  --radius:14px;--radius-sm:9px;
}
body{background:#f5f7f6}
.top-bar{height:32px;padding:0 4vw;background:#0b3d22;color:#d1fae5;font-size:11px;border:0}
.top-bar a{color:#d1fae5}
.navbar{height:72px;padding:0 4vw;background:#fff;border:0;border-bottom:1px solid #e7ece9;box-shadow:0 2px 12px rgba(16,24,40,.05);gap:24px}
.nav-brand{gap:9px}.nav-brand .logo-icon{width:42px;height:42px;border-radius:11px;background:#16a34a;box-shadow:0 7px 18px rgba(22,163,74,.22);overflow:hidden}.nav-brand .brand-text{font-size:23px;color:#111827}.nav-brand .brand-text span{color:#16a34a}
.nav-search{height:46px;flex:1;max-width:620px;width:auto;background:#f5f7f6;border:1px solid #dfe7e2;border-radius:9px;padding-left:15px;transition:.25s ease}.nav-search:focus-within{background:#fff;border-color:#16a34a;box-shadow:0 0 0 4px rgba(22,163,74,.1)}
.nav-actions{gap:4px}.nav-actions .btn{border-radius:8px}.nav-actions .btn-primary{background:#16a34a;box-shadow:0 6px 16px rgba(22,163,74,.2)}.nav-actions .btn-primary:hover{background:#15803d}.nav-actions .btn-ghost{color:#344054}.nav-actions .btn-ghost:hover{background:#f0fdf4;color:#166534}
.btn{border-radius:8px;font-weight:750}.btn-primary{background:#16a34a}.btn-outline{border-color:#cfd8d2}
/* Signature green hero */
.hero{min-height:370px;padding:58px 4vw 92px;text-align:left;background:linear-gradient(118deg,#052e16 0%,#087a37 48%,#16a34a 100%);overflow:hidden;position:relative}
.hero::before{width:650px;height:650px;right:-170px;top:-245px;background:radial-gradient(circle,rgba(255,255,255,.13),transparent 66%)}
.hero::after{width:520px;height:520px;left:-230px;bottom:-330px;background:radial-gradient(circle,rgba(190,242,100,.18),transparent 67%)}
.hero-content{max-width:1200px;width:100%;margin:auto;position:relative;z-index:2}
.hero-badge{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);color:#dcfce7;margin-bottom:14px;padding:8px 14px}
.hero h1{font-size:clamp(42px,5.4vw,62px);line-height:1.03;letter-spacing:-2.4px;max-width:720px;margin:14px 0}.hero h1 span{color:#bef264}.hero p{max-width:610px;font-size:16px;line-height:1.65;color:#dcfce7;margin-bottom:23px}
.hero-search{margin:0;max-width:720px;min-height:62px;border-radius:10px;padding:6px;background:#fff;box-shadow:0 20px 50px rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.25)}.hero-search input{font-size:15px;padding:14px 17px}.hero-search .btn{border-radius:7px;background:#f59e0b;color:#111827;padding:12px 28px;box-shadow:none}.hero-search .btn:hover{background:#fbbf24}.hero-trust{justify-content:flex-start;color:#d1fae5;margin-top:15px}
/* Floating featured block */
.featured-section{max-width:1200px;padding:0 4vw;margin:-36px auto 28px;position:relative;z-index:5}.featured-shell{padding:0;background:transparent;border:0;box-shadow:none}.featured-header{background:#fff;padding:18px 20px;margin:0;border:1px solid #e5e7eb;border-bottom:0;border-radius:12px 12px 0 0}.featured-products-grid{background:#fff;padding:0 12px 14px;border:1px solid #e5e7eb;border-top:0;border-radius:0 0 12px 12px;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.featured-product-card{border:1px solid #e5e7eb;border-radius:8px;background:#fff;box-shadow:none;transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}.featured-product-card:hover{border-color:#16a34a;box-shadow:0 12px 24px rgba(17,24,39,.1);transform:translateY(-5px)}
/* Signature categories */
.categories-section{max-width:1200px;padding:8px 4vw 26px}.section-header{margin-bottom:15px}.section-title{font-size:23px;letter-spacing:-.6px;color:#111827}.section-title::before{width:3px;background:#16a34a}.categories-subtitle{font-size:13px;color:#667085;margin-top:3px}.categories-grid{grid-template-columns:repeat(8,minmax(0,1fr));gap:10px}
.category-card{position:relative;isolation:isolate;min-height:122px;padding:15px 7px;border:1px solid #e4e9e6;border-radius:12px;background:linear-gradient(180deg,#fff 0%,#fbfdfc 100%);box-shadow:0 3px 12px rgba(16,24,40,.045);overflow:hidden;transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease,border-color .28s ease,background .28s ease}
.category-card::before{content:"";position:absolute;z-index:-1;left:50%;bottom:-46px;width:130px;height:100px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,rgba(22,163,74,.18),transparent 68%);opacity:0;transition:opacity .3s ease,transform .4s cubic-bezier(.2,.8,.2,1)}
.category-card::after{content:"›";position:absolute;right:9px;top:8px;font-size:16px;font-weight:800;color:#98a2b3;opacity:0;transform:translateX(-5px);transition:.25s ease}
.category-card:hover,.category-card.active{border-color:#6bc58a;background:linear-gradient(180deg,#fff 0%,#f0fdf4 100%);box-shadow:0 12px 24px rgba(22,163,74,.11);transform:translateY(-5px)}
.category-card:hover::before,.category-card.active::before{opacity:1;transform:translateX(-50%) scale(1.25)}.category-card:hover::after,.category-card.active::after{opacity:1;transform:none}
.category-icon{width:54px;height:54px;display:grid;place-items:center;margin:0 auto 9px;border-radius:16px;background:linear-gradient(145deg,#f0fdf4,#dcfce7);font-size:27px;box-shadow:inset 0 0 0 1px rgba(22,163,74,.08);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease}.category-card:hover .category-icon{transform:translateY(-4px) rotate(-4deg) scale(1.08);box-shadow:0 9px 18px rgba(22,163,74,.15)}.category-card.active .category-icon{transform:scale(1.07)}.category-name{font-size:12px;font-weight:800;color:#344054}
/* Marketplace product area */
.filters-bar{max-width:1200px;margin:0 auto 18px;padding:12px 4vw;background:#fff;border:1px solid #e5e7eb;box-shadow:none;border-radius:10px}.filter-group label{font-size:11px;font-weight:800;color:#667085}.filter-group input,.filter-group select{background:#fff;border:1px solid #d0d5dd;border-radius:7px}.products-section{max-width:1200px;margin:0 auto;padding:4px 4vw 60px}.products-section .section-header{background:#fff;padding:15px 18px;border:1px solid #e5e7eb;border-bottom:0;border-radius:10px 10px 0 0;margin-bottom:0}.products-grid{background:#fff;padding:12px;border:1px solid #e5e7eb;border-radius:0 0 10px 10px;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.product-card{border:1px solid #e5e7eb!important;border-radius:8px!important;box-shadow:none!important;background:#fff;transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease,border-color .28s ease!important}.product-card:hover{border-color:#16a34a!important;box-shadow:0 12px 25px rgba(17,24,39,.1)!important;transform:translateY(-5px)}.product-image{background:#f8faf9!important;height:190px}.product-image img{transition:transform .45s cubic-bezier(.2,.8,.2,1)}.product-card:hover .product-image img{transform:scale(1.045)}.product-price{color:#111827!important}.product-card.is-featured{border:2px solid #f59e0b!important}.product-featured-tag{background:#f59e0b;color:#111827;box-shadow:none}
/* Motion polish */
.hero-content>*{animation:v7In .6s cubic-bezier(.2,.8,.2,1) both}.hero-content .hero-badge{animation-delay:.02s}.hero-content h1{animation-delay:.08s}.hero-content p{animation-delay:.14s}.hero-content .hero-search{animation-delay:.2s}.hero-content .hero-trust{animation-delay:.26s}@keyframes v7In{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media(max-width:1000px){.categories-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.products-grid,.featured-products-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.hero h1{font-size:44px}}
@media(max-width:760px){.top-bar{display:none}.navbar{height:62px;padding:0 14px;gap:10px}.nav-brand .brand-text{font-size:19px}.nav-brand .logo-icon{width:36px;height:36px}.nav-search{order:3;position:absolute;left:12px;right:12px;top:70px;width:auto;height:42px}.nav-actions{margin-left:auto}.nav-actions #messagesBtn,.nav-actions #accountBtn,.nav-actions #adminBtn{display:none}.navbar{margin-bottom:52px}.hero{min-height:340px;padding:42px 16px 78px}.hero h1{font-size:35px;letter-spacing:-1.5px}.hero p{font-size:14px}.hero-search{width:100%;min-height:0;display:flex;flex-direction:column;padding:7px;border-radius:13px;gap:7px}.hero-search input{height:48px;background:#f7faf8;border-radius:9px}.hero-search .btn{height:48px;width:100%;border-radius:9px}.hero-trust{flex-wrap:wrap;gap:8px;font-size:11px}.featured-section{margin-top:-43px}.featured-header{padding:15px}.featured-products-grid,.products-grid{grid-template-columns:repeat(2,minmax(0,1fr));padding:8px;gap:9px}.featured-product-image{height:135px}.product-image{height:155px}.categories-section{padding-top:18px}.categories-grid{display:flex;overflow-x:auto;gap:9px;padding:4px 2px 10px;scroll-snap-type:x proximity;scrollbar-width:none}.categories-grid::-webkit-scrollbar{display:none}.category-card{min-width:104px;min-height:112px;scroll-snap-align:start;padding:13px 7px}.category-icon{width:48px;height:48px;font-size:24px}.filters-bar{margin:0 12px 14px;padding:11px;overflow:auto}.products-section .section-header{padding:13px}.section-title{font-size:20px}}
@media(prefers-reduced-motion:reduce){.hero-content>*{animation:none!important}.category-card,.product-card,.featured-product-card{transition:none!important}.product-card:hover,.featured-product-card:hover,.category-card:hover{transform:none}.product-card:hover .product-image img{transform:none}}
/* ==================== END V7 ==================== */

/* =========================================================
   INMALETE PREMIUM REDESIGN — RESET LAYER
   Visual-only layer: preserves existing IDs, handlers and data.
   ========================================================= */
:root{
  --brand:#0b6b4f;
  --brand-2:#0f8a67;
  --brand-dark:#063d2f;
  --brand-soft:#e9f7f1;
  --ink:#101a17;
  --muted:#71807a;
  --line:#e8eeeb;
  --surface:#ffffff;
  --canvas:#f5f7f6;
  --gold:#e9a23b;
  --danger:#d9534f;
  --radius-xl:28px;
  --radius-lg:20px;
  --radius-md:14px;
  --shadow-sm:0 6px 18px rgba(8,42,32,.06);
  --shadow-md:0 16px 42px rgba(8,42,32,.10);
  --shadow-lg:0 28px 80px rgba(8,42,32,.14);
  --ease:cubic-bezier(.22,1,.36,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:
    radial-gradient(circle at 10% 0%,rgba(15,138,103,.045),transparent 28rem),
    var(--canvas);
  color:var(--ink);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:-.01em;
}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
::selection{background:rgba(15,138,103,.18);color:var(--brand-dark)}

/* Top strip */
.top-bar{
  min-height:34px!important;
  padding:7px clamp(16px,4vw,56px)!important;
  background:#062e24!important;
  color:#dff4eb!important;
  font-size:11px!important;
  letter-spacing:.06em;
  text-transform:uppercase;
  border:0!important;
}
.top-bar .left,.top-bar .right{gap:16px!important}

/* Main navigation */
.navbar{
  position:sticky!important;
  top:0;
  z-index:100;
  height:78px!important;
  padding:0 clamp(16px,4vw,56px)!important;
  background:rgba(255,255,255,.88)!important;
  backdrop-filter:blur(22px) saturate(180%);
  -webkit-backdrop-filter:blur(22px) saturate(180%);
  border-bottom:1px solid rgba(16,26,23,.07)!important;
  box-shadow:0 5px 24px rgba(7,39,29,.035)!important;
}
.nav-brand{gap:11px!important;min-width:max-content}
.logo-icon{
  width:42px!important;height:42px!important;border-radius:13px!important;
  box-shadow:0 8px 20px rgba(11,107,79,.18);
  overflow:hidden;
}
.logo-icon img{border-radius:13px!important}
.brand-text{
  font-size:22px!important;
  font-weight:850!important;
  letter-spacing:-.055em!important;
  color:#10221c!important;
}
.brand-text span{color:var(--brand)!important}
.nav-search{
  max-width:620px!important;
  height:48px!important;
  border:1px solid #dfe8e4!important;
  background:#f6f8f7!important;
  border-radius:16px!important;
  box-shadow:none!important;
  transition:.35s var(--ease)!important;
}
.nav-search:focus-within{
  background:#fff!important;
  border-color:rgba(15,138,103,.42)!important;
  box-shadow:0 0 0 5px rgba(15,138,103,.08),0 10px 26px rgba(8,42,32,.08)!important;
  transform:translateY(-1px);
}
.nav-search span{opacity:.55}
.nav-search input{font-size:14px!important}
.nav-actions{gap:6px!important}
.btn{
  border-radius:13px!important;
  font-weight:750!important;
  transition:transform .22s var(--ease),box-shadow .22s var(--ease),background .22s ease,border-color .22s ease!important;
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0) scale(.97)}
.btn-primary{
  background:linear-gradient(135deg,#0b6b4f,#0f8a67)!important;
  border:0!important;
  box-shadow:0 9px 20px rgba(11,107,79,.18)!important;
}
.btn-primary:hover{box-shadow:0 14px 28px rgba(11,107,79,.25)!important}
.btn-ghost{color:#30423b!important}
.btn-outline{border:1px solid #dce6e1!important;background:#fff!important}

/* Home hero — premium editorial composition */
.hero{
  position:relative!important;
  min-height:560px!important;
  margin:0!important;
  padding:82px clamp(20px,7vw,110px) 76px!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 82% 18%,rgba(76,211,160,.26),transparent 22rem),
    radial-gradient(circle at 8% 90%,rgba(0,55,42,.34),transparent 25rem),
    linear-gradient(128deg,#063d2f 0%,#087254 48%,#0b8b68 100%)!important;
  color:#fff!important;
  border-radius:0 0 42px 42px!important;
  box-shadow:0 24px 70px rgba(5,59,45,.18);
}
.hero:before,.hero:after{
  content:"";position:absolute;border-radius:999px;pointer-events:none;
}
.hero:before{
  width:420px;height:420px;right:-130px;bottom:-210px;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 0 0 60px rgba(255,255,255,.025),0 0 0 120px rgba(255,255,255,.018);
}
.hero:after{
  width:180px;height:180px;left:8%;top:18%;
  background:rgba(255,255,255,.045);
  filter:blur(2px);
}
.hero-content{
  position:relative!important;
  z-index:2!important;
  max-width:850px!important;
  margin:0 auto!important;
  text-align:center!important;
}
.hero-badge{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  padding:8px 13px!important;
  border:1px solid rgba(255,255,255,.18)!important;
  background:rgba(255,255,255,.09)!important;
  backdrop-filter:blur(10px);
  border-radius:999px!important;
  color:#e9fff6!important;
  font-size:12px!important;
  font-weight:750!important;
  letter-spacing:.02em;
}
.hero h1{
  max-width:850px!important;
  margin:22px auto 18px!important;
  font-size:clamp(42px,6.3vw,76px)!important;
  line-height:.98!important;
  letter-spacing:-.065em!important;
  font-weight:900!important;
}
.hero h1 span{
  color:#9af0cc!important;
  position:relative;
}
.hero h1 span:after{
  content:"";
  position:absolute;left:0;right:0;bottom:-8px;height:2px;
  background:linear-gradient(90deg,transparent,#9af0cc,transparent);
  opacity:.65;
}
.hero p{
  max-width:640px!important;
  margin:0 auto!important;
  color:rgba(255,255,255,.76)!important;
  font-size:16px!important;
  line-height:1.75!important;
}
.hero-search{
  display:flex!important;
  max-width:700px!important;
  margin:34px auto 18px!important;
  padding:7px!important;
  background:#fff!important;
  border-radius:18px!important;
  box-shadow:0 22px 55px rgba(0,0,0,.18)!important;
}
.hero-search input{
  min-width:0!important;
  flex:1!important;
  height:52px!important;
  padding:0 18px!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  color:#14231e!important;
  font-size:15px!important;
}
.hero-search .btn{
  min-width:112px!important;
  border-radius:13px!important;
}
.hero-trust{
  justify-content:center!important;
  gap:10px!important;
  flex-wrap:wrap!important;
}
.hero-trust span{
  padding:7px 10px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:999px!important;
  color:rgba(255,255,255,.72)!important;
  background:rgba(255,255,255,.055)!important;
  font-size:11px!important;
}

/* Section system */
.featured-section,.categories-section,.products-section{
  max-width:1440px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:clamp(16px,4vw,56px)!important;
  padding-right:clamp(16px,4vw,56px)!important;
}
.featured-section{padding-top:64px!important;padding-bottom:30px!important}
.categories-section{padding-top:54px!important;padding-bottom:22px!important}
.products-section{padding-top:44px!important;padding-bottom:80px!important}
.section-header{align-items:end!important;margin-bottom:22px!important}
.eyebrow{
  color:var(--brand)!important;
  font-size:10px!important;
  font-weight:850!important;
  letter-spacing:.16em!important;
}
.section-title{
  color:#10211b!important;
  font-size:clamp(24px,3vw,32px)!important;
  font-weight:850!important;
  letter-spacing:-.045em!important;
}
.featured-subtitle,.categories-subtitle{color:#77847f!important}

/* Featured area becomes a premium dark stage */
.featured-shell{
  position:relative!important;
  padding:28px!important;
  border-radius:30px!important;
  background:linear-gradient(135deg,#0a3f31,#0c6049)!important;
  box-shadow:var(--shadow-lg)!important;
  overflow:hidden!important;
}
.featured-shell:before{
  content:"";position:absolute;right:-90px;top:-150px;width:360px;height:360px;
  border:1px solid rgba(255,255,255,.09);border-radius:50%;
  box-shadow:0 0 0 55px rgba(255,255,255,.025),0 0 0 110px rgba(255,255,255,.018);
}
.featured-header{position:relative;z-index:1}
.featured-header .section-title{color:#fff!important}
.featured-header .featured-subtitle{color:rgba(255,255,255,.62)!important}
.featured-header .eyebrow{color:#8ee9c5!important}
.featured-header .btn-outline{
  background:rgba(255,255,255,.09)!important;
  border-color:rgba(255,255,255,.14)!important;
  color:#fff!important;
}

/* Categories — tactile premium tiles */
.categories-grid{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:12px!important;
}
.category-card{
  position:relative!important;
  min-height:145px!important;
  padding:20px!important;
  border:1px solid #e5ece8!important;
  border-radius:20px!important;
  background:linear-gradient(180deg,#fff,#f9fbfa)!important;
  box-shadow:var(--shadow-sm)!important;
  overflow:hidden!important;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s ease!important;
}
.category-card:after{
  content:"↗";position:absolute;right:14px;top:12px;
  width:25px;height:25px;display:grid;place-items:center;
  border-radius:50%;background:#eef7f3;color:var(--brand);
  font-size:12px;font-weight:900;
  opacity:0;transform:translate(-5px,5px);
  transition:.35s var(--ease);
}
.category-card:hover{
  transform:translateY(-7px)!important;
  border-color:rgba(15,138,103,.22)!important;
  box-shadow:0 22px 45px rgba(8,42,32,.11)!important;
}
.category-card:hover:after{opacity:1;transform:none}
.category-icon{
  width:56px!important;height:56px!important;
  display:grid!important;place-items:center!important;
  border-radius:17px!important;
  background:linear-gradient(135deg,#e8f8f1,#d7f1e8)!important;
  color:var(--brand)!important;
  font-size:27px!important;
  box-shadow:inset 0 0 0 1px rgba(15,138,103,.05)!important;
}
.category-card h3,.category-card .category-name{
  color:#182923!important;font-weight:800!important;
}
.category-card p,.category-card .category-count{color:#81908a!important}

/* Filters */
.filters-bar{
  max-width:1328px!important;
  margin:10px auto 8px!important;
  padding:12px!important;
  border:1px solid #e3ebe7!important;
  background:rgba(255,255,255,.86)!important;
  border-radius:18px!important;
  box-shadow:var(--shadow-sm)!important;
  backdrop-filter:blur(14px);
}
.filter-group{
  padding:5px!important;
}
.filter-group label{
  font-size:10px!important;text-transform:uppercase!important;
  letter-spacing:.08em!important;font-weight:800!important;color:#788680!important;
}
.filter-group input,.filter-group select{
  min-height:42px!important;
  border:1px solid #e1e9e5!important;
  border-radius:12px!important;
  background:#f8faf9!important;
  outline:0!important;
  transition:.25s ease!important;
}
.filter-group input:focus,.filter-group select:focus{
  border-color:rgba(15,138,103,.4)!important;
  background:#fff!important;
  box-shadow:0 0 0 4px rgba(15,138,103,.07)!important;
}

/* Product grids */
.products-grid,.featured-products-grid{
  gap:14px!important;
}
.products-grid{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
}
.featured-products-grid{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  position:relative;z-index:1;
}
.product-card,.featured-product-card{
  position:relative!important;
  border:1px solid #e6ece9!important;
  border-radius:19px!important;
  background:#fff!important;
  box-shadow:0 5px 18px rgba(8,42,32,.055)!important;
  overflow:hidden!important;
  transition:transform .38s var(--ease),box-shadow .38s var(--ease),border-color .3s ease!important;
}
.product-card:hover,.featured-product-card:hover{
  transform:translateY(-8px)!important;
  box-shadow:0 24px 48px rgba(8,42,32,.13)!important;
  border-color:rgba(15,138,103,.18)!important;
}
.product-image,.featured-product-image{
  position:relative!important;
  background:#f1f4f2!important;
  overflow:hidden!important;
}
.product-image img,.featured-product-image img{
  transition:transform .65s var(--ease),filter .4s ease!important;
}
.product-card:hover .product-image img,.featured-product-card:hover .featured-product-image img{
  transform:scale(1.055)!important;
}
.product-info,.featured-product-info{padding:15px!important}
.product-title,.featured-product-title{
  color:#17251f!important;
  font-weight:760!important;
  line-height:1.3!important;
}
.product-price,.featured-product-price{
  color:var(--brand)!important;
  font-size:18px!important;
  font-weight:900!important;
  letter-spacing:-.035em!important;
}
.product-meta,.featured-product-meta{color:#81908a!important}
.product-card .badge,.featured-product-card .badge{
  border-radius:999px!important;
  font-weight:800!important;
}
.featured-product-card{
  box-shadow:0 10px 28px rgba(0,0,0,.11)!important;
}

/* Product count/header */
#resultCount{
  padding:6px 10px;
  border-radius:999px;
  background:#eaf4ef;
  color:var(--brand)!important;
  font-weight:800;
  font-size:11px!important;
}

/* Chat */
.chat-page,.account-page,.admin-page{
  max-width:1400px!important;
  margin:0 auto!important;
  padding:38px clamp(16px,4vw,56px) 80px!important;
}
.chat-shell{
  border:1px solid #e2ebe7!important;
  border-radius:26px!important;
  overflow:hidden!important;
  background:#fff!important;
  box-shadow:var(--shadow-md)!important;
}
.chat-sidebar{background:#f7faf8!important;border-right:1px solid #e7eeeb!important}
.chat-sidebar-header{padding:20px!important}
.chat-list-item{
  margin:5px 10px!important;
  border-radius:15px!important;
  transition:.25s var(--ease)!important;
}
.chat-list-item:hover{background:#eaf5f0!important;transform:translateX(3px)}
.chat-header{padding:18px 22px!important;border-bottom:1px solid #e7eeeb!important}
.chat-avatar{box-shadow:0 8px 20px rgba(11,107,79,.14)!important}
.chat-notice{margin:12px 16px!important;border-radius:14px!important;background:#f0f7f4!important}
.chat-compose{
  margin:12px!important;padding:7px!important;
  border:1px solid #dfe8e4!important;border-radius:16px!important;
  background:#f8faf9!important;
}
.chat-compose textarea{border:0!important;background:transparent!important}

/* Account and forms */
.account-card,.profile-card,.settings-card{
  border:1px solid #e3ebe7!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:var(--shadow-sm)!important;
}
input,select,textarea{
  border-radius:13px!important;
}
input:focus,select:focus,textarea:focus{
  border-color:rgba(15,138,103,.42)!important;
  box-shadow:0 0 0 4px rgba(15,138,103,.07)!important;
}

/* Modals */
.modal-overlay{
  background:rgba(3,19,14,.58)!important;
  backdrop-filter:blur(9px)!important;
}
.modal,.modal-content{
  border:1px solid rgba(255,255,255,.72)!important;
  border-radius:26px!important;
  box-shadow:0 35px 100px rgba(0,0,0,.24)!important;
  animation:premiumModal .45s var(--ease) both!important;
}
@keyframes premiumModal{
  from{opacity:0;transform:translateY(20px) scale(.965)}
  to{opacity:1;transform:none}
}

/* Terms screen */
.terms-overlay{
  background:radial-gradient(circle at 20% 10%,#0e8765,transparent 28rem),#042d23!important;
}
.terms-card{
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:28px!important;
  box-shadow:0 40px 120px rgba(0,0,0,.28)!important;
}

/* Admin — command-center feel */
#adminPage .section-title,.admin-page .section-title{letter-spacing:-.05em}
.admin-card,.admin-stat,.admin-panel,.admin-table-wrap{
  border:1px solid #e2ebe7!important;
  border-radius:20px!important;
  background:#fff!important;
  box-shadow:var(--shadow-sm)!important;
}
.admin-stat{
  transition:.3s var(--ease)!important;
}
.admin-stat:hover{transform:translateY(-5px);box-shadow:var(--shadow-md)!important}

/* Page-level reveal */
#homePage>.hero{animation:heroIn .75s var(--ease) both}
@keyframes heroIn{
  from{opacity:0;transform:translateY(14px)}
  to{opacity:1;transform:none}
}
.featured-section,.categories-section,.products-section{
  animation:sectionIn .7s var(--ease) both;
}
@keyframes sectionIn{
  from{opacity:0;transform:translateY(18px)}
  to{opacity:1;transform:none}
}

/* Floating mobile navigation polish */
.mobile-bottom-nav,.bottom-nav{
  border-top:1px solid #e4ebe8!important;
  background:rgba(255,255,255,.92)!important;
  backdrop-filter:blur(18px)!important;
  box-shadow:0 -10px 30px rgba(8,42,32,.08)!important;
}

/* Responsive */
@media(max-width:1100px){
  .products-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .featured-products-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .categories-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
}
@media(max-width:760px){
  .top-bar{display:none!important}
  .navbar{height:68px!important;padding:0 13px!important}
  .brand-text{font-size:19px!important}
  .logo-icon{width:38px!important;height:38px!important}
  .nav-search{display:flex!important;order:3!important;position:absolute;left:12px;right:12px;top:76px;max-width:none!important}
  .navbar{margin-bottom:62px}
  .nav-actions .btn:not(#sellBtn){display:none!important}
  .nav-actions{margin-left:auto}
  .sellBtn{display:block}
  .hero{
    min-height:520px!important;
    padding:62px 18px 48px!important;
    border-radius:0 0 28px 28px!important;
  }
  .hero h1{font-size:44px!important}
  .hero p{font-size:14px!important;line-height:1.65!important}
  .hero-search{margin-top:28px!important}
  .hero-search input{height:48px!important}
  .hero-search .btn{min-width:92px!important}
  .featured-section{padding-top:36px!important}
  .featured-shell{padding:18px!important;border-radius:23px!important}
  .featured-products-grid{display:flex!important;overflow-x:auto!important;scroll-snap-type:none!important;padding-bottom:5px}
  .featured-product-card{min-width:72vw!important;scroll-snap-align:start}
  .categories-grid{
    display:flex!important;overflow-x:auto!important;gap:11px!important;
    padding:4px 2px 12px!important;
  }
  .category-card{
    min-width:132px!important;
    min-height:135px!important;
    scroll-snap-align:start;
  }
  .products-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  .product-card{border-radius:15px!important}
  .product-info{padding:11px!important}
  .product-price{font-size:16px!important}
  .filters-bar{
    margin:5px 12px!important;
    border-radius:16px!important;
    display:flex!important;
    overflow-x:auto!important;
    gap:4px!important;
  }
  .filter-group{min-width:132px!important}
  .section-title{font-size:23px!important}
  .section-header{align-items:start!important}
  .section-header>.btn{display:none!important}
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}



        /* ==================== PREMIUM UI RESET v9 ==================== */
        :root{
          --primary:#0b8f68; --primary-dark:#067454; --primary-light:#e9f8f2;
          --secondary:#071c17; --secondary-light:#16382f; --accent:#b8f34a;
          --bg:#f5f7f3; --white:#fffdf9; --text:#12231d; --text-light:#6c7c75;
          --border:#dfe8e3; --gold:#d8a83e;
          --shadow-sm:0 4px 18px rgba(7,28,23,.055); --shadow:0 12px 35px rgba(7,28,23,.09);
          --shadow-lg:0 24px 70px rgba(7,28,23,.14); --radius:20px; --radius-sm:12px;
          --transition:all .28s cubic-bezier(.2,.8,.2,1);
        }
        html{scroll-behavior:smooth}
        body{background:#f5f7f3;color:var(--text);letter-spacing:-.01em}
        body::selection{background:#b8f34a;color:#071c17}
        .top-bar{background:#06150f;padding:7px clamp(16px,4vw,48px);border-bottom:1px solid rgba(184,243,74,.12);font-size:11px;letter-spacing:.02em}
        .top-bar a{color:#c8f77c}
        .navbar{height:76px;padding:0 clamp(16px,4vw,48px);background:rgba(255,253,249,.94);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(223,232,227,.8);box-shadow:0 5px 22px rgba(7,28,23,.045)}
        .nav-brand{gap:11px}.nav-brand .logo-icon{width:44px;height:44px;border-radius:14px;background:#0b8f68;box-shadow:0 9px 20px rgba(11,143,104,.22)}
        .nav-brand .brand-text{font-size:22px;letter-spacing:-.8px;color:#071c17}.nav-brand .brand-text span{color:#0b8f68}
        .nav-search{width:min(430px,38vw);height:46px;border-radius:15px;background:#f0f4f1;border:1px solid transparent;padding-left:16px;transition:var(--transition)}
        .nav-search:focus-within{background:#fff;border-color:#9bd8c4;box-shadow:0 0 0 5px rgba(11,143,104,.08);transform:translateY(-1px)}
        .nav-search input{font-size:13px}.nav-actions{gap:5px}.btn{border-radius:13px;padding:10px 17px;font-weight:750;letter-spacing:-.01em}.btn-primary{background:#0b8f68;box-shadow:0 9px 22px rgba(11,143,104,.22)}.btn-primary:hover{background:#087b59;transform:translateY(-2px)}.btn-outline{border:1px solid #b8cbc2;color:#17342b;background:#fff}.btn-outline:hover{background:#071c17;color:#fff;border-color:#071c17}.btn-ghost{color:#52645c}.btn-ghost:hover{background:#edf3ef;color:#0b8f68}
        .hero{min-height:600px;padding:78px clamp(18px,5vw,70px) 128px;background:radial-gradient(circle at 73% 30%,rgba(184,243,74,.17),transparent 25%),radial-gradient(circle at 20% 85%,rgba(41,184,137,.18),transparent 28%),linear-gradient(135deg,#041b14 0%,#07382b 54%,#0b6f56 100%);position:relative;isolation:isolate;overflow:hidden}
        .hero::before{width:680px;height:680px;right:-190px;top:-230px;background:radial-gradient(circle,rgba(255,255,255,.09),transparent 68%);filter:blur(2px);animation:premiumFloat 11s ease-in-out infinite alternate}
        .hero::after{width:500px;height:500px;left:-190px;bottom:-260px;background:radial-gradient(circle,rgba(184,243,74,.12),transparent 68%);animation:premiumFloat 14s ease-in-out infinite alternate-reverse}
        .hero-content{max-width:850px;margin:0 auto;z-index:4}.hero-badge{border-radius:999px;padding:9px 14px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:#dff6e9;box-shadow:0 12px 28px rgba(0,0,0,.12);font-size:10px;letter-spacing:.7px;text-transform:uppercase}
        .hero h1{font-size:clamp(43px,6.5vw,76px);line-height:.98;letter-spacing:-4.2px;margin:22px auto 18px;color:#fff;text-shadow:0 5px 35px rgba(0,0,0,.16)}
        .hero h1 span{color:#c5f86a}.hero p{max-width:650px;color:rgba(255,255,255,.76);font-size:16px;line-height:1.7}.hero-search{max-width:760px;min-height:68px;margin:28px auto 0;padding:7px;background:#fff;border:1px solid rgba(255,255,255,.5);border-radius:18px;box-shadow:0 28px 70px rgba(0,0,0,.22)}.hero-search input{font-size:15px;padding:16px 18px}.hero-search .btn{min-height:54px;border-radius:14px;padding:0 29px}.hero-trust{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:16px}.hero-trust span{font-size:11px;color:rgba(255,255,255,.78);padding:7px 11px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(255,255,255,.05)}
        .hero-metrics{display:flex;justify-content:center;gap:10px;margin:27px auto 0;flex-wrap:wrap}.hero-metric{min-width:145px;padding:12px 15px;text-align:left;border-radius:15px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.11);backdrop-filter:blur(10px)}.hero-metric strong{display:block;color:#c5f86a;font-size:13px}.hero-metric span{display:block;color:rgba(255,255,255,.58);font-size:10px;margin-top:2px}
        .hero-orbit{position:absolute;inset:0;pointer-events:none;z-index:2}.orbit-glow{position:absolute;width:430px;height:430px;right:5%;top:50%;transform:translateY(-45%);border:1px solid rgba(197,248,106,.15);border-radius:50%;box-shadow:0 0 100px rgba(184,243,74,.08) inset;animation:orbitSpin 24s linear infinite}.orbit-card{position:absolute;display:flex;flex-direction:column;gap:5px;background:rgba(255,253,249,.93);color:#0a221a;border:1px solid rgba(255,255,255,.45);box-shadow:0 25px 70px rgba(0,0,0,.2);backdrop-filter:blur(15px);border-radius:20px}.orbit-card-main{right:7%;top:27%;width:205px;padding:20px;transform:rotate(4deg);animation:cardFloat 5.5s ease-in-out infinite}.orbit-card-main strong{font-size:25px;line-height:1.02;letter-spacing:-1.5px}.orbit-label{font-size:8px;font-weight:900;letter-spacing:1.4px;color:#0b8f68}.orbit-line{width:38px;height:3px;background:#b8f34a;border-radius:99px;margin:7px 0}.orbit-card small{font-size:9px;color:#6b7c74}.orbit-card-mini{right:20%;top:18%;padding:10px 13px;flex-direction:row;align-items:center;font-size:10px;font-weight:800;transform:rotate(-5deg);animation:cardFloat 4.5s ease-in-out 1s infinite}.orbit-card-mini b{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#e8f8f1;color:#0b8f68}.orbit-card-price{right:20%;bottom:21%;padding:13px 16px;transform:rotate(5deg);animation:cardFloat 5s ease-in-out .5s infinite}.orbit-card-price span,.orbit-card-price small{font-size:9px;color:#6b7c74}.orbit-card-price strong{font-size:25px;letter-spacing:-1px}
        @keyframes premiumFloat{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(22px,15px,0) scale(1.06)}}@keyframes cardFloat{0%,100%{translate:0 0}50%{translate:0 -9px}}@keyframes orbitSpin{to{transform:translateY(-45%) rotate(360deg)}}
        .featured-section{max-width:1240px;margin:-62px auto 30px;padding:0 clamp(14px,3vw,30px);z-index:10}.featured-shell{border:1px solid rgba(255,255,255,.8);border-radius:28px;padding:28px;background:rgba(255,253,249,.96);box-shadow:0 25px 75px rgba(7,28,23,.12)}.featured-header{align-items:flex-end}.eyebrow{color:#0b8f68;letter-spacing:1.7px;font-size:9px}.section-title{font-size:26px;letter-spacing:-1px;color:#0a2119}.featured-subtitle,.categories-subtitle{color:#75837d}
        .featured-products-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.featured-product-card{border:1px solid #e4ebe7!important;border-radius:18px!important;background:#fff!important;box-shadow:0 6px 18px rgba(7,28,23,.06)!important}.featured-product-card:hover{transform:translateY(-7px) scale(1.01);box-shadow:0 20px 38px rgba(7,28,23,.12)!important}.featured-product-image{height:170px;background:#f2f6f3}.featured-product-body{padding:15px}.featured-product-title{font-size:14px}.featured-product-price{color:#0b8f68}
        .categories-section,.products-section{max-width:1240px;margin-left:auto;margin-right:auto;padding-left:clamp(14px,3vw,30px);padding-right:clamp(14px,3vw,30px)}.categories-section{padding-top:8px;margin-bottom:34px}.categories-grid{gap:12px}.category-card{min-height:132px;border:1px solid #e0e9e4;border-radius:19px;background:#fffdf9;box-shadow:0 6px 18px rgba(7,28,23,.045);position:relative;overflow:hidden}.category-card::after{background:radial-gradient(circle,#b8f34a 0,transparent 68%);opacity:.08;width:110px;height:110px;right:-42px;bottom:-42px}.category-card:hover,.category-card.active{transform:translateY(-7px);border-color:#8acfb7;box-shadow:0 20px 35px rgba(7,28,23,.10)}.category-card.active{background:#eef9f4}.category-icon{width:54px;height:54px;border-radius:17px;background:#edf7f2;color:#0b8f68;display:grid;place-items:center;font-size:28px;transition:var(--transition)}.category-card:hover .category-icon{transform:rotate(-5deg) scale(1.08);background:#dff5eb}.category-name{font-size:12px;font-weight:800;color:#20352d}
        .filters-bar{max-width:1180px;margin:0 auto 18px;padding:10px 14px;border:1px solid #dfe8e3;border-radius:16px;background:rgba(255,255,255,.8);box-shadow:var(--shadow-sm);backdrop-filter:blur(12px)}.filter-group label{font-size:10px;color:#74827b;font-weight:800}.filter-group input,.filter-group select{border:1px solid #dce6e1;border-radius:10px;background:#fff;padding:8px 10px;color:#1a3028;outline:none}.filter-group input:focus,.filter-group select:focus{border-color:#74c9ab;box-shadow:0 0 0 4px rgba(11,143,104,.07)}
        .products-grid{gap:16px}.product-card{border:1px solid #e2eae5;border-radius:18px;background:#fffdf9;box-shadow:0 5px 18px rgba(7,28,23,.05);overflow:hidden;transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s,border-color .3s}.product-card:hover{transform:translateY(-7px);box-shadow:0 22px 42px rgba(7,28,23,.12);border-color:#b8d9cc}.product-image{height:205px;background:linear-gradient(145deg,#f1f6f3,#e9f1ed)}.product-image img{transition:transform .55s cubic-bezier(.2,.8,.2,1)}.product-card:hover .product-image img{transform:scale(1.045)}.product-body{padding:15px}.product-category{color:#0b8f68;font-size:9px;letter-spacing:1.4px}.product-title{font-size:14px;line-height:1.35;color:#172a23}.product-seller{font-size:10px}.product-price{font-size:19px;color:#071c17}.product-price .naira{color:#0b8f68}.btn-contact{background:#e8f7f0;color:#087653;padding:8px 12px;border-radius:10px}.btn-contact:hover{background:#0b8f68;color:#fff;transform:translateY(-1px)}
        .product-card.is-featured{border:1px solid #c6a456!important;box-shadow:0 13px 32px rgba(166,123,31,.13)!important}.product-featured-tag{background:#15251f!important;box-shadow:0 8px 20px rgba(0,0,0,.15)}
        .account-page,.chat-page,.admin-page{max-width:1240px}.account-header{padding:30px 0}.account-avatar{box-shadow:0 18px 35px rgba(11,143,104,.2);background:linear-gradient(135deg,#0b8f68,#06251c)}.account-card,.chat-shell,.admin-card{border-radius:20px!important;border:1px solid #dfe8e3!important;box-shadow:var(--shadow-sm)!important;background:#fffdf9!important}.account-card-header{background:#f1f6f3;color:#60716a}.account-menu-item:hover{background:#eff8f4}.admin-hero{background:linear-gradient(135deg,#061b14,#0b7658)!important;border-radius:24px!important;box-shadow:0 25px 60px rgba(7,28,23,.18)!important}.admin-stat{border-radius:18px!important;border:1px solid #dfe8e3!important;background:#fffdf9!important;box-shadow:var(--shadow-sm)!important}.admin-stat strong{color:#0b8f68}
        .chat-shell{overflow:hidden}.chat-sidebar{background:#f7faf8}.chat-list-item:hover,.chat-list-item.active{background:#eaf7f1}.chat-avatar{background:linear-gradient(135deg,#0b8f68,#06251c)}.chat-message-row.mine .chat-bubble{background:#0b8f68}.chat-compose textarea:focus{border-color:#6dc4a6;box-shadow:0 0 0 4px rgba(11,143,104,.08)}
        .bottom-nav{background:rgba(255,253,249,.96);backdrop-filter:blur(18px);border-top:1px solid #dfe8e3}.bottom-nav-item.active{color:#0b8f68}.bottom-nav-item .nav-icon{transition:transform .2s}.bottom-nav-item:active .nav-icon{transform:scale(.84)}
        .footer{background:#06150f;border-top:1px solid rgba(184,243,74,.18);margin-top:70px}.footer h4{color:#c5f86a}.footer-brand span{color:#b8f34a}
        .modal-overlay{backdrop-filter:blur(8px);background:rgba(3,16,12,.62)!important}.modal,.product-detail-modal{border-radius:26px!important;border:1px solid rgba(255,255,255,.6)!important;box-shadow:0 35px 100px rgba(0,0,0,.3)!important}
        @media(max-width:1050px){.hero-orbit{opacity:.45}.orbit-card-main{right:2%}.orbit-card-mini{right:10%}.orbit-card-price{right:9%}.featured-products-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
        @media(max-width:760px){.top-bar{display:none}.navbar{height:auto;padding:10px 14px;gap:8px}.nav-search{order:3;width:100%;height:44px}.nav-actions .btn-ghost{font-size:0;padding:9px}.nav-actions .btn-ghost span{font-size:14px}.hero{min-height:610px;padding:62px 16px 120px}.hero h1{font-size:43px;letter-spacing:-2.8px}.hero p{font-size:14px}.hero-search{min-height:auto;display:flex;flex-direction:row;padding:6px;border-radius:16px}.hero-search input{min-width:0}.hero-search .btn{padding:0 18px}.hero-metrics{gap:7px}.hero-metric{min-width:0;flex:1;padding:10px}.hero-orbit{opacity:.22}.orbit-glow{width:320px;height:320px;right:-100px;top:58%}.orbit-card-main{right:-25px;top:48%;width:170px}.orbit-card-price{right:20px;bottom:11%}.orbit-card-mini{right:16px;top:43%}.featured-section{margin-top:-48px}.featured-shell{padding:18px;border-radius:22px}.featured-products-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.featured-product-image{height:125px}.categories-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.category-card{min-height:102px;border-radius:15px}.category-icon{width:42px;height:42px;font-size:22px;border-radius:13px}.category-name{font-size:10px}.products-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.product-image{height:155px}.product-body{padding:11px}.product-title{font-size:12px}.product-price{font-size:16px}.filters-bar{border-radius:14px;margin-left:14px;margin-right:14px}.section-title{font-size:22px}}
        @media(max-width:430px){.hero h1{font-size:39px}.hero-search input{font-size:13px}.hero-search .btn{font-size:12px;padding:0 13px}.hero-trust span{font-size:9px}.hero-metric strong{font-size:11px}.hero-metric span{font-size:8px}.categories-grid{grid-template-columns:repeat(4,1fr)}.category-card{min-height:94px}.category-icon{width:38px;height:38px;font-size:20px}.product-image{height:145px}}
        @media(prefers-reduced-motion:reduce){.hero::before,.hero::after,.orbit-glow,.orbit-card-main,.orbit-card-mini,.orbit-card-price{animation:none!important}.product-card,.category-card,.btn{transition:none!important}}



/* v152: mobile listing-detail viewport + seller/actions fix */
@media (max-width:760px){
  .modal-overlay.product-detail-overlay{
    align-items:flex-end!important;
    padding:0!important;
    overflow:hidden!important;
    z-index:5000!important;
  }
  .modal-overlay.product-detail-overlay .modal.product-detail-modal{
    width:100%!important;
    max-width:100%!important;
    height:min(94dvh, 100%)!important;
    max-height:94dvh!important;
    min-height:0!important;
    margin:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
    padding-bottom:0!important;
  }
  .product-gallery-hero{
    height:min(34dvh, 360px)!important;
    min-height:230px!important;
    flex:none!important;
  }
  .product-detail-content{
    display:flex!important;
    flex-direction:column!important;
    padding:15px 14px calc(24px + env(safe-area-inset-bottom))!important;
  }
  /* Keep the seller profile in the first mobile viewport instead of burying it
     below the long description/action stack. */
  .product-detail-content > .product-detail-badge{order:1}
  .product-detail-content > .detail-kicker{order:2}
  .product-detail-content > .modal-product-title{order:3}
  .product-detail-content > .modal-product-price{order:4}
  .product-detail-content > .seller-detail-card{order:5}
  .product-detail-content > .detail-chips{order:6}
  .product-detail-content > .modal-product-desc{order:7}
  .product-detail-content > .modal-actions{order:8}
  .seller-detail-card{
    display:flex!important;
    min-height:68px!important;
    width:100%!important;
    margin-bottom:14px!important;
  }
  .modal-actions{
    position:sticky!important;
    bottom:0!important;
    z-index:25!important;
    margin:0 -14px!important;
    padding:10px 14px calc(10px + env(safe-area-inset-bottom))!important;
    background:rgba(255,255,255,.98)!important;
    backdrop-filter:blur(14px)!important;
    box-shadow:0 -10px 24px rgba(8,31,22,.10)!important;
  }
  .modal-actions .btn{
    min-width:0!important;
    min-height:46px!important;
    width:100%!important;
    box-sizing:border-box!important;
  }
}
@media (max-width:430px){
  .modal-overlay.product-detail-overlay .modal.product-detail-modal{height:95dvh!important;max-height:95dvh!important}
  .product-gallery-hero{height:min(31dvh, 310px)!important;min-height:210px!important}
  .product-detail-content{padding-left:12px!important;padding-right:12px!important}
  .modal-actions{margin-left:-12px!important;margin-right:-12px!important;padding-left:12px!important;padding-right:12px!important}
  .product-chat-actions .btn{min-width:0!important}
}

/* v154: payment-hold notification — centered in viewport */



@media (max-width: 600px) {
    
    
    
}
@media (max-width: 430px) {
    
    
}


/* v166 — notification behavior:
   regular success/error messages stay as compact bottom-right toasts;
   payment-unavailable gets its own centered modal. */
.toast{
    left:auto !important;
    right:20px !important;
    bottom:20px !important;
    transform:none !important;
    width:min(420px, calc(100vw - 32px)) !important;
    max-width:min(420px, calc(100vw - 32px)) !important;
    padding:12px 14px !important;
    border-radius:12px !important;
    gap:10px !important;
    font-size:13px !important;
}
.toast-message{
    line-height:1.4 !important;
}
.im-payment-unavailable-overlay{
    position:fixed;
    inset:0;
    z-index:100000;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:20px;
    background:rgba(8,22,20,.48);
    backdrop-filter:blur(5px);
    -webkit-backdrop-filter:blur(5px);
    opacity:0;
    transition:opacity .18s ease;
}
.im-payment-unavailable-overlay.is-open{opacity:1}
.im-payment-unavailable-card{
    width:min(430px, calc(100vw - 36px));
    padding:24px 22px 18px;
    border-radius:20px;
    background:#fff;
    color:#173b43;
    box-shadow:0 24px 70px rgba(0,0,0,.24);
    text-align:center;
    transform:translateY(8px) scale(.98);
    transition:transform .18s ease;
}
.im-payment-unavailable-overlay.is-open .im-payment-unavailable-card{
    transform:none;
}
.im-payment-unavailable-icon{
    width:42px;
    height:42px;
    margin:0 auto 10px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#fff2df;
    color:#bd6900;
    font-size:22px;
    font-weight:800;
}
.im-payment-unavailable-title{
    font-size:18px;
    font-weight:800;
    margin-bottom:8px;
}
.im-payment-unavailable-message{
    font-size:14px;
    line-height:1.55;
    color:#53676b;
    overflow-wrap:anywhere;
}
.im-payment-unavailable-cancel{
    margin-top:18px;
    min-width:92px;
    height:38px;
    padding:0 18px;
    border:1px solid #d7e0de;
    border-radius:19px;
    background:#fff;
    color:#168f87;
    font-weight:750;
    cursor:pointer;
}
@media(max-width:600px){
    .toast{
        right:12px !important;
        bottom:16px !important;
        width:calc(100vw - 24px) !important;
        max-width:calc(100vw - 24px) !important;
        font-size:12.5px !important;
    }
    .im-payment-unavailable-card{
        width:calc(100vw - 32px);
        padding:22px 18px 17px;
    }
}