*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
    :root{
      --bg:#0d0d0f;
      --headerbg: rgba(13,13,15,.90);
      --accent:#7c5cfc;
      --accent2:#9b7ffe;
      --s1:#141416;--s2:#1c1c1f;--s3:#242428;
      --line:#2a2a2e;--line2:#323236;
      --txt:#f0f0f2;--txt2:#9a9aa6;--txt3:#61616c;
      --glow:rgba(124,92,252,.22);
      --green:#22c55e;--red:#ef4444;--orange:#f97316;--wa:#25D366;
      --r:10px;--r2:16px;
    }
    html{font-size:15px;}
    body{
      font-family:'Plus Jakarta Sans',sans-serif;
      background:var(--bg);color:var(--txt);
      min-height:100vh;-webkit-font-smoothing:antialiased;overflow-x:hidden;
    }
    button,input,select,textarea{font-family:inherit}
    .view{display:none;}
    .view.active{display:block;}

    /* HEADER */
    #cy-benefits-bar{
      position:sticky;
      top:0;
      z-index:302;
      width:100%;
    }
    /* Header sticky siempre debajo de la barra */
    header{
      position:relative;z-index:300;
      background:var(--headerbg);
      backdrop-filter:blur(20px);
      border-bottom:1px solid var(--line);
      min-height:56px;height:auto;padding:6px 1rem;
      display:flex;align-items:center;justify-content:space-between;gap:10px;
    }
    .hd-l{display:flex;align-items:center;gap:9px;cursor:pointer;min-width:0;}


    .hd-logo{
      width:62px;height:62px;border-radius:16px;
      background:linear-gradient(135deg,var(--accent),var(--accent2));
      display:flex;align-items:center;justify-content:center;
      font-size:.82rem;font-weight:800;color:#fff;
      box-shadow:0 0 14px var(--glow);flex-shrink:0;
      overflow:hidden;
    }
    .hd-logo img{width:100%;height:100%;object-fit:cover;display:block;}
    .hd-name{
      font-weight:700;font-size:.95rem;
      white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
      max-width:180px;
    }
    .hd-sub{
      font-size:.72rem;color:var(--txt3);
      white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
      max-width:180px;
      margin-top:-2px;
    }
    .hd-stack{display:flex;flex-direction:column;min-width:0;}

    /* ── Header con logo grande (sin texto) ── */
    header.logo-only .hd-stack { display:none !important; }
    header.logo-only .hd-l { cursor:default; gap:0; padding:4px 0; }
    header.logo-only .hd-logo {
      width:auto !important;
      height:62px !important;
      border-radius:12px !important;
      background:transparent !important;
      box-shadow:none !important;
      padding:2px;
    }
    header.logo-only .hd-logo img {
      width:auto !important;
      max-width:200px !important;
      height:100% !important;
      object-fit:contain !important;
    }
    /* Centrado */
    header.logo-center {
      display:grid !important;
      grid-template-columns:1fr auto 1fr !important;
      align-items:center !important;
    }
    header.logo-center .hd-l {
      justify-content:flex-start;
      pointer-events:none;
      visibility:hidden;
    }
    header.logo-center .hd-logo-center-wrap {
      display:flex; align-items:center; justify-content:center;
    }
    header.logo-center .hd-logo-center-wrap .hd-logo {
      width:auto !important; height:52px !important;
      border-radius:12px !important; background:transparent !important;
      box-shadow:none !important; padding:2px;
    }
    header.logo-center .hd-logo-center-wrap .hd-logo img {
      width:auto !important; max-width:160px !important;
      height:100% !important; object-fit:contain !important;
    }
    header.logo-center .hd-r { justify-content:flex-end; }
    .hd-r{display:flex;align-items:center;gap:7px;flex-shrink:0;}
    .hd-btn{
      background:var(--s2);border:1px solid var(--line);
      border-radius:var(--r);height:34px;padding:0 11px;
      font-size:.75rem;font-weight:700;color:var(--txt2);
      cursor:pointer;transition:all .18s;
      display:flex;align-items:center;gap:6px;
    }
    .hd-btn:hover{border-color:var(--line2);color:var(--txt);}
    .cart-btn{
      background:var(--accent);border:none;border-radius:var(--r);
      height:34px;padding:0 13px;font-size:.75rem;font-weight:800;color:#fff;
      cursor:pointer;transition:all .18s;display:flex;align-items:center;gap:6px;
      box-shadow:0 0 18px var(--glow);
    }
    .cart-btn:hover{background:var(--accent2);transform:translateY(-1px);}

    /* ── LIGHT MODE — Apple Style ── */
    body.light-mode{ background:var(--bg); }

    /* Header */
    body.light-mode #hd{
      background:rgba(245,245,247,.92);
      border-bottom:1px solid rgba(0,0,0,.10);
      box-shadow:none;
    }
    body.light-mode .hd-name{ color:#1d1d1f; }
    body.light-mode .hd-sub{ color:#6e6e73; }
    body.light-mode .hd-btn{
      background:rgba(255,255,255,.9);
      border-color:rgba(0,0,0,.12);
      color:#1d1d1f;
      box-shadow:0 1px 3px rgba(0,0,0,.08);
    }
    body.light-mode .cart-btn{
      box-shadow:0 2px 8px rgba(0,0,0,.15);
    }

    /* Hero */
    body.light-mode .hero{
      background:#f5f5f7;
      border-bottom:1px solid rgba(0,0,0,.06);
    }
    body.light-mode .hero-pill{
      background:rgba(0,0,0,.05);
      border-color:rgba(0,0,0,.10);
    }
    body.light-mode .hero-pill span{ color:#1d1d1f; }

    /* Categorias */
    body.light-mode .cat-card{
      border:none;
      box-shadow:0 2px 16px rgba(0,0,0,.10), 0 1px 4px rgba(0,0,0,.06);
    }
    body.light-mode .cat-shade{
      background:linear-gradient(160deg,rgba(0,0,0,.50) 0%,rgba(0,0,0,.15) 100%);
    }
    body.light-mode .cat-name{ color:#fff; text-shadow:0 1px 8px rgba(0,0,0,.3); }
    body.light-mode .cat-meta{ color:rgba(255,255,255,.9); }
    body.light-mode .cat-badge{
      background:rgba(255,255,255,.25);
      border-color:rgba(255,255,255,.35);
      backdrop-filter:blur(12px);
    }

    /* Productos lista */
    body.light-mode .pg-card{
      background:#ffffff;
      border:none;
      box-shadow:0 1px 8px rgba(0,0,0,.07), 0 0 1px rgba(0,0,0,.06);
    }
    body.light-mode .pg-card:active{ box-shadow:0 0 2px rgba(0,0,0,.06); }
    body.light-mode .price{ color:#1d1d1f; }

    /* View toggles */
    body.light-mode .vtb{
      background:#fff;
      border-color:rgba(0,0,0,.14);
      color:#6e6e73;
    }
    body.light-mode .vtb.on{
      background:var(--accent);
      border-color:var(--accent);
      color:#fff;
    }

    /* Bottom nav */
    body.light-mode .fnav{
      background:rgba(248,248,250,.52);
      border-top:1px solid rgba(0,0,0,.07);
      box-shadow:none;
    }
    body.light-mode .fn{ color:#8e8e93; }
    body.light-mode .fn.on{ color:var(--accent); }

    /* FAB */
    body.light-mode .fab{
      box-shadow:0 4px 16px rgba(0,0,0,.20);
    }

    /* Modales */
    body.light-mode #mod-box{
      background:#ffffff;
      box-shadow:0 20px 60px rgba(0,0,0,.15);
    }
    body.light-mode .mod-name{ color:#1d1d1f; }
    body.light-mode .mod-price{ color:#1d1d1f; }
    body.light-mode .mod-desc{ color:#6e6e73; }

    /* Inputs */
    body.light-mode .cf{
      background:#f5f5f7;
      border-color:rgba(0,0,0,.12);
      color:#1d1d1f;
    }
    body.light-mode .cf::placeholder{ color:#aeaeb2; }

    /* Carrito */
    body.light-mode #c-drw{
      background:#f5f5f7;
      border-left:1px solid rgba(0,0,0,.08);
    }
    body.light-mode .c-head{
      border-bottom-color:rgba(0,0,0,.08);
    }
    body.light-mode .ci{
      background:#fff;
      box-shadow:0 1px 6px rgba(0,0,0,.06);
      border-color:transparent;
    }
    body.light-mode .del-opt{
      background:#fff;
      border-color:rgba(0,0,0,.10);
      box-shadow:0 1px 4px rgba(0,0,0,.05);
    }
    body.light-mode .del-opt.on{
      border-color:var(--accent);
      box-shadow:0 0 0 1px var(--accent);
    }
    body.light-mode .c-foot{
      background:rgba(245,245,247,.96);
      border-top:1px solid rgba(0,0,0,.08);
    }
    .cart-n{
      background:rgba(255,255,255,.25);
      border-radius:50%;width:17px;height:17px;font-size:.6rem;font-weight:800;
      display:flex;align-items:center;justify-content:center;
    }

    /* HERO */
    .hero{padding:1.2rem 1rem 1rem;position:relative;overflow:hidden;}
    /* ===== BANNER SLIDER ===== */
    .banner-slider{position:relative;width:100%;border-radius:18px;overflow:hidden;margin-bottom:1rem;background:#000;}
    /* Catálogo: sin fondo negro, sin dots, sin flechas */
    .catalog-banner-clean .banner-slider{ background:transparent!important; }
    .catalog-banner-clean .banner-slide{ background:transparent!important; }
    .catalog-banner-clean .banner-dots{ display:none!important; }
    .catalog-banner-clean .banner-arrow{ display:none!important; }
    .banner-slider-track{display:flex;transition:transform .5s cubic-bezier(.4,0,.2,1);will-change:transform;}
    .banner-slide{min-width:100%;width:100%;flex-shrink:0;flex-grow:0;}
    .banner-slide img{width:100%;height:auto;display:block;object-fit:contain;}
    .banner-dots{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);display:flex;gap:5px;z-index:2;}
    .banner-dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.45);cursor:pointer;transition:.3s;}
    .banner-dot.on{background:#fff;width:20px;border-radius:3px;}
    .banner-arrow{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.5);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.15);color:#fff;width:34px;height:34px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2;font-size:1.1rem;transition:.2s;}
    .banner-arrow:hover{background:rgba(0,0,0,.75);}
    .banner-arrow.left{left:10px;}
    .banner-arrow.right{right:10px;}
    .hero::before{
      content:'';
      position:absolute;top:-60px;right:-80px;width:260px;height:260px;
      background:radial-gradient(circle,var(--glow) 0%,transparent 70%);
      pointer-events:none;
    }
    .hero-row{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:.85rem;}
    .hero-pill{
      display:inline-flex;align-items:center;gap:6px;
      background:rgba(124,92,252,.12);
      border:1px solid rgba(124,92,252,.28);
      border-radius:100px;padding:3px 10px;
      font-size:.66rem;font-weight:800;color:var(--accent2);
      letter-spacing:.05em;text-transform:uppercase;margin-bottom:.5rem;
    }
    .hero-pill span{
      width:6px;height:6px;border-radius:50%;background:var(--accent);
      animation:pulse 2s infinite;
    }
    @keyframes pulse{0%,100%{opacity:1;}50%{opacity:.35;}}
    h1{font-size:clamp(1.35rem,4vw,2.05rem);font-weight:900;line-height:1.15;letter-spacing:-.02em;}
    h1 em{font-style:normal;background:linear-gradient(90deg,var(--accent),var(--accent2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
    .hero-sub{font-size:.8rem;color:var(--txt2);margin-top:.3rem;line-height:1.55;}
    .search-wrap{position:relative;margin-top:.9rem;}
    .search-wrap input{
      width:100%;background:var(--s1);border:1px solid var(--line);
      border-radius:var(--r2);padding:.65rem 1rem .65rem 2.4rem;
      font-size:.83rem;color:var(--txt);outline:none;
      transition:border-color .2s,box-shadow .2s;
    }
    .search-wrap input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--glow);}
    .search-wrap input::placeholder{color:var(--txt3);}
    .s-ico{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--txt3);font-size:.9rem;pointer-events:none;}

    /* STORE AREA */
    .store-wrap{padding:0 1rem 11rem;}
    /* Headers fixed — padding compensado via JS en header-style.js (store-v) */
    .sec-hd{
      display:flex;align-items:center;justify-content:space-between;
      margin:1rem 0 .75rem;
      gap:8px;
    }
    .sec-hd h3{font-size:.9rem;font-weight:900;letter-spacing:-.01em;}
    .sec-hd span{font-size:.72rem;color:var(--txt3);font-weight:600;}
    .sec-hd-right{display:flex;align-items:center;gap:6px;}
    .subcat-bar{display:none;gap:8px;overflow:auto;padding:2px 0 .8rem;-ms-overflow-style:none;scrollbar-width:none;}
    .subcat-bar::-webkit-scrollbar{display:none;}

    /* ── Barra de confianza ── */
    #cy-trustbar{
      display:flex;
      flex-direction:row;
      gap:0;
      padding:0 16px;
      background:var(--bg);
      border:1px solid var(--line);
      border-radius:14px;
      margin:12px 16px;
      overflow:hidden;
    }
    .cy-trust-item{
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      gap:5px;
      flex:1;
      padding:12px 6px;
      text-align:center;
      position:relative;
    }
    .cy-trust-item + .cy-trust-item::before{
      content:'';
      position:absolute;
      left:0; top:20%; bottom:20%;
      width:1px;
      background:var(--line);
    }
    .cy-trust-icon{
      width:28px; height:28px;
      display:flex; align-items:center; justify-content:center;
      color:var(--txt2);
    }
    .cy-trust-icon svg{ width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
    .cy-trust-text{
      font-size:.6rem;
      font-weight:700;
      color:var(--txt2);
      line-height:1.3;
    }

    /* ── Chips de categorías (solo modo catálogo) ── */
    #cat-chips-bar{
      display:none;
      flex-direction:row;
      flex-wrap:nowrap;
      gap:8px;
      overflow-x:auto;
      overflow-y:visible;
      padding:8px 16px 10px;
      -ms-overflow-style:none;scrollbar-width:none;
      background:var(--bg);
      border-bottom:1px solid var(--line);
      /* Glass/sticky: queda justo debajo del header sticky */
      position:sticky;
      top:var(--cy-hd-height, 60px);
      z-index:99;
    }
    #cat-chips-bar.active,
    #cat-chips-bar[style*="flex"],
    #cat-chips-bar[style*="block"]{
      display:flex !important;
      flex-direction:row !important;
      flex-wrap:nowrap !important;
      overflow-x:auto !important;
    }
    /* Cuando header-style.js activa un estilo fixed, usa --cy-chips-top */
    body.cy-hd-fixed #cat-chips-bar,
    body.cy-hd-split #cat-chips-bar{
      position:fixed;
      top:var(--cy-chips-top, 64px);
      left:0;right:0;
      z-index:299;
    }
    #cat-chips-bar::-webkit-scrollbar{display:none;}
    .cat-chip{
      flex-shrink:0;
      padding:7px 16px;
      border-radius:20px;
      border:1.5px solid var(--s3);
      background:var(--s1);
      color:var(--txt2);
      font-size:.75rem;
      font-weight:700;
      cursor:pointer;
      transition:all .18s;
      white-space:nowrap;
      font-family:inherit;
    }
    .cat-chip:hover{ border-color:var(--accent); color:var(--accent); }
    .cat-chip.active{ background:var(--accent); border-color:var(--accent); color:#fff; }
    @keyframes chipPulse{
      0%  { transform:scale(1);   box-shadow:0 0 0 0 var(--glow); }
      40% { transform:scale(1.08);box-shadow:0 0 0 6px var(--glow); border-color:var(--accent); color:var(--accent); }
      100%{ transform:scale(1);   box-shadow:0 0 0 0 transparent; }
    }
    .cat-chip.pulse{ animation:chipPulse .6s ease-out; }


    .subcat-chip{
      border:1px solid var(--line);background:var(--s2);color:var(--txt2);
      border-radius:999px;padding:8px 12px;font-size:.72rem;font-weight:800;
      white-space:nowrap;cursor:pointer;transition:all .18s;flex-shrink:0;
    }
    .subcat-chip:hover{border-color:var(--line2);color:var(--txt);}
    .subcat-chip.on{background:rgba(124,92,252,.16);border-color:var(--accent);color:var(--accent2);}
    .subcat-hint{font-size:.7rem;color:var(--txt3);margin-top:4px;}

    /* VIEW TOGGLE BUTTONS */
    .view-toggle{
      display:flex;background:var(--s2);border:1px solid var(--line);
      border-radius:10px;overflow:hidden;
    }
    .vtb{
      width:32px;height:32px;background:none;border:none;
      display:flex;align-items:center;justify-content:center;
      cursor:pointer;color:var(--txt3);transition:all .18s;
      font-size:.85rem;
    }
    .vtb:hover{color:var(--txt2);}
    .vtb.on{background:var(--accent);color:#fff;}

    /* CATEGORY BANNERS */
    .cat-grid{display:flex;flex-direction:column;gap:12px;margin-bottom:1.25rem;}
    /* CATEGORY GRID MODE */
    .cat-grid.grid-mode{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
    .cat-grid.grid-mode .cat-card{height:160px;border-radius:14px;}
    .cat-grid.grid-mode .cat-name{font-size:.95rem;}
    .cat-grid.grid-mode .cat-meta{font-size:.68rem;}
    .cat-grid.grid-mode .cat-badge{top:7px;right:7px;padding:4px 8px;font-size:.62rem;}
    .cat-card{
      position:relative;
      height:128px;border-radius:18px;
      overflow:hidden;
      background:linear-gradient(135deg,rgba(124,92,252,.18),rgba(155,127,254,.10));
      border:1px solid var(--line);
      cursor:pointer;
      box-shadow:0 10px 30px rgba(0,0,0,.22);
    }
    .cat-card img{
      width:100%;height:100%;object-fit:cover;display:block;
      transform:scale(1.01);
    }
    .cat-shade{
      position:absolute;inset:0;
      background:linear-gradient(90deg,rgba(0,0,0,.62),rgba(0,0,0,.20));
    }
    .cat-badge{
      position:absolute;top:10px;right:10px;
      background:rgba(255,255,255,.14);
      border:1px solid rgba(255,255,255,.18);
      border-radius:999px;
      padding:6px 10px;
      font-size:.7rem;font-weight:900;color:#fff;
      backdrop-filter:blur(10px);
    }
    .cat-txt{
      position:absolute;left:14px;bottom:14px;right:14px;
      display:flex;flex-direction:column;gap:4px;
    }
    .cat-name{
      font-size:1.35rem;font-weight:1000;letter-spacing:-.03em;
      text-transform:uppercase;
    }
    .cat-meta{font-size:.78rem;color:rgba(255,255,255,.86);font-weight:600;}
    .cat-card.noText .cat-shade{
      background:linear-gradient(180deg,rgba(0,0,0,.15),rgba(0,0,0,.45));
    }
    .cat-card.noText .cat-txt{display:none;}

    /* ==============================
       VISTA LISTA (original)
       ============================== */
    .prod-list{
      display:flex;flex-direction:column;
      border-radius:18px;overflow:hidden;background:var(--line);
      gap:1px;
    }
    .drag-handle{
      cursor:grab;
      padding:0 10px 0 4px;
      color:var(--txt3);
      font-size:1.1rem;
      line-height:1;
      flex-shrink:0;
      touch-action:none;
      user-select:none;
    }
    .drag-handle:active{ cursor:grabbing; }
    .row.dragging{
      opacity:.4;
    }
    .row.drag-over{
      border-top:2px solid var(--accent);
    }
    .prod-row{
      display:flex;gap:12px;align-items:flex-start;
      background:var(--s1);padding:.85rem 1rem;
      cursor:pointer;transition:background .15s;
    }
    .prod-row:hover{background:var(--s2);}
    .pimg{
      width:76px;height:76px;border-radius:12px;
      overflow:hidden;background:var(--s2);
      flex-shrink:0;position:relative;
    }
    .pimg img{width:100%;height:100%;object-fit:cover;display:block;}
    .pimg .ph{
      width:100%;height:100%;
      display:flex;align-items:center;justify-content:center;
      color:var(--txt3);font-size:.8rem;font-weight:800;
      background:linear-gradient(145deg,var(--s2),var(--s3));
    }
    .pinfo{flex:1;min-width:0;}
    .pname{
      font-size:.95rem;
      font-weight:900;
      color:var(--txt);
      line-height:1.25;
      display:-webkit-box;
      -webkit-line-clamp:2;
      -webkit-box-orient:vertical;
      overflow:hidden;
      margin-bottom:3px;
    }
    .pdesc{
      font-size:.72rem;color:var(--txt3);
      line-height:1.35;
      display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
      overflow:hidden;
      margin-bottom:.45rem;
    }
    .price-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
    .price{font-size:1.02rem;font-weight:1000;color:var(--txt);}
    .orig{font-size:.74rem;color:var(--txt3);text-decoration:line-through;}
    .pct{
      font-size:.65rem;font-weight:900;
      padding:2px 7px;border-radius:7px;
      background:rgba(34,197,94,.13);
      border:1px solid rgba(34,197,94,.22);
      color:var(--green);
    }
    /* ── Ambient Background ── */
    #ambient-bg{
      position:fixed;
      inset:0;
      z-index:0;
      pointer-events:none;
      transition:background 1.2s ease, opacity 1s ease;
      opacity:0;
    }
    #ambient-bg.active{ opacity:1; }
    body.catalog-active{ position:relative; }
    body.catalog-active .store-wrap,
    body.catalog-active #homeCats,
    body.catalog-active #catView{
      position:relative;
      z-index:1;
    }
    body.catalog-active header{ position:sticky; top:0; z-index:100; }

    /* ── Header modo catálogo ── */
    header.catalog-mode{
      justify-content:center;
      position:sticky;
      top:0;
      padding:16px 16px;
      border-bottom:none;
      box-shadow:none;
      z-index:100;
      transition:background .3s ease, backdrop-filter .3s ease, box-shadow .3s ease;
    }
    header.catalog-mode.scrolled{
      background:rgba(var(--bg-rgb,247,247,245),.5) !important;
      backdrop-filter:saturate(180%) blur(20px);
      -webkit-backdrop-filter:saturate(180%) blur(20px);
      box-shadow:0 1px 0 rgba(0,0,0,.06);
    }
    .hd-catalog-logo{
      display:flex;
      flex-direction:column;
      align-items:center;
      gap:0;
      cursor:pointer;
    }
    .hd-catalog-logo .hd-logo-cat-img{
      width:90px;height:90px;
      border-radius:0;
      background:none;
      box-shadow:none;
      display:flex;align-items:center;justify-content:center;
      overflow:hidden;
    }
    .hd-catalog-logo .hd-logo-cat-img img{
      width:100%;height:100%;object-fit:contain;display:block;
    }
    .hd-catalog-logo .hd-name{
      display:none;
    }
    .hd-catalog-logo .hd-name{
      font-size:.85rem;font-weight:800;
      max-width:none;white-space:nowrap;
    }
    .hd-hamburger{
      position:absolute;left:16px;top:50%;transform:translateY(-50%);
      background:none;border:none;
      width:38px;height:38px;
      display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
      cursor:pointer;padding:0;
    }
    .hd-hamburger span{ display:block;width:20px;height:1.5px;background:var(--txt);border-radius:2px; }
    .hd-cart-right{
      position:absolute;right:16px;top:50%;transform:translateY(-50%);
    }
    /* Menú desplegable categorías */
    #catalog-menu{
      position:fixed;top:0;left:0;right:0;z-index:400;
      background:var(--bg);
      border-bottom:1px solid var(--line);
      padding:0;
      max-height:0;
      overflow:hidden;
      transition:max-height .3s ease, padding .3s ease;
      box-shadow:0 8px 24px rgba(0,0,0,.2);
    }
    #catalog-menu.open{
      max-height:70vh;
      padding:8px 0 16px;
    }
    .catalog-menu-header{
      display:flex;align-items:center;justify-content:space-between;
      padding:14px 16px 10px;
      border-bottom:1px solid var(--line);
      margin-bottom:8px;
    }
    .catalog-menu-title{ font-size:.85rem;font-weight:800;color:var(--txt);text-transform:uppercase;letter-spacing:.06em; }
    .catalog-menu-close{ background:none;border:none;color:var(--txt);font-size:1.4rem;cursor:pointer;line-height:1;padding:0; }
    .catalog-menu-item{
      display:flex;align-items:center;gap:12px;
      padding:13px 16px;
      cursor:pointer;
      border-radius:12px;
      margin:0 8px;
      transition:background .15s;
    }
    .catalog-menu-item:active{ background:var(--s2); }
    .catalog-menu-item-img{
      width:40px;height:40px;border-radius:10px;
      object-fit:cover;background:var(--s3);flex-shrink:0;
      overflow:hidden;
    }
    .catalog-menu-item-img img{ width:100%;height:100%;object-fit:cover; }
    .catalog-menu-item-name{ font-size:.88rem;font-weight:700;color:var(--txt); }
    .catalog-menu-item-count{ font-size:.7rem;color:var(--txt3); }
    .catalog-menu-overlay{
      position:fixed;inset:0;z-index:399;
      background:rgba(0,0,0,.4);
      display:none;
    }
    .catalog-menu-overlay.open{ display:block; }

    /* ── Vista Catálogo ── */
    .prod-catalog{ display:grid; grid-template-columns:1fr 1fr; gap:0; padding:4px 0 16px; }
    .prod-catalog-card{
      background:var(--bg);
      border-radius:0;
      overflow:hidden;
      border:none;
      display:flex;
      flex-direction:column;
      cursor:pointer;
      transition:opacity .15s;
      padding:8px;
    }
    .prod-catalog-card:active{ opacity:.75; }
    .prod-catalog-img{
      width:100%;
      aspect-ratio:1/1;
      background:var(--s2);
      display:flex;
      align-items:center;
      justify-content:center;
      overflow:hidden;
      border-radius:10px;
    }
    .prod-catalog-img img{ width:100%; height:100%; object-fit:cover; border-radius:10px; }
    .prod-catalog-body{ padding:8px 2px 4px; display:flex; flex-direction:column; gap:2px; flex:1; }
    .prod-catalog-name{ font-size:.78rem; font-weight:500; color:var(--txt); line-height:1.3; }
    .prod-catalog-price{ font-size:.9rem; font-weight:900; color:var(--txt); margin-top:4px; }
    .prod-catalog-btn{
      margin-top:8px;
      width:36px;height:36px;
      padding:0;
      background:var(--accent);
      color:#fff;
      border:none;
      border-radius:10px;
      cursor:pointer;
      display:flex;
      align-items:center;
      justify-content:center;
      font-family:inherit;
      transition:opacity .15s;
      box-shadow:0 2px 8px var(--glow);
      flex-shrink:0;
    }
    .prod-catalog-btn:hover{ opacity:.85; }
    .prod-catalog-btn:disabled{ background:var(--s3);box-shadow:none;cursor:not-allowed; }
    .vtb-catalog svg{ width:15px; height:15px; }

    .addbtn{
      width:38px;height:38px;border-radius:12px;
      background:var(--accent);border:none;color:#fff;
      font-size:1.2rem;font-weight:300;
      cursor:pointer;transition:all .18s;
      display:flex;align-items:center;justify-content:center;
      box-shadow:0 0 12px var(--glow);
      flex-shrink:0;
    }
    .addbtn:hover{background:var(--accent2);transform:scale(1.06);}
    .addbtn:disabled{
      background:var(--s3);color:var(--txt3);
      box-shadow:none;cursor:not-allowed;transform:none;
    }
    .oos{
      position:absolute;inset:0;background:rgba(13,13,15,.72);
      display:flex;align-items:center;justify-content:center;
      color:var(--txt3);font-size:.62rem;font-weight:900;
      letter-spacing:.08em;text-transform:uppercase;
    }
    .empty{padding:2.8rem 1rem;text-align:center;color:var(--txt3);}
    .empty b{display:block;color:var(--txt);margin-top:.35rem}

    /* ==============================
       VISTA GRILLA (nueva)
       ============================== */
    .prod-grid{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:12px;
    }
    @media(min-width:600px){
      .prod-grid{ grid-template-columns:repeat(3,1fr); gap:16px; }
    }
    @media(min-width:900px){
      .prod-grid{ grid-template-columns:repeat(4,1fr); }
    }
    .prod-grid-card{
      background:var(--s1);
      border:1px solid var(--line);
      border-radius:18px;
      overflow:hidden;
      cursor:pointer;
      transition:transform .18s, border-color .18s, box-shadow .18s;
      display:flex;
      flex-direction:column;
      position:relative;
    }
    @media (hover: hover){
      .prod-grid-card:hover{
        transform:translateY(-3px);
        border-color:var(--line2);
        box-shadow:0 12px 32px rgba(0,0,0,.35);
      }
    }
    .prod-grid-card:active{
      transform:translateY(-2px);
      box-shadow:0 6px 18px rgba(0,0,0,.22);
    }
    .pgimg{
      width:100%;
      aspect-ratio:1/1;
      position:relative;
      overflow:hidden;
      background:var(--s2);
      flex-shrink:0;
    }
    .pgimg img{
      width:100%;height:100%;
      object-fit:cover;display:block;
      transition:transform .35s;
    }
    @media (hover: hover){
      .prod-grid-card:hover .pgimg img{transform:scale(1.05);}
    }
    .pgimg .ph{
      width:100%;height:100%;
      display:flex;align-items:center;justify-content:center;
      color:var(--txt3);font-size:.75rem;font-weight:800;
      background:linear-gradient(145deg,var(--s2),var(--s3));
    }
    .pgimg .oos{font-size:.58rem;}

    /* ── Vista portrait (vertical) ── */
    #catGrid.portrait-mode .pgimg { aspect-ratio: 3/4; }
    #catGrid.portrait-mode .prod-grid-card { border-radius:14px; }
    #catGrid.portrait-mode .pg-body { padding:.6rem .75rem .75rem; }
    #catGrid.portrait-mode .pg-name { font-size:.78rem; }
    #catGrid.portrait-mode .pg-price { font-size:.88rem; }
    #catGrid.portrait-mode .pg-addbtn { font-size:.72rem; padding:7px 10px; border-radius:8px; margin-top:6px; }
    .pg-pct-badge{
      position:absolute;top:8px;right:8px;
      background:var(--accent);
      border-radius:8px;padding:3px 8px;
      font-size:.62rem;font-weight:900;color:#fff;
      z-index:2;
    }

    /* ══════════════════════════════════════
       BADGE SYSTEM v2 — pill + SVG + blur
       Todos comparten base .cy-badge
    ══════════════════════════════════════ */
    .cy-badge {
      position:absolute; top:8px; right:8px; z-index:10;
      border-radius:100px; padding:5px 10px;
      font-size:.61rem; font-weight:700; letter-spacing:.01em;
      display:inline-flex; align-items:center; gap:5px;
      backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
      white-space:nowrap; pointer-events:none; line-height:1;
      font-family:'Plus Jakarta Sans',sans-serif;
      border:1px solid rgba(0,0,0,.06);
      box-shadow:0 2px 8px rgba(0,0,0,.08);
    }
    .cy-badge svg { flex-shrink:0; }

    /* Badge inline para vista lista — sin position absolute */
    .cy-badge-inline {
      position:static !important;
      display:inline-flex !important; align-items:center; gap:5px;
      width:fit-content !important; max-width:180px;
      border-radius:100px; padding:5px 10px;
      font-size:.61rem; font-weight:700; letter-spacing:.01em;
      white-space:nowrap; pointer-events:none; line-height:1;
      font-family:'Plus Jakarta Sans',sans-serif;
      backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
      border:1px solid rgba(0,0,0,.06);
      box-shadow:0 1px 6px rgba(0,0,0,.07);
    }
    .cy-badge-inline svg { flex-shrink:0; }

    /* Manual badge — mismo base */
    .cy-manual-badge {
      position:absolute; top:8px; right:8px; z-index:4;
      border-radius:100px; padding:5px 10px;
      font-size:.61rem; font-weight:700; letter-spacing:.01em;
      display:inline-flex; align-items:center; gap:5px;
      backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
      pointer-events:none; line-height:1; white-space:nowrap;
      font-family:'Plus Jakarta Sans',sans-serif;
      border:1px solid rgba(0,0,0,.06);
      box-shadow:0 2px 8px rgba(0,0,0,.08);
    }

    /* ── NUEVO — punto violeta, pill blanco translúcido ── */
    .cy-badge-nuevo {
      background:rgba(255,255,255,.92); color:#6d4fc2;
      border-color:rgba(109,79,194,.14);
    }
    .cy-badge-nuevo .cy-dot {
      width:7px; height:7px; border-radius:50%;
      background:#7c5cfc; flex-shrink:0; display:inline-block;
    }

    /* ── MÁS VENDIDO — trofeo, dorado cálido ── */
    .cy-badge-bestseller {
      background:rgba(255,248,225,.95); color:#92690a;
      border-color:rgba(180,130,20,.16);
    }

    /* ── HOT SALE — rayo, rojo con pulso ── */
    .cy-badge-hotsale {
      background:rgba(220,38,38,.92); color:#fff;
      border-color:transparent;
      box-shadow:0 2px 10px rgba(220,38,38,.32);
      animation:cy-hs-pulse 2.2s ease-in-out infinite;
    }
    @keyframes cy-hs-pulse {
      0%,100% { box-shadow:0 2px 10px rgba(220,38,38,.32); }
      50%      { box-shadow:0 2px 18px rgba(220,38,38,.58); }
    }

    /* ── ÚLTIMAS UNIDADES — fuego, naranja con pulso ── */
    .cy-badge-ultimas {
      background:rgba(249,115,22,.9); color:#fff;
      border-color:transparent;
      box-shadow:0 2px 8px rgba(249,115,22,.28);
      animation:cy-ult-pulse 2.4s ease-in-out infinite;
    }
    @keyframes cy-ult-pulse {
      0%,100% { box-shadow:0 2px 8px rgba(249,115,22,.28); }
      50%      { box-shadow:0 2px 16px rgba(249,115,22,.52); }
    }

    /* ── OFERTA — tag verde ── */
    .cy-badge-sale {
      background:rgba(22,163,74,.9); color:#fff;
      border-color:transparent;
      box-shadow:0 2px 8px rgba(22,163,74,.25);
    }

    /* ── EXCLUSIVO — estrella, azul pill ── */
    .cy-badge-exclusivo {
      background:rgba(255,255,255,.92); color:#1a56db;
      border-color:rgba(26,86,219,.14);
    }

    /* ── PROMOCIÓN — regalo, violeta suave ── */
    .cy-badge-promo {
      background:rgba(124,92,252,.1); color:#6d4fc2;
      border-color:rgba(124,92,252,.18);
    }

    /* ── PREMIUM — dorado degradado ── */
    .cy-badge-premium {
      background:linear-gradient(135deg,#92690a,#c8960c);
      color:#fff; border-color:transparent;
      box-shadow:0 2px 10px rgba(180,130,20,.28);
    }

    /* ── INFO / SIN TACC — verde ── */
    .cy-badge-info {
      background:rgba(22,163,74,.9); color:#fff;
      border-color:transparent;
      box-shadow:0 2px 8px rgba(22,163,74,.25);
    }

    /* Pulse genérico para badges custom */
    .cy-badge-pulse { animation:cy-generic-pulse 2.4s ease-in-out infinite; }
    @keyframes cy-generic-pulse {
      0%,100% { opacity:1; }
      50%      { opacity:.82; }
    }

    /* Legado — removido el cy-hs-fire/text, ya no se usa */
    .cy-hs-fire { display:none; }
    .cy-hs-text { display:none; }
    .pg-body{
      padding:.75rem .8rem .85rem;
      display:flex;flex-direction:column;
      gap:6px;flex:1;
    }
    .pg-name{
      font-size:.82rem;font-weight:800;color:var(--txt);
      line-height:1.3;
      display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
      overflow:hidden;
    }
    .pg-price-row{
      display:flex;align-items:center;gap:6px;flex-wrap:wrap;
      margin-top:auto;
    }
    .pg-price{font-size:.95rem;font-weight:1000;color:var(--txt);}
    .pg-orig{font-size:.7rem;color:var(--txt3);text-decoration:line-through;}
    /* ══════════════════════════════════════
       ESTILOS DE BOTÓN DE COMPRA
       .pg-addbtn = grilla + catálogo
       .addbtn    = vista lista (siempre compacto)
       ══════════════════════════════════════ */

    /* Base grilla/catálogo */
    .pg-addbtn .btn-icon { display:flex;align-items:center;flex-shrink:0; }
    .pg-addbtn .btn-txt  { display:block; }

    /* ── LISTA: todos compactos con solo ícono ── */
    .addbtn {
      display:flex!important;align-items:center!important;
      justify-content:center!important;
    }
    body.btn-pill .addbtn,
    body.btn-ghost .addbtn,
    body.btn-comprar .addbtn,
    body.btn-agregar .addbtn,
    body.btn-glass .addbtn {
      width:44px!important;height:44px!important;
      border-radius:12px!important;font-size:0!important;
      padding:0!important;gap:0!important;
    }
    body.btn-pill .addbtn    { background:var(--accent)!important;border:none!important; }
    body.btn-ghost .addbtn   { background:transparent!important;border:1.5px solid var(--accent)!important; }
    body.btn-comprar .addbtn { background:var(--accent)!important;border:none!important; }
    body.btn-agregar .addbtn { background:transparent!important;border:none!important;border-bottom:1.5px solid var(--accent)!important; }
    body.btn-glass .addbtn   { background:color-mix(in srgb,var(--accent) 18%,transparent)!important;border:1px solid color-mix(in srgb,var(--accent) 35%,transparent)!important;backdrop-filter:blur(10px)!important; }
    body.btn-pill .addbtn svg,
    body.btn-ghost .addbtn svg,
    body.btn-comprar .addbtn svg,
    body.btn-agregar .addbtn svg,
    body.btn-glass .addbtn svg { display:block!important;width:18px!important;height:18px!important; }

    /* ── GRILLA + CATÁLOGO ── */

    /* PILL */
    body.btn-pill .pg-addbtn {
      width:100%;border-radius:100px;background:var(--accent);color:#fff;
      border:none;font-size:.78rem;font-weight:800;height:36px;
      box-shadow:0 4px 12px rgba(0,0,0,.15);
      display:flex;align-items:center;justify-content:center;gap:5px;
    }
    body.btn-pill .pg-addbtn .btn-icon { display:none; }

    /* MINIMAL */
    body.btn-minimal .pg-addbtn {
      width:36px;height:36px;border-radius:8px;padding:0;
      background:transparent;border:1.5px solid var(--accent);
      color:var(--accent);display:flex;align-items:center;justify-content:center;
    }
    body.btn-minimal .pg-addbtn .btn-txt { display:none; }
    body.btn-minimal .addbtn { background:transparent!important;border:1.5px solid var(--accent)!important; }

    /* ROUND */
    body.btn-round .pg-addbtn {
      width:40px;height:40px;border-radius:50%;padding:0;
      background:var(--accent);color:#fff;border:none;
      display:flex;align-items:center;justify-content:center;
      box-shadow:0 4px 12px rgba(0,0,0,.2);
    }
    body.btn-round .pg-addbtn .btn-txt { display:none; }

    /* GHOST */
    body.btn-ghost .pg-addbtn {
      width:100%;border-radius:10px;background:transparent;
      border:1.5px solid var(--accent);color:var(--accent);
      font-size:.78rem;font-weight:800;height:36px;
      display:flex;align-items:center;justify-content:center;gap:5px;
    }
    body.btn-ghost .pg-addbtn .btn-icon { display:none; }

    /* COMPRAR */
    body.btn-comprar .pg-addbtn {
      width:100%;border-radius:10px;background:var(--accent);color:#fff;
      border:none;height:36px;
      box-shadow:0 4px 12px rgba(0,0,0,.15);
      display:flex;align-items:center;justify-content:center;
    }
    body.btn-comprar .pg-addbtn .btn-icon { display:none; }
    body.btn-comprar .pg-addbtn .btn-txt  { font-size:0; }
    body.btn-comprar .pg-addbtn .btn-txt::before { content:'Comprar';font-size:.8rem;font-weight:800; }

    /* AGREGAR */
    body.btn-agregar .pg-addbtn {
      width:100%;border-radius:10px;background:transparent;color:var(--accent);
      border:none;border-bottom:1.5px solid var(--accent);height:36px;
      display:flex;align-items:center;justify-content:center;
    }
    body.btn-agregar .pg-addbtn .btn-icon { display:none; }
    body.btn-agregar .pg-addbtn .btn-txt  { font-size:0; }
    body.btn-agregar .pg-addbtn .btn-txt::before { content:'Agregar';font-size:.8rem;font-weight:700; }

    /* GLASS */
    body.btn-glass .pg-addbtn {
      width:100%;border-radius:10px;height:36px;
      background:color-mix(in srgb,var(--accent) 18%,transparent);
      border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);
      color:var(--accent);font-size:.78rem;font-weight:800;
      backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
      display:flex;align-items:center;justify-content:center;gap:5px;
    }
    body.btn-glass .pg-addbtn .btn-icon { display:none; }

    .pg-addbtn{
      width:100%;
      margin-top:8px;
      padding:.55rem;
      background:var(--accent);border:none;
      border-radius:10px;color:#fff;
      font-size:.78rem;font-weight:800;
      cursor:pointer;transition:all .18s;
      display:flex;align-items:center;justify-content:center;gap:5px;
      box-shadow:0 0 10px var(--glow);
    }
    .pg-addbtn:hover{background:var(--accent2);transform:translateY(-1px);}
    .pg-addbtn:disabled{
      background:var(--s3);color:var(--txt3);
      box-shadow:none;cursor:not-allowed;transform:none;
    }
    .pg-addbtn.oos-btn{
      background:var(--s3);color:var(--txt3);
      box-shadow:none;cursor:not-allowed;
    }

    /* CART DRAWER */
    #c-ov{position:fixed;inset:0;background:rgba(0,0,0,.6);backdrop-filter:blur(8px);z-index:400;display:none;}
    #c-ov.open{display:block;}
    #c-drw{
      position:fixed;right:0;top:0;bottom:0;width:min(410px,100vw);
      background:var(--s1);border-left:1px solid var(--line);
      z-index:401;display:flex;flex-direction:column;
      transform:translateX(110%);transition:transform .35s cubic-bezier(.32,.72,0,1);
    }
    #c-drw.open{transform:translateX(0);}
    .c-head{padding:1.1rem 1.4rem;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;}
    .c-scroll{flex:1;overflow-y:auto;display:flex;flex-direction:column;}
    .c-head h3{font-size:1rem;font-weight:1000;}
    .c-close{
      background:var(--s2);border:1px solid var(--line);border-radius:50%;
      width:30px;height:30px;cursor:pointer;font-size:.85rem;
      display:flex;align-items:center;justify-content:center;color:var(--txt2);
      transition:all .18s;
    }
    .c-close:hover{border-color:var(--line2);color:var(--txt);}
    .c-body{padding:1.05rem 1rem 1rem;display:flex;flex-direction:column;gap:16px;}
    .ci{
      display:grid;
      grid-template-columns:82px 1fr;
      grid-template-areas:
        "img info"
        "img actions";
      gap:12px;
      align-items:start;
      background:var(--s2);
      border:1px solid var(--line);
      border-radius:20px;
      padding:1rem;
      overflow:visible;
      height:auto;
      box-shadow:0 6px 18px rgba(0,0,0,.16);
    }
    .ci-img{grid-area:img;width:82px;height:82px;border-radius:16px;overflow:hidden;background:var(--s3);flex-shrink:0;}
    .ci-img img{width:100%;height:100%;object-fit:cover;display:block;}
    .ci-info{grid-area:info;min-width:0;}
    .ci-name{font-size:1.04rem;font-weight:900;line-height:1.18;color:var(--txt);word-break:break-word;}
    .ci-var{font-size:.75rem;color:var(--txt3);margin-top:4px;line-height:1.3;}
    .ci-price{font-size:1.18rem;color:var(--accent2);font-weight:1000;margin-top:8px;line-height:1;}
    .ci-actions{
      margin-top:10px;
      grid-area:actions;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
      flex-wrap:wrap;
      min-width:0;
    }
    .ci-qty{display:flex;align-items:center;gap:10px;flex-wrap:nowrap;}
    .ciqb{
      width:44px;height:44px;border-radius:14px;background:var(--s3);
      border:1px solid var(--line2);color:var(--txt);font-size:1.45rem;font-weight:900;
      cursor:pointer;display:flex;align-items:center;justify-content:center;
      transition:all .15s;flex-shrink:0;
    }
    .ciqb:hover{border-color:var(--accent);color:var(--accent);}
    .ci-qn{font-size:1.1rem;font-weight:1000;min-width:26px;text-align:center;color:var(--txt);}
    .ci-x{
      background:rgba(239,68,68,.12);
      border:1px solid rgba(239,68,68,.35);
      color:#ff9a9a;
      cursor:pointer;
      font-size:.95rem;
      font-weight:900;
      border-radius:14px;
      padding:.72rem 1rem;
      transition:all .18s;
      flex-shrink:0;
      min-width:104px;
    }
    .ci-x:hover{background:rgba(239,68,68,.18);color:#fff;border-color:rgba(239,68,68,.55);}
    .c-empty{text-align:center;padding:3rem 1rem;color:var(--txt3);}
    @media(max-width:420px){
      .c-body{padding:1rem .9rem .9rem;}
      .ci{grid-template-columns:74px minmax(0,1fr);padding:.9rem;gap:10px;}
      .ci-img{width:74px;height:74px;}
      .ci-name{font-size:.96rem;}
      .ci-price{font-size:1.08rem;}
      .ciqb{width:40px;height:40px;font-size:1.3rem;}
      .ci-x{min-width:92px;padding:.66rem .85rem;font-size:.9rem;}
    }

    .c-sec{padding:0 1.4rem .9rem;}
    .c-lbl{font-size:.6rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:var(--txt3);margin-bottom:7px;}
    .del-opts{display:grid;gap:6px;}
    .del-opt{
      border:1px solid var(--line);border-radius:12px;padding:9px 11px;
      cursor:pointer;transition:all .15s;display:flex;align-items:center;gap:10px;background:var(--s2);
    }
    .del-opt:hover{border-color:var(--line2);}
    .del-opt.on{border-color:var(--accent);background:rgba(124,92,252,.08);}
    .del-opt-t strong{font-size:.8rem;display:block;font-weight:800;}
    .del-opt-t span{font-size:.67rem;color:var(--txt3);}

    .cust-f{display:grid;gap:6px;}
    .cf{
      width:100%;background:var(--s2);border:1px solid var(--line);
      border-radius:12px;padding:.58rem .82rem;font-size:.82rem;color:var(--txt);
      outline:none;transition:border-color .2s,box-shadow .2s;
    }
    .cf:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--glow);}
    .cf::placeholder{color:var(--txt3);}

    .pay-opts{display:flex;flex-wrap:wrap;gap:6px;}
    .pay-opt{
      border:1px solid var(--line);border-radius:10px;padding:6px 12px;
      font-size:.72rem;font-weight:800;color:var(--txt2);
      cursor:pointer;transition:all .15s;background:var(--s2);
    }
    .pay-opt:hover{border-color:var(--line2);}
    .pay-opt.on{border-color:var(--accent);background:rgba(124,92,252,.15);color:var(--accent2);}

    .c-foot{padding:1.1rem 1.4rem calc(1.1rem + env(safe-area-inset-bottom)) 1.4rem;border-top:1px solid var(--line);flex-shrink:0;}
    .sum-row{display:flex;justify-content:space-between;font-size:.78rem;color:var(--txt2);margin-bottom:5px;}
    .sum-row.tot{font-size:1.08rem;font-weight:1000;color:var(--txt);border-top:1px solid var(--line);margin-top:8px;padding-top:8px;}
    .wa-btn{
      display:flex;align-items:center;justify-content:center;gap:8px;width:100%;
      margin-top:.9rem;background:var(--accent);
      border:none;border-radius:16px;padding:.9rem;font-size:.82rem;font-weight:900;color:#fff;
      cursor:pointer;text-decoration:none;transition:opacity .2s,transform .1s;
      letter-spacing:.02em;
    }
    .wa-btn:hover{opacity:.9;transform:translateY(-1px);}

    /* ADMIN */
    #adm-wrap{max-width:720px;margin:0 auto;padding:1.2rem 1rem 7rem;}
    .adm-title{font-size:1.3rem;font-weight:1000;letter-spacing:-.02em;margin-bottom:1rem;}
    .adm-tabs{
      display:flex;background:var(--s1);border:1px solid var(--line);
      border-radius:18px;overflow:hidden;margin-bottom:1.2rem;flex-wrap:wrap;
    }
    .atb{
      flex:1;min-width:90px;background:none;border:none;border-right:1px solid var(--line);
      padding:9px 6px;font-size:.65rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase;
      color:var(--txt3);cursor:pointer;transition:all .18s;
    }
    .atb:last-child{border-right:none;}
    .atb:hover{background:var(--s2);color:var(--txt2);}
    .atb.on{background:var(--accent);color:#fff;box-shadow:0 0 10px var(--glow);}
    .adm-tab{display:none;}
    .adm-tab.on{display:block;}
    .acard{
      background:var(--s1);border:1px solid var(--line);
      border-radius:18px;padding:1.15rem;margin-bottom:.9rem;
    }
    .acard h4{font-size:.9rem;font-weight:1000;margin-bottom:.9rem;}
    .fg{display:grid;gap:.75rem;}
    .fr{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;}
    .fl label{
      display:block;font-size:.6rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase;
      color:var(--txt3);margin-bottom:5px;
    }
    .fl input,.fl select,.fl textarea{
      width:100%;background:var(--s2);border:1px solid var(--line);
      border-radius:12px;padding:.6rem .82rem;font-size:.82rem;color:var(--txt);outline:none;
      transition:border-color .2s,box-shadow .2s;
    }
    .fl input:focus,.fl select:focus,.fl textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--glow);}
    .fl textarea{min-height:70px;resize:vertical;}
    .btn-row{display:flex;gap:8px;margin-top:.9rem;flex-wrap:wrap;}
    .btn-p{
      background:linear-gradient(135deg,var(--accent),var(--accent2));
      border:none;border-radius:12px;padding:.7rem 1.2rem;font-size:.78rem;font-weight:900;color:#fff;
      cursor:pointer;transition:opacity .2s,transform .1s;box-shadow:0 2px 12px var(--glow);
    }
    .btn-p:hover{opacity:.9;transform:translateY(-1px);}
    .btn-s{
      background:var(--s2);border:1px solid var(--line);
      border-radius:12px;padding:.7rem 1.2rem;font-size:.78rem;font-weight:800;color:var(--txt2);
      cursor:pointer;transition:all .18s;
    }
    .btn-s:hover{border-color:var(--line2);color:var(--txt);}
    .btn-d{
      background:none;border:none;color:var(--line2);
      cursor:pointer;font-size:.9rem;padding:3px;transition:color .18s;
    }
    .btn-d:hover{color:var(--red);}

    .plist{display:flex;flex-direction:column;gap:8px;}
    .row{
      background:var(--s2);border:1px solid var(--line);
      border-radius:16px;padding:.85rem;
      display:flex;align-items:center;gap:10px;justify-content:space-between;
    }
    .row-l{min-width:0;}
    .row-l strong{display:block;font-size:.88rem;font-weight:1000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    .row-l span{display:block;font-size:.72rem;color:var(--txt3);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    .row-r{display:flex;gap:6px;align-items:center;flex-shrink:0;}
    .mini{font-size:.75rem;color:var(--txt3);text-align:center;padding:1rem 0;}

    /* Theme UI */
    .paletteRow{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px;}
    .palBtn{
      border:1px solid var(--line);background:var(--s2);color:var(--txt2);
      font-weight:900;font-size:.72rem;padding:8px 10px;border-radius:12px;
      cursor:pointer;transition:all .18s;display:flex;align-items:center;gap:8px;
    }
    .palBtn:hover{border-color:var(--line2);color:var(--txt);}
    .sw{width:18px;height:18px;border-radius:6px;border:1px solid rgba(255,255,255,.14);}

    /* FLOAT NAV */
    /* ── Buscador global ── */
    #global-search-wrap{
      padding:10px 16px 4px;
      display:none;
    }
    #global-search-wrap.visible{ display:block; }
    #global-search-box{
      display:flex;align-items:center;gap:10px;
      background:var(--s2);border:1.5px solid var(--line);
      border-radius:14px;padding:10px 14px;
      transition:border-color .2s;
    }
    #global-search-box:focus-within{ border-color:var(--accent); }
    #global-search-box span{ font-size:1rem;color:var(--txt3); }
    #global-search-input{
      flex:1;background:none;border:none;outline:none;
      font-size:.85rem;color:var(--txt);font-family:inherit;
    }
    #global-search-input::placeholder{ color:var(--txt3); }
    #global-search-results{
      display:none;flex-direction:column;gap:6px;
      padding:8px 16px 4px;
    }
    #global-search-results.has-results{ display:flex; }
    .gs-result{
      display:flex;align-items:center;gap:12px;
      background:var(--s1);border:1px solid var(--line);
      border-radius:12px;padding:10px 12px;cursor:pointer;
      transition:background .15s;
      -webkit-tap-highlight-color:transparent;
    }
    .gs-result:active{ background:var(--s2); }
    .gs-result-img{
      width:44px;height:44px;border-radius:8px;
      object-fit:cover;background:var(--s2);flex-shrink:0;
    }
    .gs-result-name{ font-size:.82rem;font-weight:700;color:var(--txt);flex:1; }
    .gs-result-price{ font-size:.78rem;font-weight:800;color:var(--accent2); }
    .gs-no-results{
      text-align:center;font-size:.78rem;color:var(--txt3);
      padding:12px 0;display:none;
    }
    .gs-no-results.visible{ display:block; }

    /* ── NAV FLOTANTE GLASS ── */
    /* ── NAV SIMPLE (default) ── */
    .fnav{
      position:fixed;bottom:0;left:0;right:0;z-index:200;
      background:rgba(13,13,15,.42);backdrop-filter:blur(32px) saturate(1.8);-webkit-backdrop-filter:blur(32px) saturate(1.8);
      border-top:1px solid rgba(255,255,255,.07);
      display:flex;padding:.45rem 0 calc(.45rem + env(safe-area-inset-bottom));
    }
    .fn{
      flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;
      background:none;border:none;cursor:pointer;padding:5px 0;
      color:var(--txt3);transition:color .18s;
    }
    .fn.on{color:var(--accent);}
    .fn-i{font-size:1.1rem;}
    .fn-l{font-size:.56rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;}

    /* ── NAV EXPANDIDA — flotante glass (solo cuando módulo está ON) ── */
    .fnav.fnav-expanded{
      bottom:12px;left:12px;right:12px;
      background:rgba(20,20,22,.38);
      backdrop-filter:blur(40px) saturate(200%);
      -webkit-backdrop-filter:blur(40px) saturate(200%);
      border:1px solid rgba(255,255,255,.08);
      border-top:none;
      border-radius:22px;
      padding:.4rem 0 .4rem;
      box-shadow:0 8px 32px rgba(0,0,0,.18), 0 2px 8px rgba(0,0,0,.1);
    }
    body.light-mode .fnav.fnav-expanded{
      background:rgba(248,248,250,.48);
      border-color:rgba(0,0,0,.06);
      box-shadow:0 8px 32px rgba(0,0,0,.08), 0 2px 8px rgba(0,0,0,.05);
    }
    .fnav.fnav-expanded .fn{
      gap:2px;padding:4px 0;
      color:rgba(255,255,255,.45);
    }
    body.light-mode .fnav.fnav-expanded .fn{ color:rgba(0,0,0,.38); }
    .fnav.fnav-expanded .fn.on{ color:#fff; }
    body.light-mode .fnav.fnav-expanded .fn.on{ color:var(--accent); }
    .fnav.fnav-expanded .fn-i svg{
      width:22px;height:22px;
      stroke:currentColor;fill:none;
      stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;
      transition:stroke .18s;
    }
    .fnav.fnav-expanded .fn.on .fn-i svg{ stroke-width:2.4; }
    .fnav.fnav-expanded .fn-l{ font-size:.52rem;font-weight:700;letter-spacing:.04em; }

    /* SHARE + QR MODAL */
    #share-ov{position:fixed;inset:0;background:rgba(0,0,0,.5);backdrop-filter:blur(6px);z-index:500;display:none;align-items:flex-end;justify-content:center;}
    #share-ov.open{display:flex;}
    #share-box{background:var(--s1);border:1px solid var(--line);border-radius:24px 24px 0 0;padding:20px 20px calc(20px + env(safe-area-inset-bottom));width:100%;max-width:480px;}
    .share-handle{width:36px;height:4px;border-radius:2px;background:var(--line2);margin:0 auto 20px;}
    .share-title{font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--txt3);margin-bottom:14px;text-align:center;}
    .share-opts{display:flex;flex-direction:column;gap:8px;}
    .share-opt{display:flex;align-items:center;gap:14px;padding:14px 16px;background:var(--s2);border:1px solid var(--line);border-radius:14px;cursor:pointer;transition:.15s;}
    .share-opt:active{opacity:.7;}
    .share-opt-icon{font-size:1.3rem;width:28px;text-align:center;}
    .share-opt-label{font-size:.9rem;font-weight:700;color:var(--txt);}
    .share-opt-sub{font-size:.72rem;color:var(--txt3);margin-top:1px;}
    #qr-ov{position:fixed;inset:0;background:rgba(0,0,0,.6);backdrop-filter:blur(8px);z-index:501;display:none;align-items:center;justify-content:center;}
    #qr-ov.open{display:flex;}
    #qr-box{background:var(--s1);border:1px solid var(--line);border-radius:24px;padding:32px 28px;text-align:center;max-width:320px;width:90%;position:relative;}
    #qr-box h3{font-size:1rem;font-weight:800;margin-bottom:6px;color:var(--txt);}
    #qr-box p{font-size:.75rem;color:var(--txt2);margin-bottom:20px;word-break:break-all;}
    #qr-canvas{border-radius:12px;background:#fff;padding:12px;display:block;margin:0 auto;}
    .qr-actions{display:flex;gap:10px;margin-top:20px;justify-content:center;}
    .qr-btn{background:var(--accent);color:#fff;border:none;border-radius:12px;padding:10px 20px;font-size:.82rem;font-weight:700;cursor:pointer;font-family:inherit;}
    .qr-btn.sec{background:var(--s2);color:var(--txt);border:1px solid var(--line);}
    .qr-close{position:absolute;top:12px;right:12px;background:var(--s2);border:1px solid var(--line);border-radius:50%;width:28px;height:28px;cursor:pointer;font-size:.8rem;display:flex;align-items:center;justify-content:center;color:var(--txt2);}

    /* TOAST */
    #toast{
      position:fixed;bottom:5.5rem;left:50%;
      transform:translateX(-50%) translateY(10px);
      background:var(--s2);border:1px solid var(--line);
      color:var(--txt);padding:.55rem 1rem;border-radius:999px;
      font-size:.75rem;font-weight:800;z-index:900;
      opacity:0;transition:opacity .22s,transform .22s;
      pointer-events:none;white-space:nowrap;box-shadow:0 4px 18px rgba(0,0,0,.4);
    }
    #toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

    /* Panel "Agregado al carrito" estilo Tiendanube */
    #added-panel{
      position:fixed;top:0;left:0;right:0;z-index:1000;
      background:var(--bg);
      border-bottom:1px solid var(--line);
      box-shadow:0 4px 24px rgba(0,0,0,.15);
      display:flex;align-items:center;gap:12px;
      padding:14px 16px;
      transform:translateY(-100%);
      transition:transform .3s cubic-bezier(.4,0,.2,1);
    }
    #added-panel.show{ transform:translateY(0); }
    #added-panel-img{
      width:56px;height:56px;border-radius:10px;
      object-fit:cover;background:var(--s2);flex-shrink:0;overflow:hidden;
    }
    #added-panel-img img{ width:100%;height:100%;object-fit:cover; }
    #added-panel-info{ flex:1;min-width:0; }
    #added-panel-name{ font-size:.82rem;font-weight:700;color:var(--txt);white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
    #added-panel-price{ font-size:.78rem;color:var(--txt2);margin-top:1px; }
    #added-panel-ok{ font-size:.82rem;font-weight:800;color:#22c55e;margin-top:3px; }
    #added-panel-close{ background:none;border:none;color:var(--txt3);font-size:1.3rem;cursor:pointer;flex-shrink:0;line-height:1; }
    /* Badge sin stock en catálogo */
    .catalog-oos-badge{
      position:absolute;top:8px;right:8px;
      background:#1a1a1a;color:#fff;
      font-size:.65rem;font-weight:800;
      padding:3px 10px;border-radius:4px;
      letter-spacing:.03em;
      pointer-events:none;
    }

    /* PRODUCT MODAL */
    /* ── GUÍA DE TALLAS ── */
    #size-chart-ov{
      position:fixed;inset:0;background:rgba(0,0,0,.6);
      backdrop-filter:blur(8px);z-index:600;
      display:none;align-items:flex-end;justify-content:center;
    }
    #size-chart-ov.open{display:flex;}
    #size-chart-box{
      background:var(--s1);border-radius:24px 24px 0 0;
      width:100%;max-width:520px;max-height:80vh;
      display:flex;flex-direction:column;overflow:hidden;
      transform:translateY(100%);
      transition:transform .35s cubic-bezier(.32,1,.6,1);
      box-shadow:0 -8px 40px rgba(0,0,0,.3);
    }
    #size-chart-ov.open #size-chart-box{transform:translateY(0);}
    .sc-handle{width:36px;height:4px;background:var(--line2);border-radius:100px;margin:12px auto 0;cursor:pointer;flex-shrink:0;}
    .sc-header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px 10px;flex-shrink:0;border-bottom:1px solid var(--line);}
    .sc-title{font-size:.95rem;font-weight:800;}
    .sc-close{background:var(--s2);border:1px solid var(--line);border-radius:50%;width:30px;height:30px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:.8rem;color:var(--txt2);}
    .sc-body{overflow-y:auto;padding:14px 16px 28px;-webkit-overflow-scrolling:touch;}
    .sc-body::-webkit-scrollbar{display:none;}
    .sc-hint{font-size:.72rem;color:var(--txt3);margin-bottom:12px;line-height:1.5;}
    .sc-table{width:100%;border-collapse:collapse;font-size:.78rem;}
    .sc-table th{background:var(--s2);color:var(--txt2);font-weight:800;font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;padding:8px 10px;text-align:left;border-bottom:1px solid var(--line);}
    .sc-table td{padding:9px 10px;border-bottom:1px solid var(--line);color:var(--txt);font-weight:500;}
    .sc-table tr:last-child td{border-bottom:none;}
    .sc-table tr:nth-child(even) td{background:rgba(255,255,255,.02);}
    .sc-tab-row{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap;}
    .sc-tab{padding:5px 12px;border-radius:100px;font-size:.72rem;font-weight:800;cursor:pointer;border:1px solid var(--line);background:var(--s2);color:var(--txt2);transition:all .15s;}
    .sc-tab.on{background:var(--accent);border-color:var(--accent);color:#fff;}
    /* Botón en modal */
    .size-chart-btn{
      display:inline-flex;align-items:center;gap:5px;
      font-size:.72rem;font-weight:800;color:var(--accent2);
      background:rgba(124,92,252,.1);border:1px solid rgba(124,92,252,.2);
      border-radius:100px;padding:4px 12px;cursor:pointer;
      margin-bottom:10px;transition:all .15s;
      text-decoration:none;
    }
    .size-chart-btn:hover{background:rgba(124,92,252,.18);}

    /* ── MODAL / BOTTOM SHEET ── */
    #mod-ov{
      position:fixed;inset:0;
      background:rgba(0,0,0,.45);
      backdrop-filter:blur(6px);
      -webkit-backdrop-filter:blur(6px);
      z-index:500;display:none;
      align-items:flex-end;justify-content:center;
    }
    #mod-ov.open{display:flex;}
    #mod-box{
      background:#fff;
      border-radius:24px 24px 0 0;
      width:100%;max-width:520px;
      height:88vh;
      display:flex;flex-direction:column;
      overflow:hidden;
      transform:translateY(100%);
      transition:transform .35s cubic-bezier(.32,1.1,.6,1);
      box-shadow:0 -8px 40px rgba(0,0,0,.12);
    }
    body.light-mode #mod-box{ background:#fff; }
    #mod-ov.open #mod-box{transform:translateY(0);}

    .mod-handle{
      width:36px;height:4px;
      background:rgba(0,0,0,.1);border-radius:100px;
      margin:10px auto 0;flex-shrink:0;cursor:pointer;
    }

    /* ── Grid dos columnas ── */
    /* ── Grid dos columnas ── */
    .mod-top-grid{
      display:grid;
      grid-template-columns:52% 48%;
      gap:0;
      flex-shrink:0;
      background:#fff;
    }
    .mod-col-left{
      display:flex;flex-direction:column;
      background:#f0ede8;
      border-radius:20px 0 0 0;
      overflow:hidden;
    }
    .mod-col-right{
      padding:16px 14px 10px 14px;
      overflow-y:auto;
      display:flex;flex-direction:column;
      background:#fff;
    }
    .mod-col-right::-webkit-scrollbar{display:none;}

    /* Imagen — ocupa todo sin fondo visible */
    .mod-img-wrap{ position:relative; flex:1; min-height:0; }
    .mod-img{ width:100%; height:100%; object-fit:cover; display:block; }
    .mod-img-ph{
      width:100%; height:220px;
      background:#1a1a1a;
      display:flex; align-items:center; justify-content:center;
      color:rgba(255,255,255,.3); font-size:.8rem; font-weight:700;
    }

    /* Close btn — más premium */
    .mod-close{
      position:absolute; top:10px; right:10px;
      background:rgba(255,255,255,.92); border:none;
      border-radius:50%; width:30px; height:30px; color:#222;
      cursor:pointer; display:flex; align-items:center; justify-content:center;
      backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
      transition:all .18s; z-index:4;
      box-shadow:0 2px 12px rgba(0,0,0,.18);
    }
    .mod-close:active{ transform:scale(.9); background:#fff; }

    /* Carousel */
    .mod-carousel{ position:relative; width:100%; overflow:hidden; background:#f0ede8; flex:1; }
    .mod-carousel-track{ display:flex; height:100%; transition:transform .3s cubic-bezier(.32,.72,0,1); will-change:transform; }
    .mod-carousel-slide{
      min-width:100%; position:relative;
      display:flex; align-items:center; justify-content:center;
      height:300px; overflow:hidden;
    }
    /* Fondo blur — misma imagen escalada y desenfocada */
    .mod-carousel-slide .mod-slide-bg{
      position:absolute; inset:-20px;
      background-size:cover; background-position:center;
      filter:blur(18px) brightness(.85) saturate(1.2);
      transform:scale(1.1);
      z-index:0;
    }
    /* Imagen principal — contain sin cortes */
    .mod-carousel-slide img{
      position:relative; z-index:1;
      max-width:100%; max-height:100%;
      width:auto; height:auto;
      object-fit:contain; display:block;
    }
    .mod-carousel-dots{ position:absolute; bottom:8px; left:50%; transform:translateX(-50%); display:flex; gap:5px; z-index:3; }
    .mod-carousel-dot{ width:5px; height:5px; border-radius:50%; background:rgba(255,255,255,.4); border:none; cursor:pointer; padding:0; transition:all .25s; }
    .mod-carousel-dot.on{ background:#fff; width:16px; border-radius:3px; }
    .mod-carousel-arr{ display:none; }

    /* Thumbnails */
    #mod-thumbs-row{
      display:flex; gap:6px; padding:8px 10px;
      overflow-x:auto; background:#e8e4de; flex-shrink:0;
    }
    #mod-thumbs-row::-webkit-scrollbar{ display:none; }
    .mod-thumb{
      width:44px; height:44px; border-radius:7px;
      border:2px solid transparent;
      overflow:hidden; flex-shrink:0; cursor:pointer; padding:0;
      transition:border-color .18s, box-shadow .18s;
      opacity:.6;
    }
    .mod-thumb.on{
      border-color:#0f0f0f;
      opacity:1;
      box-shadow:0 0 0 1px rgba(0,0,0,.1);
    }
    .mod-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }

    /* Badge row (col derecha) */
    .mod-badge-row{display:flex;align-items:center;gap:6px;margin-bottom:8px;flex-wrap:wrap;min-height:22px;}
    .mod-subcat-badge{
      display:inline-flex;align-items:center;
      background:rgba(0,0,0,.07);border-radius:20px;
      padding:4px 10px;font-size:.65rem;font-weight:600;color:#444;
    }
    .mod-delivery-badge{
      display:inline-flex;align-items:center;gap:4px;
      background:rgba(22,163,74,.1);border-radius:20px;
      padding:4px 10px;font-size:.65rem;font-weight:600;color:#16a34a;
    }
    .mod-preorder-badge{
      display:inline-flex;align-items:center;gap:4px;
      background:rgba(249,115,22,.08);border-radius:20px;
      padding:4px 10px;font-size:.65rem;font-weight:600;color:#f97316;
    }

    /* Name, price (col derecha) */
    .mod-name{ font-size:1rem; font-weight:800; letter-spacing:-.025em; margin-bottom:5px; line-height:1.2; color:#0a0a0a; }
    body.light-mode .mod-name{ color:#0a0a0a; }
    .mod-price-row{ display:flex; align-items:baseline; gap:7px; margin-bottom:8px; flex-wrap:wrap; }
    .mod-price{ font-size:1.35rem; font-weight:800; color:#0a0a0a; letter-spacing:-.035em; }
    body.light-mode .mod-price{ color:#0a0a0a; }
    .mod-orig{ font-size:.75rem; color:#bbb; text-decoration:line-through; }
    .mod-pct{ font-size:.62rem; font-weight:800; padding:3px 8px; border-radius:20px; background:#ef4444; color:#fff; letter-spacing:.01em; }

    /* Trust badges premium */
    .mod-trust-divider{ height:1px; background:rgba(0,0,0,.07); margin:8px 0 10px; }
    .mod-trust-list{ display:flex; flex-direction:column; }
    .mod-trust-item2{
      display:flex; align-items:center; gap:10px;
      padding:8px 0;
      border-bottom:1px solid rgba(0,0,0,.06);
    }
    .mod-trust-item2:last-child{ border-bottom:none; }
    .mod-trust-icon2{
      width:30px; height:30px; border-radius:50%;
      background:#f5f5f5;
      display:flex; align-items:center; justify-content:center;
      flex-shrink:0;
    }
    .mod-trust-item2 span{ font-size:.72rem; font-weight:600; color:#222; line-height:1.3; }

    /* OOS */
    .mod-oos-badge{
      display:inline-flex;align-items:center;gap:6px;
      background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.15);
      border-radius:20px;padding:4px 10px;
      font-size:.65rem;font-weight:700;color:#ef4444;
      margin-bottom:.6rem;
    }

    /* Body scrolleable (debajo del grid, full width) */
    .mod-body{
      flex:1;overflow-y:auto;
      padding:14px 18px 6px;
      -webkit-overflow-scrolling:touch;
      background:#fff;
    }
    .mod-body::-webkit-scrollbar{display:none;}

    /* Footer */
    .mod-footer{
      flex-shrink:0;
      padding:14px 16px env(safe-area-inset-bottom,24px);
      border-top:1px solid rgba(0,0,0,.06);
      background:#fff;
      display:flex;align-items:center;gap:12px;
    }
    body.light-mode .mod-footer{ background:#fff; border-top-color:rgba(0,0,0,.06); }

    /* Desc */
    .mod-desc-block{margin-bottom:10px;}
    .mod-desc-label{font-size:.66rem;font-weight:700;color:#aaa;text-transform:uppercase;letter-spacing:.1em;margin-bottom:5px;}
    .mod-desc{font-size:.8rem;color:#666;line-height:1.65;margin-bottom:.4rem;}
    body.light-mode .mod-desc{ color:#666; }
    .mod-desc-collapsed{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
    .mod-desc-toggle{background:none;border:none;padding:2px 0 0;font-size:.78rem;font-weight:700;color:#888;cursor:pointer;font-family:inherit;}

    /* Qty y botón en footer */
    .mod-qty-row{display:flex;align-items:center;gap:10px;width:100%;}
    .mod-qty-wrap{
      display:flex;flex-direction:row;align-items:center;gap:0;
      background:#f5f3ef;border-radius:14px;
      padding:4px;flex-shrink:0;
    }
    .mod-qb{
      width:40px;height:40px;border-radius:11px;
      background:transparent;border:none;
      color:#0f0f0f;font-size:1.1rem;
      cursor:pointer;display:flex;align-items:center;justify-content:center;
      transition:all .15s;flex-shrink:0;
    }
    .mod-qb:active{background:rgba(0,0,0,.08);transform:scale(.92);}
    .mod-qn{font-size:.95rem;font-weight:700;min-width:32px;text-align:center;flex-shrink:0;color:#0f0f0f;}
    .mod-add{
      flex:1;background:#0f0f0f;border:none;border-radius:14px;
      padding:.85rem;font-size:.88rem;font-weight:700;color:#fff;
      cursor:pointer;transition:all .18s;
      height:48px;letter-spacing:-.01em;
      position:relative;overflow:hidden;
    }
    .mod-add::after{content:'';position:absolute;inset:0;background:rgba(255,255,255,.1);opacity:0;transition:opacity .15s;}
    .mod-add:active::after{opacity:1;}
    .mod-add:active{transform:scale(.97);}
    .mod-add:hover{background:#1a1a1a;}
    .mod-add:disabled{background:#e5e5e5;color:#aaa;box-shadow:none;cursor:not-allowed;}
        /* Multi-image upload grid */
    .img-upload-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:8px; }
    .img-slot{ aspect-ratio:1/1; border-radius:10px; border:1px dashed var(--line2); background:var(--s2); position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:border-color .15s; }
    .img-slot:hover{ border-color:var(--accent); }
    .img-slot img{ width:100%; height:100%; object-fit:cover; display:block; }
    .img-slot .slot-ph{ font-size:1.4rem; color:var(--txt3); pointer-events:none; }
    .img-slot .slot-rm{ position:absolute; top:4px; right:4px; background:rgba(0,0,0,.65); border:none; color:#fff; border-radius:50%; width:20px; height:20px; font-size:.65rem; cursor:pointer; display:flex; align-items:center; justify-content:center; z-index:2; }
    .img-slot-add{ border-style:dashed; }

    @media(max-width:480px){
      .fr{grid-template-columns:1fr;}
      .cat-card{height:118px;}
    }

    /* VARIANTES */
    .vg{background:var(--s2);border:1px solid var(--line);border-radius:var(--r2);padding:0;overflow:hidden;}
    .vg-head{display:flex;align-items:center;gap:8px;padding:12px;cursor:pointer;user-select:none;}
    .vg-head:active{opacity:.7;}
    .vg-body{display:none;padding:0 12px 12px;border-top:1px solid var(--line);}
    .vg.open .vg-body{display:block;}
    .vg-chevron{margin-left:auto;font-size:.75rem;color:var(--txt3);transition:transform .2s;flex-shrink:0;}
    .vg.open .vg-chevron{transform:rotate(180deg);}
    .vg-summary{font-size:.72rem;color:var(--txt3);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px;}
    .vg-head input{flex:1;min-width:120px;}
    .vg-head select{width:auto;}
    .vg-opts{display:flex;flex-direction:column;gap:6px;}
    .vg-opt{display:flex;align-items:center;gap:6px;}
    .vg-opt input[type=text]{flex:1;}
    .vg-opt input[type=number]{width:90px;}
    .vg-opt button{background:transparent;border:none;color:var(--txt3);font-size:1rem;cursor:pointer;padding:2px 6px;}
    .vg-add-opt{font-size:.72rem;color:var(--accent);background:transparent;border:none;cursor:pointer;margin-top:4px;padding:0;font-weight:700;}
    .vg-remove{background:transparent;border:none;color:var(--red);font-size:.8rem;cursor:pointer;margin-left:auto;padding:2px 6px;}
    .vg-minmax{display:flex;align-items:center;gap:6px;margin-top:6px;flex-wrap:wrap;font-size:.75rem;color:var(--txt2);}
    .vg-minmax input{width:52px;}
    .mod-vg{margin-bottom:14px;}
    .mod-vg-title{font-size:.75rem;font-weight:800;color:var(--txt2);letter-spacing:.04em;text-transform:uppercase;margin-bottom:8px;display:flex;align-items:center;gap:6px;}
    .mod-vg-req{font-size:.6rem;background:var(--red);color:#fff;border-radius:20px;padding:1px 7px;font-weight:700;}
    .mod-vg-opts{display:flex;flex-wrap:wrap;gap:8px;}
    .mod-vg-opt{
      display:flex;align-items:center;justify-content:center;
      min-width:52px;height:44px;padding:0 16px;
      background:var(--s2);border:1.5px solid var(--line2);
      border-radius:10px;cursor:pointer;
      font-size:.88rem;font-weight:700;color:var(--txt);
      transition:border-color .15s,background .15s,color .15s;
      flex-shrink:0;
    }
    .mod-vg-opt:active{transform:scale(.95);}
    .mod-vg-opt.selected{
      border-color:var(--accent);
      background:var(--s1);
      color:var(--txt);
      box-shadow:0 0 0 1px var(--accent);
    }
    /* Ocultar el checkbox — no se usa más */
    .mod-vg-opt-check{display:none;}
    .mod-vg-opt-name{font-size:.88rem;font-weight:700;}
    .mod-vg-opt-price{font-size:.75rem;color:var(--accent);font-weight:700;margin-left:4px;}
    /* Multi select queda igual visualmente */
    .mod-vg-sq .mod-vg-opt.selected{
      background:var(--accent);color:#fff;border-color:var(--accent);
    }

    /* ── Chips de talle en cards ── */
    .card-size-chips { display:flex;flex-wrap:wrap;gap:4px;margin-top:5px; }
    .card-size-chip {
      font-size:.6rem;font-weight:800;
      padding:2px 7px;border-radius:5px;
      border:1.5px solid var(--line2);
      color:var(--txt2);background:var(--s2);
      pointer-events:none;
    }

    /* ── Paleta de colores premium ── */
    .color-group { margin-bottom: 14px; }
    .color-group-label { font-size:.72rem;font-weight:800;color:var(--txt2);letter-spacing:.06em;text-transform:uppercase;margin-bottom:10px;display:flex;align-items:center;gap:6px; }
    .color-group-label span { font-weight:600;color:var(--txt);text-transform:none;letter-spacing:0;font-size:.8rem; }
    .color-swatches { display:flex;flex-wrap:wrap;gap:10px; }
    .color-swatch {
      width:32px;height:32px;border-radius:50%;cursor:pointer;
      border:2px solid transparent;
      box-shadow:0 2px 8px rgba(0,0,0,.2);
      transition:transform .15s,box-shadow .15s,border-color .15s;
      position:relative;flex-shrink:0;
    }
    .color-swatch:active { transform:scale(.92); }
    .color-swatch.selected {
      border-color:var(--accent);
      box-shadow:0 0 0 3px rgba(124,92,252,.3),0 2px 8px rgba(0,0,0,.2);
      transform:scale(1.12);
    }
    .color-swatch.selected::after {
      content:'✓';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
      font-size:.6rem;font-weight:900;color:#fff;
      text-shadow:0 1px 3px rgba(0,0,0,.6);
    }
    /* Swatch blanco necesita borde visible */
    .color-swatch[data-light='1'] { border-color:var(--line2); }
    .color-swatch[data-light='1'].selected { border-color:var(--accent); }

    /* Mini paleta en cards */
    .card-color-dots { display:flex;gap:5px;margin-top:5px;flex-wrap:wrap; }
    .card-color-dot {
      width:14px;height:14px;border-radius:50%;
      border:1.5px solid rgba(0,0,0,.12);
      cursor:pointer;transition:transform .12s;flex-shrink:0;
    }
    .card-color-dot:active { transform:scale(1.2); }

    /* Transición fade en imagen del modal */
    .mod-carousel-slide img { transition:opacity .25s ease,filter .3s ease; }
    .mod-carousel-slide img.color-changing { opacity:.7; }

    /* STATS */
    .stats-per-btn.on{background:var(--accent);color:#fff;border-color:var(--accent);}
    /* ── Visitas Stats ── */
    .visits-kpi-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:14px;}
    .visits-kpi{background:var(--s2);border:1px solid var(--line);border-radius:var(--r2);padding:14px;display:flex;flex-direction:column;gap:4px;position:relative;overflow:hidden;}
    .visits-kpi::before{content:'';position:absolute;top:0;right:0;width:60px;height:60px;border-radius:50%;background:var(--accent);opacity:.06;transform:translate(20px,-20px);}
    .visits-kpi-val{font-size:1.6rem;font-weight:800;color:var(--accent);line-height:1;}
    .visits-kpi-lbl{font-size:.65rem;font-weight:700;color:var(--txt3);text-transform:uppercase;letter-spacing:.08em;}
    .visits-kpi-delta{font-size:.68rem;font-weight:800;margin-top:2px;}
    .visits-bar-chart{display:flex;align-items:flex-end;gap:4px;height:60px;margin-top:4px;}
    .visits-bar-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;}
    .visits-bar{width:100%;border-radius:4px 4px 0 0;background:var(--accent);opacity:.85;transition:opacity .2s;min-height:3px;}
    .visits-bar:hover{opacity:1;}
    .visits-bar-lbl{font-size:.55rem;color:var(--txt3);font-weight:600;}
    .stat-kpi{background:var(--s2);border:1px solid var(--line);border-radius:var(--r2);padding:14px;display:flex;flex-direction:column;gap:4px;}
    .stat-kpi-val{font-size:1.4rem;font-weight:800;color:var(--txt);line-height:1;}
    .stat-kpi-lbl{font-size:.65rem;font-weight:700;color:var(--txt3);text-transform:uppercase;letter-spacing:.08em;}
    .stat-kpi-sub{font-size:.72rem;color:var(--green);font-weight:700;}
    .stat-prod-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);}
    .stat-prod-row:last-child{border-bottom:none;}
    .stat-prod-bar-wrap{flex:1;background:var(--s3);border-radius:4px;height:6px;overflow:hidden;}
    .stat-prod-bar{height:6px;border-radius:4px;background:linear-gradient(90deg,var(--accent),var(--accent2));}
    .stat-prod-name{font-size:.82rem;font-weight:700;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
    .stat-prod-qty{font-size:.75rem;color:var(--txt2);font-weight:700;white-space:nowrap;}
    .stat-prod-rev{font-size:.75rem;color:var(--green);font-weight:700;white-space:nowrap;}

    /* ESTADO CERRADO */
    #closed-banner{display:none;}
    #closed-banner.show{display:flex;}
    .wa-btn.disabled{background:#444 !important;pointer-events:none;opacity:.6;}

    /* HORARIOS */
    .day-row{display:flex;align-items:center;gap:8px;background:var(--s2);border:1px solid var(--line);border-radius:var(--r);padding:10px 12px;flex-wrap:wrap;}
    .day-name{font-size:.8rem;font-weight:800;width:36px;flex-shrink:0;color:var(--txt);}
    .day-toggle{position:relative;width:40px;height:22px;flex-shrink:0;}
    .day-toggle input{opacity:0;width:0;height:0;position:absolute;}
    .day-toggle-slider{position:absolute;inset:0;background:var(--s3);border-radius:20px;cursor:pointer;transition:.2s;}
    .day-toggle input:checked + .day-toggle-slider{background:var(--accent);}
    .day-toggle-slider:before{content:"";position:absolute;width:16px;height:16px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s;}
    .day-toggle input:checked + .day-toggle-slider:before{transform:translateX(18px);}
    .day-times{display:flex;align-items:center;gap:6px;flex:1;flex-wrap:wrap;}
    .day-times input[type=time]{background:var(--s3);border:1px solid var(--line2);border-radius:8px;color:var(--txt);padding:5px 8px;font-size:.82rem;font-family:inherit;width:100px;}
    .day-closed-lbl{font-size:.75rem;color:var(--txt3);}
    .status-badge{display:inline-flex;align-items:center;gap:5px;font-size:.72rem;font-weight:800;padding:3px 10px;border-radius:20px;}
    .status-badge.open{background:rgba(34,197,94,.15);color:var(--green);}
    .status-badge.closed{background:rgba(239,68,68,.12);color:var(--red);}
    /* ===== ONBOARDING WIZARD ===== */
    /* ── Wizard translúcido estilo Apple ── */
    #cy-wizard-ov{
      position:fixed;inset:0;
      background:transparent;
      z-index:99999;display:flex;align-items:flex-end;justify-content:center;
      opacity:0;transition:opacity .3s;pointer-events:none;
    }
    #cy-wizard-ov::before{
      content:'';position:absolute;inset:0;
      background:rgba(0,0,0,.3);
      pointer-events:none;
    }
    #cy-wizard-ov.open{opacity:1;pointer-events:all;}
    #cy-wizard-box{
      background:rgba(255,255,255,.32);
      -webkit-backdrop-filter:blur(44px) saturate(2.2) brightness(1.06);
      backdrop-filter:blur(44px) saturate(2.2) brightness(1.06);
      border-radius:28px 28px 0 0;
      border-top:1.5px solid rgba(255,255,255,.82);
      width:100%;max-width:520px;
      padding:12px 20px 48px;
      transform:translateY(100%);
      transition:transform .4s cubic-bezier(.32,1,.36,1);
      max-height:92vh;overflow-y:auto;
      box-shadow:0 -12px 48px rgba(0,0,0,.04);
      color:#1a1a1a;
    }
    /* Forzar capa propia en Safari para que backdrop-filter funcione */
    #cy-wizard-ov.open #cy-wizard-box{
      transform:translateY(0);
      -webkit-transform:translateY(0);
    }
    #cy-wizard-ov.open #cy-wizard-box{transform:translateY(0);}
    .wz-handle{width:36px;height:4px;background:rgba(0,0,0,.15);border-radius:2px;margin:0 auto 18px;}
    /* Pantalla tipo de negocio */
    .wz-screen{display:none;}
    .wz-screen.active{display:block;}
    .wz-header{text-align:center;margin-bottom:20px;}
    .wz-emoji{font-size:2.4rem;margin-bottom:8px;}
    .wz-title{font-size:1.2rem;font-weight:900;color:#0f0f0f !important;margin-bottom:4px;letter-spacing:-.02em;text-shadow:0 1px 6px rgba(255,255,255,.6);}
    .wz-sub{font-size:.8rem;color:#333 !important;line-height:1.5;text-shadow:0 1px 4px rgba(255,255,255,.7);}
    /* Opciones tipo negocio */
    .wz-type-opts{display:flex;flex-direction:column;gap:10px;margin:20px 0;}
    .wz-type-opt{
      display:flex;align-items:center;gap:12px;
      background:rgba(255,255,255,.7);border:2px solid rgba(0,0,0,.08);
      border-radius:18px;padding:13px 15px;cursor:pointer;
      transition:all .18s;-webkit-tap-highlight-color:transparent;
    }
    .wz-type-opt:active{transform:scale(.98);}
    .wz-type-opt.selected{border-color:#1a1a1a;background:#1a1a1a;}
    .wz-type-opt.selected .wz-type-name{color:#fff;}
    .wz-type-opt.selected .wz-type-desc{color:rgba(255,255,255,.6);}
    .wz-type-icon{width:42px;height:42px;border-radius:12px;background:rgba(0,0,0,.06);display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex-shrink:0;transition:background .18s;}
    .wz-type-opt.selected .wz-type-icon{background:rgba(255,255,255,.15);}
    .wz-type-name{font-size:.88rem;font-weight:800;color:#1a1a1a;margin-bottom:2px;}
    .wz-type-desc{font-size:.7rem;color:#888;line-height:1.3;}
    .wz-type-check{width:22px;height:22px;border-radius:50%;border:2px solid rgba(0,0,0,.15);flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:all .18s;}
    .wz-type-opt.selected .wz-type-check{background:#fff;border-color:#fff;color:#1a1a1a;font-size:.72rem;font-weight:900;}
    /* Pasos */
    .wz-type-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(0,0,0,.07);border-radius:20px;padding:5px 12px;font-size:.7rem;font-weight:700;color:#555;margin-bottom:14px;}
    .wz-progress-wrap{margin-bottom:16px;}
    .wz-progress-labels{display:flex;justify-content:space-between;font-size:.68rem;font-weight:700;color:#aaa;margin-bottom:5px;}
    .wz-progress{height:5px;background:rgba(0,0,0,.08);border-radius:99px;overflow:hidden;}
    .wz-progress-bar{height:100%;background:linear-gradient(90deg,#22c55e,#16a34a);border-radius:99px;transition:width .5s cubic-bezier(.32,1,.6,1);}
    .wz-steps{display:flex;flex-direction:column;gap:8px;margin-bottom:20px;}
    .wz-step{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.65);border:1.5px solid rgba(0,0,0,.07);border-radius:16px;padding:12px 14px;cursor:pointer;transition:all .18s;-webkit-tap-highlight-color:transparent;}
    .wz-step.done{border-color:rgba(34,197,94,.4);background:rgba(34,197,94,.06);}
    .wz-step.active{border-color:rgba(0,0,0,.2);background:rgba(255,255,255,.92);box-shadow:0 2px 12px rgba(0,0,0,.08);}
    .wz-step:active{transform:scale(.99);}
    .wz-step-num{width:30px;height:30px;border-radius:50%;background:rgba(0,0,0,.07);display:flex;align-items:center;justify-content:center;font-size:.78rem;font-weight:900;color:#999;flex-shrink:0;transition:all .2s;}
    .wz-step.done .wz-step-num{background:#22c55e;color:#fff;}
    .wz-step.active .wz-step-num{background:#1a1a1a;color:#fff;}
    .wz-step-info{flex:1;}
    .wz-step-title{font-size:.85rem;font-weight:800;color:#0f0f0f !important;margin-bottom:1px;}
    .wz-step.done .wz-step-title{color:#16a34a;}
    .wz-step-desc{font-size:.7rem;color:#555 !important;line-height:1.3;}
    .wz-step-arrow{font-size:.9rem;color:#ccc;}
    .wz-step.done .wz-step-arrow{color:#22c55e;}
    .wz-step.active .wz-step-arrow{color:#1a1a1a;}
    .wz-btn-main{background:#1a1a1a;color:#fff;border:none;border-radius:16px;padding:15px;font-size:.95rem;font-weight:900;cursor:pointer;width:100%;margin-bottom:10px;font-family:inherit;transition:transform .15s;}
    .wz-btn-main:active{transform:scale(.98);}
    .wz-btn-main:disabled{opacity:.4;cursor:not-allowed;}
    .wz-btn-main.green{background:linear-gradient(135deg,#22c55e,#16a34a);}

    /* Efecto destello wizard — azul eléctrico bien visible */
    @keyframes wzPulseField {
      0%,100% { 
        box-shadow: 0 0 0 0 rgba(0,150,255,.5), 0 0 8px rgba(0,150,255,.2);
        border-color: rgba(0,150,255,.7) !important;
      }
      50% { 
        box-shadow: 0 0 0 5px rgba(0,150,255,.2), 0 0 16px rgba(0,150,255,.35);
        border-color: rgba(0,180,255,1) !important;
      }
    }
    .wz-highlight {
      animation: wzPulseField 1.2s ease-in-out infinite !important;
      border-color: rgba(0,150,255,.7) !important;
      outline: 2px solid rgba(0,150,255,.35) !important;
      outline-offset: 2px !important;
      border-radius: 10px !important;
      transition: border-color .2s !important;
    }
    .wz-btn-skip{background:none;border:none;color:#aaa;font-size:.78rem;cursor:pointer;padding:4px;text-decoration:underline;display:block;text-align:center;width:100%;font-family:inherit;}

    /* ══ ASISTENTE IA ══ */

    /* Botón IA en nav */
    .fn-ia { position: relative; }
    .fn-ia-label {
      font-weight: 900 !important;
      font-size: .52rem !important;
      letter-spacing: .04em;
      background: linear-gradient(135deg, var(--accent2, #e8cc7a), var(--accent, #b8962e));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    .fn-ia-icon { position: relative; }
    .fn-ia-icon svg { filter: drop-shadow(0 0 4px var(--accent, #b8962e)88); }
    .fn-ia-icon::after {
      content: '';
      position: absolute; top: 0; right: -3px;
      width: 8px; height: 8px;
      background: var(--accent, #b8962e);
      border-radius: 50%;
      box-shadow: 0 0 8px var(--accent, #b8962e);
      animation: iaPulse 2s ease-in-out infinite;
    }
    @keyframes iaPulse {
      0%,100% { transform: scale(1); opacity: 1; box-shadow: 0 0 6px var(--accent, #b8962e); }
      50% { transform: scale(1.2); opacity: .8; box-shadow: 0 0 12px var(--accent, #b8962e), 0 0 0 5px transparent; }
    }

    /* Chat overlay */
    #ia-chat-ov {
      position: fixed; inset: 0;
      background: rgba(0,0,0,.6);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      z-index: 999;
      display: flex; align-items: flex-end; justify-content: center;
      opacity: 0; pointer-events: none;
      transition: opacity .25s;
      touch-action: none;
      overscroll-behavior: none;
    }
    #ia-chat-ov.open { opacity: 1; pointer-events: all; }

    /* Chat box — dark premium 35% opacidad */
    #ia-chat-box {
      width: 100%; max-width: 520px;
      background: rgba(10,10,9,.35);
      backdrop-filter: blur(50px) saturate(2);
      -webkit-backdrop-filter: blur(50px) saturate(2);
      border-radius: 28px 28px 0 0;
      border-top: 1px solid rgba(255,255,255,.1);
      border-left: 1px solid rgba(255,255,255,.06);
      border-right: 1px solid rgba(255,255,255,.06);
      display: flex; flex-direction: column;
      height: 84dvh;
      max-height: 84dvh;
      transform: translateY(100%);
      transition: transform .4s cubic-bezier(.32,1.1,.6,1);
      box-shadow: 0 -32px 80px rgba(0,0,0,.5);
      overflow: hidden;
      position: relative;
    }
    /* Glow line top */
    #ia-chat-box::before {
      content: '';
      position: absolute; top: 0; left: 10%; right: 10%; height: 1px;
      background: linear-gradient(90deg, transparent, var(--accent, #b8962e)66, transparent);
    }
    #ia-chat-ov.open #ia-chat-box { transform: translateY(0); }

    .mod-handle-ia { width: 36px; height: 3px; background: rgba(255,255,255,.12); border-radius: 2px; margin: 12px auto 0; flex-shrink: 0; }

    /* Header */
    #ia-chat-header {
      display: flex; align-items: center; justify-content: space-between;
      padding: 14px 18px 12px;
      border-bottom: 1px solid rgba(255,255,255,.07);
      flex-shrink: 0;
    }
    #ia-header-left { display: flex; align-items: center; gap: 12px; }
    #ia-avatar-wrap {
      width: 38px; height: 38px; border-radius: 14px;
      background: linear-gradient(135deg, var(--accent, #b8962e)22, var(--accent, #b8962e)08);
      border: 1px solid var(--accent, #b8962e)33;
      display: flex; align-items: center; justify-content: center;
      color: var(--accent, #b8962e);
      position: relative; overflow: hidden;
    }
    #ia-avatar-wrap::after {
      content: ''; position: absolute; inset: 0;
      background: radial-gradient(circle at 30% 30%, var(--accent, #b8962e)44, transparent 70%);
    }
    #ia-avatar-wrap svg { position: relative; z-index: 1; }
    #ia-header-name { font-size: .88rem; font-weight: 700; color: rgba(255,255,255,.95); letter-spacing: -.01em; }
    #ia-header-status { font-size: .62rem; color: #22c55e; font-weight: 600; display: flex; align-items: center; gap: 5px; margin-top: 1px; }
    #ia-header-status::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: #22c55e; flex-shrink: 0; }
    #ia-close-btn {
      width: 30px; height: 30px; border-radius: 10px;
      background: rgba(255,255,255,.07); border: none;
      color: rgba(255,255,255,.4); cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      transition: all .15s;
    }
    #ia-close-btn:hover { background: rgba(255,255,255,.12); color: #fff; }

    /* Messages */
    #ia-messages {
      flex: 1; overflow-y: auto; padding: 16px;
      display: flex; flex-direction: column; gap: 12px;
      -webkit-overflow-scrolling: touch;
    }
    #ia-messages::-webkit-scrollbar { display: none; }

    .ia-msg { display: flex; gap: 8px; align-items: flex-end; animation: iaMsgIn .25s ease both; }
    @keyframes iaMsgIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
    .ia-msg-bot { align-self: flex-start; }
    .ia-msg-user { align-self: flex-end; flex-direction: row-reverse; }

    .ia-msg-avatar {
      width: 26px; height: 26px; border-radius: 9px; flex-shrink: 0;
      background: linear-gradient(135deg, var(--accent, #b8962e)20, var(--accent, #b8962e)08);
      border: 1px solid var(--accent, #b8962e)25;
      display: flex; align-items: center; justify-content: center;
      color: var(--accent, #b8962e);
    }
    .ia-msg-bubble {
      max-width: 78%; padding: 11px 15px; border-radius: 18px;
      font-size: .82rem; line-height: 1.6;
    }
    .ia-msg-bot .ia-msg-bubble {
      background: rgba(255,255,255,.07);
      color: rgba(255,255,255,.9);
      border: 1px solid rgba(255,255,255,.08);
      border-bottom-left-radius: 5px;
    }
    .ia-msg-user .ia-msg-bubble {
      background: linear-gradient(135deg, var(--accent, #b8962e), var(--accent2, #e8cc7a));
      color: #0f0e0b; font-weight: 500;
      border-bottom-right-radius: 5px;
    }

    /* Typing */
    .ia-typing { display: flex; gap: 5px; align-items: center; padding: 12px 16px !important; }
    .ia-typing span { width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,.3); animation: iaTyping .9s ease-in-out infinite; }
    .ia-typing span:nth-child(2) { animation-delay: .15s; }
    .ia-typing span:nth-child(3) { animation-delay: .3s; }
    @keyframes iaTyping { 0%,60%,100%{transform:translateY(0);opacity:.4} 30%{transform:translateY(-6px);opacity:1} }

    /* Quick replies */
    #ia-quick-wrap {
      display: flex; gap: 7px; padding: 6px 16px 10px;
      overflow-x: auto; scrollbar-width: none; flex-shrink: 0;
    }
    #ia-quick-wrap::-webkit-scrollbar { display: none; }
    .ia-quick {
      white-space: nowrap; flex-shrink: 0;
      background: rgba(255,255,255,.05);
      border: 1px solid rgba(255,255,255,.1);
      border-radius: 20px; padding: 7px 14px;
      font-size: .73rem; font-weight: 500;
      color: rgba(255,255,255,.6);
      cursor: pointer; font-family: inherit;
      transition: all .15s;
    }
    .ia-quick:hover { background: rgba(255,255,255,.1); color: #fff; border-color: rgba(255,255,255,.2); }
    .ia-quick:active { transform: scale(.97); }

    /* Input */
    #ia-input-wrap {
      display: flex; align-items: flex-end; gap: 10px;
      padding: 12px 16px env(safe-area-inset-bottom, 28px);
      border-top: 1px solid rgba(255,255,255,.07);
      background: rgba(0,0,0,.15);
      flex-shrink: 0;
    }
    #ia-input {
      flex: 1; border: 1px solid rgba(255,255,255,.12);
      border-radius: 16px; padding: 12px 16px;
      font-size: .83rem; font-family: inherit;
      background: rgba(255,255,255,.07);
      color: #fff; resize: none; outline: none;
      max-height: 100px; line-height: 1.4;
      transition: border-color .2s;
    }
    #ia-input::placeholder { color: rgba(255,255,255,.25); }
    #ia-input:focus { border-color: var(--accent, #b8962e)66; background: rgba(255,255,255,.09); }
    #ia-send-btn {
      width: 44px; height: 44px; border-radius: 14px;
      background: linear-gradient(135deg, var(--accent, #b8962e), var(--accent2, #e8cc7a));
      border: none; color: #0f0e0b; cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
      box-shadow: 0 4px 20px var(--accent, #b8962e)44;
      transition: all .18s;
    }
    #ia-send-btn:active { transform: scale(.93); }

    /* ========= IMAGE VIEWER FULLSCREEN ========= */
    #img-viewer-ov{
      position:fixed; inset:0; z-index:2000;
      background:#000;
      display:none; flex-direction:column;
      align-items:center; justify-content:center;
      transition:transform .25s ease, opacity .25s ease;
    }
    #img-viewer-ov.open{ display:flex; }
    .iv-close{
      position:absolute; top:16px; right:16px; z-index:10;
      background:rgba(255,255,255,.15); border:none;
      border-radius:50%; width:38px; height:38px;
      color:#fff; cursor:pointer;
      display:flex; align-items:center; justify-content:center;
      backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
      transition:background .15s;
    }
    .iv-close:active{ background:rgba(255,255,255,.3); }
    .iv-track-wrap{
      width:100%; height:100%;
      overflow:hidden; position:relative;
    }
    .iv-track{
      display:flex; height:100%;
      will-change:transform;
    }
    .iv-slide{
      min-width:100%; height:100%;
      display:flex; align-items:center; justify-content:center;
      overflow:hidden;
    }
    .iv-slide img{
      max-width:100%; max-height:100%;
      object-fit:contain; display:block;
      user-select:none; -webkit-user-select:none;
      transform-origin:center center;
      transition:transform .2s ease;
      will-change:transform;
    }
    .iv-dots{
      position:absolute; bottom:40px; left:50%; transform:translateX(-50%);
      display:flex; gap:6px; z-index:5;
    }
    .iv-dot{
      width:6px; height:6px; border-radius:50%;
      background:rgba(255,255,255,.35); transition:all .25s;
    }
    .iv-dot.on{ background:#fff; width:18px; border-radius:3px; }
    .iv-hint{
      position:absolute; bottom:16px; left:50%; transform:translateX(-50%);
      font-size:.68rem; color:rgba(255,255,255,.4);
      white-space:nowrap; pointer-events:none;
      font-family:inherit;
    }

    /* ══════════════════════════════════════
       FAVORITOS
    ══════════════════════════════════════ */
    .fav-btn {
      position:absolute; top:7px; left:7px; z-index:3;
      width:30px; height:30px; border-radius:50%;
      background:rgba(255,255,255,.88);
      backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
      border:none; cursor:pointer;
      display:flex; align-items:center; justify-content:center;
      transition:transform .18s, background .18s;
      box-shadow:0 2px 8px rgba(0,0,0,.15);
      -webkit-tap-highlight-color:transparent;
      color:#bbb;
      flex-shrink:0;
    }
    .fav-btn:active { transform:scale(.88); }
    .fav-btn.active { color:#ef4444; background:rgba(255,255,255,.96); }
    .fav-btn svg { pointer-events:none; }

    /* Corazón en footer del modal */
    .mod-fav-btn {
      width:48px; height:48px; border-radius:14px;
      background:#f5f3ef; border:none;
      display:flex; align-items:center; justify-content:center;
      cursor:pointer; flex-shrink:0;
      color:#bbb; transition:all .18s;
      -webkit-tap-highlight-color:transparent;
    }
    .mod-fav-btn svg { width:20px; height:20px; pointer-events:none; }
    .mod-fav-btn.active { color:#ef4444; background:rgba(239,68,68,.08); }
    .mod-fav-btn:active { transform:scale(.9); }

    /* Ícono corazón en nav */
    .fn-heart svg { stroke:currentColor; fill:none; }
    .fn.on .fn-heart svg { fill:currentColor; stroke:currentColor; }

    /* ══════════════════════════════════════
       DESTACADOS v2 — estilo PedidosYa
    ══════════════════════════════════════ */
    #dest-track {
      display:flex; gap:10px; overflow-x:auto;
      padding:0 16px 14px; scrollbar-width:none;
      -webkit-overflow-scrolling:touch;
    }
    #dest-track::-webkit-scrollbar { display:none; }

    .dest-card-v2 {
      flex-shrink:0; width:160px; border-radius:16px; overflow:hidden;
      background:var(--s1); cursor:pointer; position:relative;
      box-shadow:0 2px 10px rgba(0,0,0,.12);
      transition:transform .16s ease, box-shadow .16s ease;
      -webkit-tap-highlight-color:transparent;
      display:flex; flex-direction:column;
      border:1px solid var(--line);
    }
    .dest-card-v2:active { transform:scale(.96); box-shadow:0 1px 4px rgba(0,0,0,.08); }

    .d-img-wrap {
      width:100%; height:160px; overflow:hidden; position:relative;
      background:var(--s2); flex-shrink:0;
    }
    .d-img-wrap img {
      width:100%; height:100%; object-fit:cover; display:block;
      transition:transform .25s ease;
    }
    .dest-card-v2:active .d-img-wrap img { transform:scale(1.04); }
    .d-no-img {
      width:100%; height:100%; display:flex; align-items:center; justify-content:center;
      background:linear-gradient(160deg,var(--s2) 0%,var(--s3) 100%);
    }

    /* Badge % descuento */
    .d-disc-badge {
      position:absolute; top:8px; left:8px; z-index:2;
      background:#f59e0b; color:#fff;
      font-size:.6rem; font-weight:900; letter-spacing:.02em;
      padding:3px 8px; border-radius:20px;
    }

    /* Botón + esquina inferior derecha */
    .d-add-corner {
      position:absolute; bottom:8px; right:8px; z-index:3;
      width:30px; height:30px; border-radius:50%;
      background:#0f0f0f; border:none; color:#fff;
      display:flex; align-items:center; justify-content:center;
      cursor:pointer; transition:transform .15s;
      box-shadow:0 2px 8px rgba(0,0,0,.3);
      -webkit-tap-highlight-color:transparent;
    }
    .d-add-corner:active { transform:scale(.88); }
    .d-add-corner svg { pointer-events:none; }

    .d-body {
      padding:9px 10px 11px;
      display:flex; flex-direction:column; flex:1;
    }
    .d-name {
      font-size:.78rem; font-weight:700; color:var(--txt);
      line-height:1.3; margin-bottom:4px;
      display:-webkit-box; -webkit-line-clamp:2;
      -webkit-box-orient:vertical; overflow:hidden;
    }
    .d-price-row {
      display:flex; align-items:baseline; gap:5px; margin-top:auto; padding-top:4px;
    }
    .d-price { font-size:.92rem; font-weight:900; color:var(--txt); }
    .d-old { font-size:.66rem; color:var(--txt3); text-decoration:line-through; }

    /* Header sección destacados */
    .dest-section-hd {
      display:flex; align-items:center; justify-content:space-between;
      padding:16px 16px 10px;
    }
    .dest-title {
      font-size:.72rem; font-weight:800; letter-spacing:.1em;
      text-transform:uppercase; color:var(--txt2);
    }
    .dest-ver-todos {
      font-size:.75rem; font-weight:700; color:var(--accent);
      background:none; border:none; cursor:pointer; padding:0;
      font-family:inherit;
    }

    /* Botón + esquina en cards de grilla y catálogo */
    .card-add-corner {
      position:absolute; bottom:8px; right:8px; z-index:3;
      width:32px; height:32px; border-radius:50%;
      background:#0f0f0f; border:none; color:#fff;
      display:flex; align-items:center; justify-content:center;
      cursor:pointer; transition:transform .15s;
      box-shadow:0 2px 10px rgba(0,0,0,.35);
      -webkit-tap-highlight-color:transparent;
    }
    .card-add-corner:active { transform:scale(.88); }
    .card-add-corner svg { pointer-events:none; }

    /* Estrellas mini en cards */
    .prod-stars-mini {
      display:flex; align-items:center; gap:3px;
      margin-bottom:3px;
    }
    .prod-stars-mini span {
      font-size:.68rem; font-weight:700; color:var(--txt2);
      line-height:1;
    }
    .prod-stars-mini .prod-stars-count {
      font-size:.62rem; color:var(--txt3); font-weight:600;
    }

    /* ══════════════════════════════════════
       RESEÑAS — Sección en modal
    ══════════════════════════════════════ */
    .rev-header { margin-bottom:12px; }
    .rev-title-row {
      display:flex; align-items:center; justify-content:space-between;
      gap:10px;
    }
    .rev-title {
      font-size:.72rem; font-weight:800; color:#888;
      text-transform:uppercase; letter-spacing:.08em;
    }
    .rev-avg-row {
      display:flex; align-items:center; gap:4px;
    }
    .rev-avg-row strong { font-size:.85rem; font-weight:800; color:#0a0a0a; }
    .rev-count { font-size:.7rem; color:#aaa; }

    /* Formulario */
    .rev-form { margin-bottom:16px; }
    .rev-form-title {
      font-size:.72rem; font-weight:800; color:#555;
      margin-bottom:8px; letter-spacing:.02em;
    }
    .rev-stars-pick {
      display:flex; gap:4px; margin-bottom:10px;
    }
    .rev-star-btn {
      background:none; border:none; cursor:pointer; padding:2px;
      -webkit-tap-highlight-color:transparent;
    }
    .rev-star-btn:active { transform:scale(.9); }
    .rev-input {
      width:100%; padding:9px 12px;
      background:#f5f3ef; border:1px solid rgba(0,0,0,.1);
      border-radius:10px; font-size:.82rem; font-family:inherit;
      color:#1a1a1a; outline:none; margin-bottom:8px;
      transition:border-color .15s;
    }
    .rev-input:focus { border-color:rgba(0,0,0,.25); }
    .rev-textarea { resize:none; min-height:56px; }
    .rev-submit-btn {
      background:#0f0f0f; color:#fff; border:none;
      border-radius:10px; padding:10px 20px;
      font-size:.82rem; font-weight:700; font-family:inherit;
      cursor:pointer; width:100%; transition:opacity .15s;
    }
    .rev-submit-btn:active { opacity:.8; }
    .rev-submit-btn:disabled { opacity:.5; cursor:not-allowed; }

    /* Lista de reseñas */
    .rev-list { display:flex; flex-direction:column; gap:0; }
    .rev-item {
      padding:12px 0; border-bottom:1px solid rgba(0,0,0,.06);
    }
    .rev-item:last-child { border-bottom:none; }
    .rev-item-header {
      display:flex; align-items:center; gap:8px; margin-bottom:4px;
    }
    .rev-item-stars { display:flex; gap:2px; }
    .rev-item-meta { display:flex; flex-direction:column; gap:1px; }
    .rev-author { font-size:.75rem; font-weight:700; color:#1a1a1a; }
    .rev-date { font-size:.65rem; color:#bbb; }
    .rev-comment { font-size:.78rem; color:#555; line-height:1.55; margin-top:4px; }
    .rev-empty { font-size:.78rem; color:#aaa; padding:8px 0 4px; }

    /* Admin de reseñas */
    .rev-admin-item {
      background:var(--s2); border:1px solid var(--line);
      border-radius:12px; padding:12px 14px; margin-bottom:8px;
    }
    .rev-admin-top {
      display:flex; align-items:center; justify-content:space-between;
      gap:10px; margin-bottom:4px;
    }
    .rev-admin-prod {
      font-size:.82rem; font-weight:800; color:var(--txt);
      flex:1; min-width:0; white-space:nowrap;
      overflow:hidden; text-overflow:ellipsis;
    }
    .rev-admin-meta { font-size:.72rem; color:var(--txt3); margin-bottom:6px; }
    .rev-admin-comment {
      font-size:.78rem; color:var(--txt2); line-height:1.5;
      margin-bottom:8px;
    }
    .rev-admin-del {
      background:none; border:1px solid rgba(239,68,68,.3);
      color:var(--red); border-radius:8px; padding:4px 12px;
      font-size:.72rem; font-weight:700; cursor:pointer;
      font-family:inherit; transition:background .15s;
    }
    .rev-admin-del:hover { background:rgba(239,68,68,.08); }

    /* ══════════════════════════════════════
       BTN-HIDDEN — Botón de compra desactivado
    ══════════════════════════════════════ */
    body.btn-hidden .addbtn,
    body.btn-hidden .pg-addbtn,
    body.btn-hidden .prod-catalog-btn { display:none !important; }

    /* ══════════════════════════════════════
       MODAL — Rating compacto junto al precio
    ══════════════════════════════════════ */
    .mod-rating-row {
      display:flex; align-items:center; gap:5px;
      margin:5px 0 8px; cursor:pointer;
      -webkit-tap-highlight-color:transparent;
      width:fit-content;
    }
    .mod-rating-row:active { opacity:.7; }
    .mod-rating-avg {
      font-size:.82rem; font-weight:800; color:#1a1a1a;
      line-height:1;
    }
    .mod-rating-sep {
      font-size:.72rem; color:#ccc; font-weight:400;
    }
    .mod-rating-count {
      font-size:.75rem; font-weight:600; color:#6e6e73;
      line-height:1;
    }
    .mod-rating-row svg:last-child { color:#aaa; }

    /* ══════════════════════════════════════
       FOOD MODE — food-home.js
    ══════════════════════════════════════ */

    /* Hero */
    .fm-hero {
      position:relative; width:100%;
      min-height:260px; overflow:hidden;
      display:flex; flex-direction:column;
      justify-content:flex-end;
    }
    .fm-hero-overlay {
      position:absolute; inset:0;
      background:linear-gradient(180deg,
        rgba(0,0,0,.06) 0%,
        rgba(0,0,0,.28) 40%,
        rgba(0,0,0,.78) 100%);
      pointer-events:none; z-index:1;
    }
    .fm-hero-topbar {
      position:absolute; top:0; left:0; right:0; z-index:3;
      display:flex; align-items:center; justify-content:space-between;
      padding:14px 16px;
    }
    .fm-hero-circle-btn {
      width:36px; height:36px; border-radius:50%;
      background:rgba(255,255,255,.22);
      backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
      border:none; color:#fff;
      display:flex; align-items:center; justify-content:center;
      cursor:pointer; -webkit-tap-highlight-color:transparent;
    }
    .fm-hero-circle-btn:active { opacity:.7; }
    .fm-hero-circle-btn svg { pointer-events:none; }
    .fm-hero-content {
      position:relative; z-index:2;
      display:flex; align-items:flex-end; gap:12px;
      padding:0 16px 14px;
    }
    .fm-hero-logo {
      width:68px; height:68px; border-radius:50%;
      border:3px solid #fff; overflow:hidden; flex-shrink:0;
      background:#fff; box-shadow:0 4px 20px rgba(0,0,0,.35);
    }
    .fm-hero-info { flex:1; min-width:0; }
    .fm-hero-name {
      font-size:1.18rem; font-weight:800; color:#fff;
      letter-spacing:-.02em; line-height:1.15;
    }
    .fm-hero-meta {
      display:flex; align-items:center; gap:6px;
      margin-top:5px; flex-wrap:wrap;
    }
    .fm-hero-stat {
      display:flex; align-items:center; gap:3px;
      font-size:.68rem; font-weight:600; color:rgba(255,255,255,.9);
    }
    .fm-hero-sep { color:rgba(255,255,255,.4); font-size:.7rem; }
    .fm-hero-open {
      display:flex; align-items:center; gap:4px;
      font-size:.68rem; font-weight:700; color:#4ade80;
    }
    .fm-hero-open-dot {
      width:6px; height:6px; border-radius:50%; background:#4ade80;
      animation:fm-blink 1.8s ease-in-out infinite;
    }
    @keyframes fm-blink { 0%,100%{opacity:1} 50%{opacity:.35} }

    /* Buscador */
    .fm-search-wrap {
      background:var(--s1); padding:10px 16px 8px;
      border-bottom:1px solid var(--line);
    }
    .fm-search-inner {
      display:flex; align-items:center; gap:10px;
      background:var(--bg); border:1px solid var(--line);
      border-radius:100px; padding:10px 16px;
    }
    .fm-search-inner input::placeholder { color:var(--txt3); }

    /* Chips de categorías */
    .fm-cats-bar {
      background:var(--s1); border-bottom:1px solid var(--line);
      padding:8px 0; position:sticky; top:0; z-index:8;
    }
    .fm-cats-track {
      display:flex; gap:7px; overflow-x:auto;
      padding:0 16px; scrollbar-width:none;
      -webkit-overflow-scrolling:touch;
    }
    .fm-cats-track::-webkit-scrollbar { display:none; }
    .fm-cat-chip {
      display:flex; align-items:center; gap:5px;
      padding:7px 13px; border-radius:100px;
      font-size:.73rem; font-weight:700; white-space:nowrap;
      border:1.5px solid var(--line); background:var(--s1);
      color:var(--txt2); cursor:pointer; flex-shrink:0;
      transition:all .18s; font-family:inherit;
      -webkit-tap-highlight-color:transparent;
    }
    .fm-cat-chip.active {
      background:rgba(124,92,252,.1);
      border-color:rgba(124,92,252,.3);
      color:var(--accent);
    }
    .fm-cat-chip:active { opacity:.75; }

    /* Bestseller card */
    .fm-bs-card {
      margin:14px 16px 0; background:var(--s1);
      border-radius:18px; border:1px solid var(--line);
      overflow:hidden; box-shadow:0 2px 12px rgba(0,0,0,.07);
      cursor:pointer; -webkit-tap-highlight-color:transparent;
    }
    .fm-bs-card:active { opacity:.9; }
    .fm-bs-header {
      display:flex; align-items:center; gap:6px;
      padding:9px 14px 8px; border-bottom:1px solid var(--line);
    }
    .fm-bs-label {
      font-size:.65rem; font-weight:800; color:var(--accent);
      text-transform:uppercase; letter-spacing:.07em;
    }
    .fm-bs-inner { display:flex; align-items:center; gap:12px; padding:12px; }
    .fm-bs-img {
      width:76px; height:76px; border-radius:12px;
      overflow:hidden; flex-shrink:0; background:var(--s2);
      display:flex; align-items:center; justify-content:center;
    }
    .fm-bs-info { flex:1; min-width:0; }
    .fm-bs-name {
      font-size:.88rem; font-weight:800; color:var(--txt);
      letter-spacing:-.015em; line-height:1.2; margin-bottom:3px;
    }
    .fm-bs-desc {
      font-size:.69rem; color:var(--txt2);
      line-height:1.45; margin-bottom:6px;
    }
    .fm-bs-meta { display:flex; align-items:center; gap:8px; }
    .fm-bs-btn {
      display:flex; align-items:center; gap:4px;
      background:rgba(124,92,252,.1); border:1px solid rgba(124,92,252,.2);
      border-radius:100px; padding:7px 12px;
      font-size:.7rem; font-weight:800; color:var(--accent);
      cursor:pointer; white-space:nowrap; flex-shrink:0;
      font-family:inherit; -webkit-tap-highlight-color:transparent;
    }

    /* Section headers */
    .fm-section-hd {
      display:flex; align-items:baseline; justify-content:space-between;
      padding:18px 16px 10px;
    }
    .fm-section-hd-left h2 {
      font-size:1.06rem; font-weight:800; color:var(--txt);
      letter-spacing:-.02em;
    }
    .fm-section-hd-left p { font-size:.68rem; color:var(--txt2); margin-top:2px; }
    .fm-ver-todos {
      font-size:.74rem; font-weight:700; color:var(--accent);
      background:none; border:none; cursor:pointer;
      font-family:inherit; white-space:nowrap; padding:0;
    }

    /* Populares carrusel */
    .fm-pop-track {
      display:flex; gap:10px; overflow-x:auto;
      padding:0 16px 16px; scrollbar-width:none;
      -webkit-overflow-scrolling:touch;
    }
    .fm-pop-track::-webkit-scrollbar { display:none; }
    .fm-pop-card {
      flex-shrink:0; width:165px; border-radius:18px;
      background:var(--s1); border:1px solid var(--line);
      overflow:hidden; box-shadow:0 2px 10px rgba(0,0,0,.08);
      cursor:pointer; -webkit-tap-highlight-color:transparent;
      transition:transform .16s, box-shadow .16s;
    }
    .fm-pop-card:active { transform:scale(.97); }
    .fm-pop-img {
      width:100%; height:130px; position:relative;
      overflow:hidden; background:var(--s2);
      display:flex; align-items:center; justify-content:center;
    }
    /* Botón + morado en esquina */
    .fm-pop-add {
      position:absolute; bottom:8px; right:8px; z-index:3;
      width:32px; height:32px; border-radius:50%;
      background:var(--accent); border:none; color:#fff;
      display:flex; align-items:center; justify-content:center;
      cursor:pointer; box-shadow:0 2px 10px rgba(124,92,252,.45);
      -webkit-tap-highlight-color:transparent;
    }
    .fm-pop-add:active { transform:scale(.88); }
    .fm-pop-add svg { pointer-events:none; }
    .fm-pop-body { padding:10px 10px 12px; }
    .fm-pop-name {
      font-size:.8rem; font-weight:800; color:var(--txt);
      letter-spacing:-.01em; line-height:1.3; margin-bottom:3px;
      display:-webkit-box; -webkit-line-clamp:2;
      -webkit-box-orient:vertical; overflow:hidden;
    }
    .fm-pop-desc {
      font-size:.67rem; color:var(--txt2); line-height:1.4;
      margin-bottom:5px; display:-webkit-box; -webkit-line-clamp:2;
      -webkit-box-orient:vertical; overflow:hidden;
    }
    .fm-pop-meta { display:flex; align-items:center; gap:7px; margin-bottom:5px; }
    .fm-pop-price {
      font-size:.92rem; font-weight:900; color:var(--txt);
      letter-spacing:-.02em;
    }

    /* Stars y sales inline */
    .fm-stars-row {
      display:inline-flex; align-items:center; gap:3px;
    }
    .fm-stars-row span { font-size:.68rem; font-weight:700; color:var(--txt2); }
    .fm-sales-row {
      display:inline-flex; align-items:center; gap:3px;
      font-size:.67rem; font-weight:700; color:var(--orange);
    }

    /* Ranking */
    .fm-ranking-section { padding:0 16px 14px; }
    .fm-ranking-card {
      background:var(--s1); border:1px solid var(--line);
      border-radius:18px; overflow:hidden;
      box-shadow:0 2px 10px rgba(0,0,0,.06);
    }
    .fm-rank-item {
      display:flex; align-items:center; gap:10px;
      padding:10px 12px; border-bottom:1px solid var(--line);
      cursor:pointer; -webkit-tap-highlight-color:transparent;
      transition:background .15s;
    }
    .fm-rank-item:last-child { border-bottom:none; }
    .fm-rank-item:active { background:var(--s2); }
    .fm-rank-num {
      width:26px; height:26px; border-radius:8px;
      display:flex; align-items:center; justify-content:center;
      font-size:.72rem; font-weight:900; color:#fff; flex-shrink:0;
    }
    .fm-rank-img {
      width:44px; height:44px; border-radius:10px; flex-shrink:0;
      background:var(--s2);
      display:flex; align-items:center; justify-content:center;
      overflow:hidden; font-size:1.4rem;
    }
    .fm-rank-info { flex:1; min-width:0; }
    .fm-rank-name {
      font-size:.78rem; font-weight:800; color:var(--txt);
      white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
    }
    .fm-rank-sales { font-size:.64rem; color:var(--txt2); margin-top:1px; }

    /* Menú categorías */
    .fm-cats-list { padding:0 16px 16px; display:flex; flex-direction:column; gap:8px; }
    .fm-cat-row {
      display:flex; align-items:center; gap:12px;
      background:var(--s1); border:1px solid var(--line);
      border-radius:14px; padding:10px 12px;
      cursor:pointer; -webkit-tap-highlight-color:transparent;
      transition:background .15s;
    }
    .fm-cat-row:active { background:var(--s2); }
    .fm-cat-row-img {
      width:48px; height:48px; border-radius:10px;
      overflow:hidden; flex-shrink:0; background:var(--s2);
      display:flex; align-items:center; justify-content:center;
    }
    .fm-cat-row-info { flex:1; min-width:0; }
    .fm-cat-row-name {
      font-size:.82rem; font-weight:800; color:var(--txt);
      letter-spacing:-.01em;
    }
    .fm-cat-row-count { font-size:.68rem; color:var(--txt2); margin-top:1px; }

    /* ── NAV FIJA — íconos SVG visibles (sin expanded) ── */
    .fnav:not(.fnav-expanded) .fn-i svg{
      width:22px; height:22px;
      stroke:currentColor; fill:none;
      stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
    }
    .fnav:not(.fnav-expanded) .fn.on .fn-i svg{ stroke-width:2.4; }
    .fnav:not(.fnav-expanded) .fn-l{
      font-size:.52rem; font-weight:700; letter-spacing:.04em;
    }