:root{
  --bg:#050914;
  --panel:rgba(255,255,255,.12);
  --panel2:rgba(255,255,255,.07);
  --line:rgba(255,255,255,.22);
  --text:#f8fbff;
  --muted:#b9c8dc;
  --blue:#46c7ff;
  --violet:#9a6dff;
  --green:#72ffc3;
}
*{box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth}
body{
  margin:0;min-height:100vh;color:var(--text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  background:
    radial-gradient(circle at 14% 4%,rgba(70,199,255,.18),transparent 34%),
    radial-gradient(circle at 84% 0%,rgba(154,109,255,.28),transparent 36%),
    linear-gradient(180deg,#081120 0%,#050914 60%,#03060d 100%);
  overflow-x:hidden;
}
button,input{font:inherit}
.noise{position:fixed;inset:0;pointer-events:none;opacity:.16;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E")}
.glow{position:fixed;border-radius:999px;filter:blur(82px);pointer-events:none;opacity:.55}
.glow-1{width:420px;height:420px;background:#2aa8ff;left:-180px;top:-130px}
.glow-2{width:520px;height:520px;background:#7e5cff;right:-190px;top:-90px}
.glow-3{width:360px;height:360px;background:#5fffd0;left:38%;bottom:-220px;opacity:.22}
.app{position:relative;max-width:1240px;margin:0 auto;padding:18px 14px 140px}
.glass{
  background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.06));
  border:1px solid var(--line);
  box-shadow:0 28px 80px rgba(0,0,0,.40), inset 0 1px 0 rgba(255,255,255,.22);
  backdrop-filter:blur(24px) saturate(160%);
  -webkit-backdrop-filter:blur(24px) saturate(160%);
}
.topbar{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  border-radius:24px;padding:14px 18px;margin-bottom:14px;
}
.topbar-left{display:flex;flex-direction:column;gap:2px}
.brand-mark,.brand,.section-title span{color:var(--blue);font-weight:950;letter-spacing:.13em;font-size:13px}
.brand-sub{color:#9eb4cb;font-size:12px}
.topnav{display:flex;gap:10px;flex-wrap:wrap}
.topnav button,.filters button,.back,.bottom-nav-btn,.product-filter-btn{
  border:1px solid rgba(255,255,255,.20);background:rgba(255,255,255,.08);color:white;
  border-radius:999px;padding:12px 16px;font-weight:900;cursor:pointer;white-space:nowrap;
  transition:.18s ease;
}
.topnav button:hover,.filters button:hover,.bottom-nav-btn:hover,.product-filter-btn:hover{background:rgba(255,255,255,.14)}
.hero{
  position:relative;min-height:620px;border-radius:34px;overflow:hidden;padding:44px;
  display:flex;align-items:flex-end;
}
.hero-bg{position:absolute;inset:0;background:url("./assets/hero.jpg") center/cover no-repeat;transform:scale(1.02);filter:brightness(1.06) saturate(1.02)}
.hero-overlay{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(3,7,14,.92) 0%,rgba(3,7,14,.70) 34%,rgba(3,7,14,.10) 74%,rgba(3,7,14,.28) 100%),
    linear-gradient(0deg,rgba(3,7,14,.80) 0%,transparent 56%);
}
.hero-content{position:relative;z-index:2;max-width:680px}
.hero h1{font-size:clamp(48px,7vw,88px);line-height:.9;letter-spacing:-.07em;margin:18px 0 18px;text-shadow:0 12px 32px rgba(0,0,0,.45)}
.hero p{font-size:18px;line-height:1.55;color:var(--muted);max-width:620px;margin:0 0 24px}
.hero-actions{display:flex;gap:12px;align-items:center;max-width:860px}
.search{
  flex:1;height:60px;border-radius:19px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.20);
  display:flex;align-items:center;gap:12px;padding:0 18px;color:#84d6ff;
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)
}
.search input{all:unset;width:100%;font-size:16px;color:white}
.search input::placeholder{color:#aebcd0}
.hero-btn,.checkout,.add,.mini-btn{
  border:0;border-radius:18px;padding:0 22px;height:60px;color:white;font-weight:950;cursor:pointer;
  background:linear-gradient(90deg,#42c7ff,#8a6dff);box-shadow:0 18px 45px rgba(81,125,255,.34)
}
.hero-btn-primary{min-width:230px;font-size:16px}
.hero-features{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}
.hero-features div{border-radius:18px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18);padding:14px 16px;backdrop-filter:blur(16px)}
.hero-features b{display:block;color:var(--green);font-size:13px}.hero-features span{font-weight:800;font-size:14px}
.trust-strip{
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:14px 0 16px;padding:12px;border-radius:22px
}
.trust-strip div{
  padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  color:#dff8ff;font-weight:800;font-size:14px;text-align:center
}
.filters{margin:0 0 28px;border-radius:22px;padding:12px;display:flex;gap:10px;overflow:auto}
.filters button.active,.product-filter-btn.active{background:linear-gradient(90deg,rgba(70,199,255,.55),rgba(154,109,255,.55));border-color:rgba(255,255,255,.36)}
.product-filters{
  display:flex;flex-wrap:wrap;gap:10px;margin:0 0 18px;padding:12px;
  border-radius:20px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12)
}
.section-title{margin:0 0 18px}.section-title.compact{margin:0 0 12px}
.section-title h2{font-size:38px;line-height:1;margin:8px 0 0;letter-spacing:-.04em}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card{
  position:relative;min-height:340px;border-radius:28px;overflow:hidden;padding:20px;cursor:pointer;
  background:linear-gradient(135deg,rgba(255,255,255,.14),rgba(255,255,255,.055));
  border:1px solid rgba(255,255,255,.20);
  box-shadow:0 24px 70px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.18);
  transition:.22s ease;
}
.card:hover{transform:translateY(-5px);border-color:rgba(80,203,255,.56);box-shadow:0 30px 82px rgba(0,0,0,.44),0 0 0 1px rgba(80,203,255,.15)}
.card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.88;transition:.25s}
.card:hover img{transform:scale(1.045);opacity:.96}
.card::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(5,9,17,.06) 0%,rgba(5,9,17,.24) 34%,rgba(5,9,17,.92) 100%),
    radial-gradient(circle at 0% 0%,rgba(255,255,255,.18),transparent 38%);
}
.mini-badge,.tag-row span{
  position:relative;z-index:1;display:inline-flex;align-items:center;gap:6px;
  border-radius:999px;padding:9px 12px;background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.22);color:#eff8ff;font-weight:800;font-size:12px;
  backdrop-filter:blur(14px)
}
.tag-row{position:relative;z-index:1;display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.card h3,.card p,.card strong,.price,.add,.price-note,.card-cta,.product-meta{position:relative;z-index:1}
.card h3{font-size:26px;line-height:1.05;margin:154px 0 10px;letter-spacing:-.03em}
.card p{margin:0;color:var(--muted);line-height:1.45}
.card-footer{position:relative;z-index:1;display:flex;align-items:end;justify-content:space-between;gap:12px;margin-top:16px}
.price-note{font-size:15px;color:#dff8ff;font-weight:900}
.price-note span{display:block;color:var(--green);font-size:22px;line-height:1.1}
.card-cta{color:#dff8ff;font-weight:900;font-size:15px}
.product-grid .card{min-height:430px}
.product-grid .card h3{margin-top:188px}
.price{font-size:25px;color:var(--green);font-weight:950;margin-top:12px}
.product-meta{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:14px}
.add{width:100%;margin-top:12px;height:52px;border-radius:16px}
.popular{margin-top:34px}
.support{margin-top:34px;padding:22px;border-radius:28px}
.support-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.support-card{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:18px;
}
.support-card b{display:block;font-size:18px;margin-bottom:8px}
.support-card p{margin:0;color:var(--muted);line-height:1.5}
.hidden{display:none!important}.back{margin-bottom:16px;border-radius:16px}
.cart-open{
  position:fixed;z-index:20;right:20px;bottom:92px;border-radius:999px;color:white;padding:14px 18px;
  display:flex;align-items:center;gap:10px;cursor:pointer
}
.cart-open b{display:grid;place-items:center;min-width:25px;height:25px;border-radius:999px;background:var(--green);color:#06101b;font-size:14px}
.cart{
  position:fixed;z-index:50;top:16px;right:16px;bottom:16px;width:420px;max-width:calc(100vw - 32px);
  border-radius:30px;padding:20px;transform:translateX(118%);transition:.25s ease
}
.cart.open{transform:translateX(0)}
.cart-head{display:flex;justify-content:space-between;align-items:flex-start}.cart-head span{color:var(--blue);font-weight:950;font-size:12px;letter-spacing:.13em}.cart-head h3{font-size:34px;margin:4px 0 0}.cart-head button{all:unset;font-size:42px;cursor:pointer}
.cart-items{max-height:58vh;overflow:auto;margin:16px 0}.cart-item{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.15)}
.cart-item small{color:var(--muted)}.cart-item button{border:0;background:rgba(255,255,255,.12);color:white;border-radius:12px;width:36px;height:36px;cursor:pointer}
.cart-total{display:flex;justify-content:space-between;align-items:center;font-size:22px;margin:18px 0}
.checkout{width:100%;height:58px}
.bottom-nav{
  position:fixed;left:50%;transform:translateX(-50%);bottom:18px;z-index:24;
  display:none;align-items:center;justify-content:space-between;gap:8px;padding:10px;border-radius:22px;
  width:min(92vw,520px)
}
.bottom-nav-btn{flex:1;text-align:center;padding:12px 10px}
@media(max-width:1080px){
  .grid{grid-template-columns:repeat(2,1fr)}
  .support-grid,.trust-strip{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:900px){
  .app{padding:10px 10px 150px}
  .topbar{padding:12px 14px;border-radius:18px}
  .topnav{display:none}
  .hero{min-height:590px;padding:22px;border-radius:26px;align-items:flex-end}
  .hero-overlay{background:linear-gradient(180deg,rgba(3,7,14,.24) 0%,rgba(3,7,14,.82) 58%,rgba(3,7,14,.96) 100%)}
  .hero-actions{flex-direction:column;align-items:stretch}.hero-btn{width:100%}.hero-features,.trust-strip,.support-grid{grid-template-columns:1fr}
  .grid{grid-template-columns:1fr}
  .filters{border-radius:18px}
  .card{min-height:320px}
  .bottom-nav{display:flex}
  .cart-open{bottom:94px}
}


/* v11 smart category filters */
.category-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  border-radius:22px;
  padding:12px;
  margin:0 0 12px;
}
.category-toolbar .back{
  margin:0;
  padding:12px 16px;
  border-radius:16px;
}
.category-toolbar-info{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:2px;
  padding-right:8px;
}
.category-toolbar-info span{
  color:var(--blue);
  font-size:12px;
  font-weight:950;
  letter-spacing:.12em;
}
.category-toolbar-info b{
  color:#dff8ff;
  font-size:14px;
}
.filter-shell{
  border-radius:22px;
  padding:12px;
  margin:0 0 18px;
}
.filter-shell-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin:0 0 10px;
}
.filter-shell-head span{
  color:#dff8ff;
  font-weight:950;
  letter-spacing:.04em;
}
.reset-filter{
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.07);
  color:#cfe1f5;
  border-radius:999px;
  padding:9px 12px;
  font-weight:900;
  cursor:pointer;
}
.product-filters{
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  display:flex;
  gap:9px;
  overflow:auto;
  flex-wrap:nowrap;
  scroll-snap-type:x proximity;
  -webkit-overflow-scrolling:touch;
}
.product-filter-btn{
  position:relative;
  display:flex;
  align-items:center;
  gap:8px;
  padding:11px 14px;
  flex:0 0 auto;
  scroll-snap-align:start;
  background:rgba(255,255,255,.07);
}
.product-filter-btn small{
  display:inline-grid;
  place-items:center;
  min-width:23px;
  height:23px;
  padding:0 7px;
  border-radius:999px;
  background:rgba(255,255,255,.13);
  color:#dff8ff;
  font-size:12px;
}
.product-filter-btn.active small{
  background:rgba(114,255,195,.22);
  color:var(--green);
}
.category-popular{
  margin-top:34px;
}
.category-popular .section-title h2{
  font-size:32px;
}
@media(max-width:900px){
  .category-toolbar{
    align-items:stretch;
  }
  .category-toolbar-info{
    align-items:flex-start;
    justify-content:center;
  }
  .product-filters{
    padding-bottom:2px;
  }
}


/* v12 visibly redesigned category filters */
.category-panel{
  border-radius:28px;
  padding:16px;
  margin:0 0 20px;
  position:relative;
  overflow:hidden;
}
.category-panel::before{
  content:"";
  position:absolute;
  inset:-60px auto auto -80px;
  width:260px;
  height:260px;
  background:radial-gradient(circle,rgba(70,199,255,.22),transparent 68%);
  pointer-events:none;
}
.category-panel-top{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:14px;
  align-items:center;
  margin-bottom:16px;
}
.category-panel .back{
  margin:0;
  border-radius:18px;
  background:rgba(255,255,255,.11);
}
.category-panel-title span{
  display:block;
  color:var(--blue);
  font-size:12px;
  font-weight:950;
  letter-spacing:.13em;
}
.category-panel-title h3{
  margin:4px 0 0;
  font-size:28px;
  line-height:1;
  letter-spacing:-.04em;
}
.category-panel-count{
  border-radius:18px;
  padding:12px 14px;
  background:rgba(114,255,195,.12);
  border:1px solid rgba(114,255,195,.24);
  color:var(--green);
  font-weight:950;
  white-space:nowrap;
}
.category-panel-filter-title{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.category-panel-filter-title span{
  color:#dff8ff;
  font-weight:950;
}
.product-filters-big{
  position:relative;
  z-index:1;
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(138px,1fr));
  gap:10px;
  padding:0;
  overflow:visible;
}
.product-filters-big .product-filter-btn{
  justify-content:space-between;
  width:100%;
  border-radius:18px;
  padding:14px 15px;
  background:rgba(255,255,255,.085);
  border:1px solid rgba(255,255,255,.16);
}
.product-filters-big .product-filter-btn.active{
  background:
    linear-gradient(135deg,rgba(70,199,255,.42),rgba(154,109,255,.42));
  border-color:rgba(255,255,255,.36);
  box-shadow:0 14px 34px rgba(77,147,255,.20),inset 0 1px 0 rgba(255,255,255,.22);
}
.product-filters-big .product-filter-btn small{
  min-width:28px;
  height:28px;
}
.category-popular{
  border-radius:28px;
  padding:20px;
  margin:0 0 28px;
}
.category-popular .card{
  min-height:330px;
}
.products-title{
  margin-top:4px;
}
.products-title h2{
  font-size:30px;
}
@media(max-width:900px){
  .category-panel-top{
    grid-template-columns:1fr;
    align-items:stretch;
  }
  .category-panel-count{
    display:inline-flex;
    justify-content:center;
  }
  .product-filters-big{
    grid-template-columns:1fr 1fr;
  }
}


/* v13 grouped filter plates for custom keyboards */
.custom-filter-groups{
  position:relative;
  z-index:1;
  margin:2px 0 4px;
}
.custom-filter-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
.custom-filter-header-left span{
  display:block;
  color:var(--blue);
  font-size:12px;
  font-weight:950;
  letter-spacing:.13em;
}
.custom-filter-header-left h4{
  margin:5px 0 0;
  font-size:24px;
  line-height:1;
  letter-spacing:-.03em;
}
.custom-filter-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.custom-filter-card{
  border-radius:22px;
  padding:14px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
}
.custom-filter-card h5{
  margin:0 0 10px;
  font-size:15px;
  color:#dff8ff;
  letter-spacing:.02em;
}
.custom-chip-wrap{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.custom-chip{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  min-height:40px;
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.065);
  color:white;
  cursor:pointer;
  font-weight:850;
  transition:.18s ease;
}
.custom-chip:hover{
  background:rgba(255,255,255,.12);
}
.custom-chip.active{
  background:linear-gradient(135deg,rgba(70,199,255,.44),rgba(154,109,255,.40));
  border-color:rgba(255,255,255,.34);
  box-shadow:0 12px 28px rgba(68,137,255,.18);
}
.custom-chip small{
  display:inline-grid;
  place-items:center;
  min-width:24px;
  height:24px;
  padding:0 7px;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  color:#dff8ff;
  font-size:12px;
}
.custom-chip.active small{
  background:rgba(114,255,195,.24);
  color:var(--green);
}
.custom-filter-summary{
  margin-top:12px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 14px;
  border-radius:18px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
}
.custom-filter-summary b{
  color:#dff8ff;
}
.custom-filter-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.custom-filter-tag{
  border-radius:999px;
  padding:8px 11px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  color:#dff8ff;
  font-size:12px;
  font-weight:800;
}
@media(max-width:900px){
  .custom-filter-grid{
    grid-template-columns:1fr;
  }
  .custom-filter-header{
    align-items:flex-start;
    flex-direction:column;
  }
}


/* v14 8 custom filter groups */
.custom-filter-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.custom-filter-card{
  min-height:140px;
}
@media(max-width:1100px){
  .custom-filter-grid{
    grid-template-columns:1fr;
  }
}


/* v15 product modal + accordion filters + checkout form */
.checkout-form-wrap{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.12)}
.checkout-title{font-size:18px;font-weight:950;margin-bottom:6px}
.checkout-note{margin:0 0 12px;color:var(--muted);font-size:13px;line-height:1.45}
.checkout-form{display:grid;gap:12px}
.field{display:grid;gap:7px}
.field span{font-size:13px;font-weight:850;color:#dff8ff}
.field input,.field textarea{
  width:100%;border-radius:16px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:white;
  padding:14px 16px;outline:none;resize:vertical;transition:.18s ease;
}
.field input::placeholder,.field textarea::placeholder{color:#aebcd0}
.field input:focus,.field textarea:focus{border-color:rgba(70,199,255,.42);box-shadow:0 0 0 3px rgba(70,199,255,.10)}
.checkout-error,.checkout-success{margin-top:12px;border-radius:14px;padding:12px 14px;font-size:13px;font-weight:800}
.checkout-error{background:rgba(255,80,80,.12);border:1px solid rgba(255,80,80,.24);color:#ffd6d6}
.checkout-success{background:rgba(114,255,195,.12);border:1px solid rgba(114,255,195,.22);color:#d8fff2}
.hidden{display:none!important}

.card.card-clickable{cursor:pointer}
.card-quick-actions{display:flex;gap:10px;margin-top:12px}
.card-quick-actions .mini-btn,.card-quick-actions .add{flex:1;height:48px;border-radius:14px}
.card-quick-actions .mini-btn{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16)}

.modal{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:20px}
.modal-backdrop{position:absolute;inset:0;background:rgba(3,7,14,.68);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.modal-dialog{position:relative;z-index:1;width:min(1080px,100%);max-height:min(92vh,900px);overflow:auto;border-radius:28px;padding:18px}
.modal-close{position:absolute;right:14px;top:14px;width:42px;height:42px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);color:#fff;font-size:24px;cursor:pointer;z-index:2}
.modal-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:18px}
.modal-media{border-radius:22px;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);min-height:360px}
.modal-media img{width:100%;height:100%;object-fit:cover;display:block}
.modal-content{display:flex;flex-direction:column;gap:14px;padding:8px 4px 6px}
.modal-badge{display:inline-flex;align-items:center;justify-content:center;width:max-content;padding:9px 12px;border-radius:999px;background:rgba(70,199,255,.14);border:1px solid rgba(70,199,255,.22);color:#dff8ff;font-size:12px;font-weight:950;letter-spacing:.12em}
.modal-content h3{margin:0;font-size:34px;line-height:1;letter-spacing:-.04em}
.modal-desc{margin:0;color:var(--muted);line-height:1.6;font-size:15px}
.modal-tags{margin-top:-2px}
.spec-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:4px}
.spec-item{border-radius:18px;padding:14px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12)}
.spec-item small{display:block;color:#9adfff;font-weight:900;font-size:11px;letter-spacing:.1em;margin-bottom:7px}
.spec-item b{display:block;font-size:15px;line-height:1.35}
.modal-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-top:auto;padding-top:8px}
.modal-price-block span{display:block;color:var(--muted);font-size:13px;margin-bottom:4px}
.modal-price-block b{font-size:30px;color:var(--green)}
.modal-actions{display:flex;gap:10px;flex-wrap:wrap}
.modal-actions .modal-add{min-width:170px;height:54px}

.filter-accordion-wrap{display:grid;gap:10px}
.filter-accordion{border-radius:20px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.055);overflow:hidden}
.filter-accordion.open{background:rgba(255,255,255,.07);box-shadow:0 18px 44px rgba(15,21,42,.18)}
.filter-head{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;background:transparent;border:0;color:white;padding:16px 18px;cursor:pointer;text-align:left}
.filter-head strong{display:block;font-size:15px}
.filter-head small{display:block;color:var(--muted);font-size:12px;margin-top:4px;font-weight:700}
.filter-arrow{width:34px;height:34px;border-radius:999px;border:1px solid rgba(255,255,255,.15);display:grid;place-items:center;background:rgba(255,255,255,.06);font-size:14px;transition:.2s ease}
.filter-accordion.open .filter-arrow{transform:rotate(180deg);background:rgba(70,199,255,.16);border-color:rgba(70,199,255,.24)}
.filter-body{display:none;padding:0 16px 16px}
.filter-accordion.open .filter-body{display:block}
.filter-option-list{display:grid;gap:10px}
.filter-option{
  width:100%;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;text-align:left;
  border-radius:18px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);padding:14px 14px;cursor:pointer;color:white
}
.filter-option:hover{background:rgba(255,255,255,.1)}
.filter-option.active{background:linear-gradient(135deg,rgba(70,199,255,.24),rgba(154,109,255,.18));border-color:rgba(255,255,255,.24)}
.filter-option-title{display:block;font-weight:900}
.filter-option-desc{display:block;color:var(--muted);font-size:12px;line-height:1.45;margin-top:4px}
.filter-option-count{display:grid;place-items:center;min-width:30px;height:30px;padding:0 8px;border-radius:999px;background:rgba(255,255,255,.12);font-size:12px;font-weight:900;color:#dff8ff}
.filter-option.active .filter-option-count{background:rgba(114,255,195,.18);color:var(--green)}
.custom-filter-header-left h4{font-size:28px;line-height:1.1}
.custom-filter-grid{display:block}
.custom-filter-summary{margin-top:14px}

@media(max-width:900px){
  .modal-grid{grid-template-columns:1fr}
  .modal-content h3{font-size:28px}
  .spec-grid{grid-template-columns:1fr}
  .modal-bottom{flex-direction:column;align-items:flex-start}
}


/* v16 fixes: switch filters + safer modal/cart */
.switch-filter-note{
  grid-column:1/-1;
  border-radius:20px;
  padding:14px 16px;
  background:rgba(70,199,255,.08);
  border:1px solid rgba(70,199,255,.18);
  color:#dff8ff;
  font-weight:800;
  margin-bottom:4px;
}


/* v17: minimal switch filters as two long dropdown plates */
.switch-filter-note{
  display:none !important;
}
.switch-dropdown-filters{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  width:100%;
}
.switch-select-card{
  position:relative;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.18);
  background:
    linear-gradient(135deg,rgba(70,199,255,.12),rgba(154,109,255,.10)),
    rgba(255,255,255,.065);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 18px 44px rgba(0,0,0,.20);
  overflow:hidden;
}
.switch-select-card.open{
  border-color:rgba(70,199,255,.44);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 18px 48px rgba(70,199,255,.13),
    0 0 0 1px rgba(154,109,255,.13);
}
.switch-select-head{
  width:100%;
  min-height:86px;
  border:0;
  color:white;
  background:transparent;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:18px 22px;
  text-align:left;
}
.switch-select-head span{
  display:block;
  color:#a9bfd5;
  font-size:14px;
  font-weight:950;
  margin-bottom:7px;
}
.switch-select-head b{
  display:block;
  font-size:24px;
  line-height:1;
  letter-spacing:-.03em;
}
.switch-select-arrow{
  width:42px;
  height:42px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.07);
  font-size:20px;
  transition:.18s ease;
}
.switch-select-card.open .switch-select-arrow{
  transform:rotate(180deg);
  background:rgba(70,199,255,.16);
}
.switch-select-menu{
  display:none;
  padding:0 14px 14px;
}
.switch-select-card.open .switch-select-menu{
  display:grid;
  gap:9px;
}
.switch-select-option{
  width:100%;
  border:1px solid rgba(255,255,255,.12);
  border-radius:17px;
  background:rgba(255,255,255,.065);
  color:white;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:13px 14px;
  text-align:left;
  cursor:pointer;
}
.switch-select-option:hover{
  background:rgba(255,255,255,.10);
}
.switch-select-option.active{
  background:linear-gradient(135deg,rgba(70,199,255,.24),rgba(154,109,255,.22));
  border-color:rgba(255,255,255,.26);
}
.switch-option-title{
  display:block;
  font-weight:950;
}
.switch-option-desc{
  display:block;
  color:var(--muted);
  font-size:12px;
  line-height:1.35;
  margin-top:4px;
}
.switch-option-count{
  display:grid;
  place-items:center;
  min-width:30px;
  height:30px;
  padding:0 8px;
  border-radius:999px;
  background:rgba(255,255,255,.12);
  color:#dff8ff;
  font-size:12px;
  font-weight:950;
}
.switch-select-option.active .switch-option-count{
  color:var(--green);
  background:rgba(114,255,195,.18);
}
.switch-filter-summary{
  grid-column:1/-1;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border-radius:18px;
  padding:12px 14px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.12);
}
.switch-filter-summary b{
  color:#dff8ff;
}
.switch-filter-summary button{
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.07);
  color:#cfe1f5;
  border-radius:999px;
  padding:10px 12px;
  font-weight:900;
  cursor:pointer;
}
@media(max-width:900px){
  .switch-dropdown-filters{
    grid-template-columns:1fr;
  }
  .switch-select-head{
    min-height:76px;
  }
}


/* v18: keycaps filters same visual style as switches */
.keycaps-dropdown-filters{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  width:100%;
}
@media(max-width:900px){
  .keycaps-dropdown-filters{grid-template-columns:1fr;}
}


/* v19: top category tabs can open single-category sections directly */


/* v20: responsive polish for phones, tablets and laptops */

/* General safety */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}
img {
  max-width: 100%;
}
.app {
  width: 100%;
}

/* Laptop / compact desktop */
@media (max-width: 1280px) {
  .app {
    max-width: 1120px;
    padding-left: 18px;
    padding-right: 18px;
  }

  .hero {
    min-height: 560px;
    padding: 36px;
  }

  .hero h1 {
    font-size: clamp(44px, 6vw, 72px);
  }

  .grid {
    gap: 14px;
  }

  .card {
    min-height: 320px;
  }

  .product-grid .card {
    min-height: 400px;
  }

  .card h3 {
    margin-top: 135px;
  }

  .product-grid .card h3 {
    margin-top: 165px;
  }
}

/* Small laptops */
@media (max-width: 1180px) {
  .topbar {
    align-items: flex-start;
  }

  .topnav {
    justify-content: flex-end;
  }

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

  .trust-strip,
  .support-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .switch-dropdown-filters,
  .keycaps-dropdown-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .modal-dialog {
    width: min(980px, calc(100vw - 32px));
  }
}

/* Tablets */
@media (max-width: 920px) {
  .app {
    padding: 10px 10px 150px;
  }

  .topbar {
    position: sticky;
    top: 8px;
    z-index: 30;
    border-radius: 20px;
    padding: 12px 14px;
  }

  .brand-mark {
    font-size: 12px;
  }

  .brand-sub {
    font-size: 11px;
  }

  .topnav {
    display: none;
  }

  .hero {
    min-height: 560px;
    border-radius: 26px;
    padding: 24px;
    align-items: flex-end;
  }

  .hero-bg {
    background-position: center;
  }

  .hero-overlay {
    background:
      linear-gradient(180deg, rgba(3,7,14,.18) 0%, rgba(3,7,14,.72) 48%, rgba(3,7,14,.96) 100%);
  }

  .hero h1 {
    font-size: clamp(40px, 10vw, 64px);
  }

  .hero p {
    font-size: 16px;
  }

  .hero-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .search {
    width: 100%;
    height: 56px;
  }

  .hero-btn {
    width: 100%;
    height: 56px;
  }

  .hero-features {
    grid-template-columns: 1fr;
  }

  .trust-strip,
  .support-grid {
    grid-template-columns: 1fr;
  }

  .filters {
    position: sticky;
    top: 76px;
    z-index: 25;
    overflow-x: auto;
    padding: 10px;
    margin-bottom: 22px;
    scrollbar-width: none;
  }

  .filters::-webkit-scrollbar {
    display: none;
  }

  .filters button {
    flex: 0 0 auto;
    padding: 11px 15px;
    font-size: 14px;
  }

  .section-title h2 {
    font-size: 34px;
  }

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

  .card {
    min-height: 310px;
    border-radius: 24px;
  }

  .product-grid .card {
    min-height: 390px;
  }

  .card h3 {
    margin-top: 140px;
    font-size: 24px;
  }

  .product-grid .card h3 {
    margin-top: 160px;
  }

  .category-panel {
    border-radius: 24px;
    padding: 14px;
  }

  .category-panel-top {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .category-panel .back {
    width: 100%;
  }

  .category-panel-count {
    justify-content: center;
    text-align: center;
  }

  .category-panel-title h3 {
    font-size: 26px;
  }

  .switch-dropdown-filters,
  .keycaps-dropdown-filters {
    grid-template-columns: 1fr;
  }

  .switch-select-head {
    min-height: 78px;
    padding: 16px 18px;
  }

  .switch-select-head b {
    font-size: 22px;
  }

  .switch-filter-summary {
    align-items: stretch;
  }

  .switch-filter-summary button {
    width: 100%;
  }

  .custom-filter-header {
    flex-direction: column;
    align-items: stretch;
  }

  .custom-filter-header-left h4 {
    font-size: 24px;
  }

  .filter-head {
    padding: 15px 16px;
  }

  .filter-option {
    padding: 13px;
  }

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

  .modal-dialog {
    width: 100%;
    max-height: 92vh;
    border-radius: 26px 26px 18px 18px;
    padding: 14px;
  }

  .modal-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .modal-media {
    min-height: 260px;
    max-height: 38vh;
  }

  .modal-content h3 {
    font-size: 28px;
  }

  .modal-bottom {
    flex-direction: column;
    align-items: stretch;
  }

  .modal-actions {
    width: 100%;
  }

  .modal-actions .mini-btn,
  .modal-actions .modal-add {
    flex: 1;
  }

  .cart {
    inset: auto 10px 10px 10px;
    top: auto;
    width: auto;
    max-width: none;
    max-height: 88vh;
    border-radius: 26px;
    transform: translateY(112%);
    overflow: auto;
  }

  .cart.open {
    transform: translateY(0);
  }

  .cart-items {
    max-height: 30vh;
  }

  .bottom-nav {
    display: flex;
  }

  .cart-open {
    right: 16px;
    bottom: 92px;
  }
}

/* Phones */
@media (max-width: 560px) {
  .app {
    padding-left: 8px;
    padding-right: 8px;
  }

  .topbar {
    border-radius: 18px;
  }

  .hero {
    min-height: 520px;
    padding: 20px;
    border-radius: 24px;
  }

  .brand {
    font-size: 11px;
  }

  .hero h1 {
    font-size: 42px;
    letter-spacing: -0.065em;
  }

  .hero p {
    font-size: 15px;
    line-height: 1.48;
  }

  .search {
    height: 54px;
    border-radius: 17px;
    padding: 0 14px;
  }

  .search input {
    font-size: 14px;
  }

  .hero-btn,
  .checkout,
  .add,
  .mini-btn {
    height: 54px;
  }

  .hero-features div,
  .trust-strip div,
  .support-card {
    padding: 13px 14px;
  }

  .filters {
    top: 70px;
    border-radius: 18px;
  }

  .filters button {
    padding: 10px 13px;
    font-size: 13px;
  }

  .section-title {
    margin-bottom: 14px;
  }

  .section-title h2 {
    font-size: 31px;
  }

  .card {
    min-height: 300px;
    padding: 16px;
    border-radius: 22px;
  }

  .product-grid .card {
    min-height: 382px;
  }

  .card h3 {
    margin-top: 132px;
    font-size: 23px;
  }

  .product-grid .card h3 {
    margin-top: 150px;
  }

  .card p {
    font-size: 14px;
  }

  .price {
    font-size: 23px;
  }

  .card-footer {
    align-items: flex-end;
  }

  .card-quick-actions {
    flex-direction: column;
  }

  .category-panel {
    border-radius: 22px;
    padding: 12px;
  }

  .category-panel-title h3 {
    font-size: 24px;
  }

  .category-panel-filter-title {
    align-items: stretch;
    flex-direction: column;
  }

  .reset-filter {
    width: 100%;
  }

  .switch-select-card {
    border-radius: 20px;
  }

  .switch-select-head {
    min-height: 72px;
    padding: 15px 16px;
  }

  .switch-select-head span {
    font-size: 13px;
  }

  .switch-select-head b {
    font-size: 20px;
  }

  .switch-select-arrow {
    width: 38px;
    height: 38px;
  }

  .switch-select-option {
    border-radius: 15px;
    padding: 12px;
  }

  .filter-accordion {
    border-radius: 18px;
  }

  .filter-head {
    padding: 14px;
  }

  .filter-option-list {
    gap: 8px;
  }

  .custom-filter-tag {
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  .category-popular {
    padding: 14px;
    border-radius: 22px;
  }

  .spec-grid {
    grid-template-columns: 1fr;
  }

  .modal-media {
    min-height: 220px;
    max-height: 32vh;
  }

  .modal-content h3 {
    font-size: 25px;
  }

  .modal-desc {
    font-size: 14px;
  }

  .modal-actions {
    flex-direction: column;
  }

  .modal-actions .mini-btn,
  .modal-actions .modal-add {
    width: 100%;
  }

  .cart {
    padding: 16px;
  }

  .cart-head h3 {
    font-size: 30px;
  }

  .checkout-form-wrap {
    margin-top: 14px;
  }

  .field input,
  .field textarea {
    border-radius: 14px;
    padding: 13px 14px;
  }

  .bottom-nav {
    width: calc(100vw - 16px);
    bottom: 10px;
    padding: 8px;
    border-radius: 18px;
  }

  .bottom-nav-btn {
    font-size: 12px;
    padding: 10px 7px;
  }

  .cart-open {
    right: 12px;
    bottom: 78px;
    padding: 12px 15px;
  }
}

/* Very small phones */
@media (max-width: 380px) {
  .hero h1 {
    font-size: 36px;
  }

  .section-title h2 {
    font-size: 28px;
  }

  .card h3 {
    font-size: 21px;
  }

  .switch-select-head b {
    font-size: 18px;
  }

  .mini-badge,
  .tag-row span {
    font-size: 11px;
    padding: 8px 10px;
  }

  .bottom-nav-btn {
    font-size: 11px;
  }
}

/* Touch devices */
@media (hover: none) and (pointer: coarse) {
  .card:hover {
    transform: none;
  }

  .card:hover img {
    transform: none;
  }

  .topnav button,
  .filters button,
  .back,
  .bottom-nav-btn,
  .product-filter-btn,
  .switch-select-head,
  .switch-select-option,
  .filter-head,
  .filter-option,
  .mini-btn,
  .add,
  .checkout {
    -webkit-tap-highlight-color: transparent;
  }
}


/* v21: expanded top category tabs */
.filters {
  align-items: center;
}
.filters button {
  flex: 0 0 auto;
}
@media (max-width: 920px) {
  .filters {
    gap: 8px;
  }
  .filters button {
    font-size: 13px;
    padding: 10px 13px;
  }
}
@media (max-width: 560px) {
  .filters button {
    font-size: 12px;
    padding: 10px 12px;
  }
}


/* v22: custom keyboard filters as minimal dropdown plates like switches/keycaps */
.custom-filter-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 14px !important;
}
.custom-filter-groups .switch-select-card {
  min-height: auto;
}
.custom-filter-groups .switch-select-head {
  min-height: 82px;
}
.custom-filter-groups .switch-filter-summary {
  margin-top: 14px;
}
.custom-filter-summary {
  display: none !important;
}
@media (max-width: 920px) {
  .custom-filter-grid {
    grid-template-columns: 1fr !important;
  }
}


/* v23: ready keyboards filters in the same visual style as switches/keycaps */
.keyboard-dropdown-filters{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:14px;
  width:100%;
}
@media(max-width:920px){
  .keyboard-dropdown-filters{grid-template-columns:1fr;}
}


/* v24 clean build: force dropdown filters for ready keyboards */
.keyboard-dropdown-filters{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  width:100%;
}
@media(max-width:920px){
  .keyboard-dropdown-filters{grid-template-columns:1fr;}
}


/* v25: focused mobile fixes for phones / Safari / Telegram in-app browser */
:root{
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}
body{
  padding-bottom: var(--safe-bottom);
}
@media (max-width: 920px){
  .app{
    padding-top: calc(8px + var(--safe-top));
    padding-bottom: calc(136px + var(--safe-bottom));
  }
  .cart-open{
    bottom: calc(88px + var(--safe-bottom));
  }
  .bottom-nav{
    bottom: calc(10px + var(--safe-bottom));
  }
  .modal{
    padding-bottom: calc(10px + var(--safe-bottom));
  }
}
@media (max-width: 560px){
  /* on phones keep only the bottom navigation to avoid double navigation bars */
  .topbar{
    display:none;
  }
  .app{
    padding-top: calc(6px + var(--safe-top));
    padding-left: 8px;
    padding-right: 8px;
    padding-bottom: calc(128px + var(--safe-bottom));
  }
  .hero{
    min-height: 430px;
    padding: 18px;
    border-radius: 22px;
    align-items:flex-end;
  }
  .hero-bg{
    background-position: 62% center;
  }
  .hero h1{
    font-size: 34px;
    line-height: .95;
    margin: 10px 0 12px;
  }
  .hero p{
    font-size: 14px;
    line-height: 1.42;
    margin-bottom: 16px;
  }
  .hero-actions{
    gap:10px;
  }
  .search,
  .hero-btn,
  .checkout,
  .add,
  .mini-btn{
    height: 50px;
    border-radius: 15px;
  }
  .search{
    padding: 0 12px;
  }
  .search svg{
    width:18px;
    height:18px;
  }
  .hero-features{
    gap:10px;
    margin-top:12px;
  }
  .hero-features div{
    padding:12px 13px;
    border-radius:16px;
  }
  .hero-features span{
    font-size:13px;
  }
  .trust-strip{
    grid-template-columns:1fr;
    gap:8px;
    padding:10px;
    margin-top:12px;
    margin-bottom:14px;
    border-radius:18px;
  }
  .trust-strip div{
    padding:12px 14px;
    border-radius:14px;
    font-size:13px;
  }
  .filters{
    top: calc(6px + var(--safe-top));
    padding: 8px;
    gap: 8px;
    border-radius: 16px;
    margin-bottom: 18px;
  }
  .filters button{
    padding: 9px 12px;
    font-size: 12px;
    font-weight: 850;
  }
  .section-title h2{
    font-size: 28px;
  }
  .section-title span{
    font-size: 11px;
  }
  .card{
    min-height: 248px;
    padding: 14px;
    border-radius: 20px;
  }
  .product-grid .card{
    min-height: 324px;
  }
  .card img,
  .product-grid .card img{
    opacity:.83;
  }
  .card h3{
    margin-top: 98px;
    font-size: 21px;
    margin-bottom: 8px;
  }
  .product-grid .card h3{
    margin-top: 122px;
  }
  .card p{
    font-size: 13px;
    line-height: 1.35;
  }
  .mini-badge,
  .tag-row span{
    padding: 6px 9px;
    font-size: 10px;
  }
  .price{
    font-size: 20px;
    margin-top:8px;
  }
  .price-note{
    font-size:13px;
  }
  .price-note span{
    font-size:18px;
  }
  .card-quick-actions{
    gap:8px;
    margin-top:10px;
  }
  .card-quick-actions .mini-btn,
  .card-quick-actions .add{
    height:44px;
    border-radius:13px;
    font-size:14px;
  }
  .category-panel,
  .category-popular,
  .support{
    border-radius:20px;
    padding:12px;
  }
  .category-panel-title h3,
  .category-popular .section-title h2,
  .products-title h2{
    font-size:24px;
  }
  .category-panel-count{
    padding:10px 12px;
    font-size:13px;
  }
  .switch-select-card,
  .filter-accordion{
    border-radius:18px;
  }
  .switch-select-head{
    min-height:64px;
    padding:13px 14px;
  }
  .switch-select-head span{
    font-size:12px;
    margin-bottom:4px;
  }
  .switch-select-head b{
    font-size:18px;
  }
  .switch-select-arrow,
  .filter-arrow{
    width:34px;
    height:34px;
    font-size:16px;
  }
  .switch-select-menu{
    padding: 0 10px 10px;
  }
  .switch-select-option,
  .filter-option{
    padding:11px 12px;
    border-radius:14px;
  }
  .switch-option-title,
  .filter-option-title{
    font-size:14px;
  }
  .switch-option-desc,
  .filter-option-desc{
    font-size:11px;
  }
  .switch-option-count,
  .filter-option-count,
  .product-filter-btn small{
    min-width:26px;
    height:26px;
    font-size:11px;
  }
  .filter-head{
    padding:13px 14px;
  }
  .filter-head strong{
    font-size:14px;
  }
  .filter-head small{
    font-size:11px;
  }
  .modal{
    padding:8px;
    align-items:flex-end;
  }
  .modal-dialog{
    max-height: calc(100vh - 16px - var(--safe-top));
    border-radius: 22px 22px 16px 16px;
    padding: 12px;
  }
  .modal-close{
    width:36px;
    height:36px;
    font-size:20px;
    top:10px;
    right:10px;
  }
  .modal-media{
    min-height: 180px;
    max-height: 24vh;
    border-radius:16px;
  }
  .modal-content{
    gap:10px;
    padding:4px 2px 2px;
  }
  .modal-badge{
    padding:7px 10px;
    font-size:10px;
  }
  .modal-content h3{
    font-size:22px;
  }
  .modal-desc{
    font-size:13px;
    line-height:1.42;
  }
  .spec-item{
    border-radius:14px;
    padding:11px;
  }
  .spec-item b{
    font-size:14px;
  }
  .modal-price-block b{
    font-size:24px;
  }
  .modal-actions .mini-btn,
  .modal-actions .modal-add{
    min-width:0;
    height:48px;
  }
  .cart-open{
    right: 10px;
    bottom: calc(82px + var(--safe-bottom));
    padding: 10px 13px;
    gap: 8px;
    border-radius: 999px;
  }
  .cart-open span{
    font-size: 14px;
    line-height: 1;
  }
  .cart-open b{
    min-width: 22px;
    height: 22px;
    font-size: 12px;
  }
  .cart{
    inset: auto 8px calc(8px + var(--safe-bottom)) 8px;
    max-height: calc(84vh - var(--safe-bottom));
    border-radius: 22px;
    padding: 14px;
  }
  .cart-head h3{
    font-size: 26px;
  }
  .cart-head button{
    font-size: 34px;
  }
  .cart-total{
    font-size: 18px;
    margin: 14px 0;
  }
  .bottom-nav{
    width: calc(100vw - 16px);
    bottom: calc(8px + var(--safe-bottom));
    padding: 7px;
    gap: 7px;
    border-radius: 16px;
  }
  .bottom-nav-btn{
    font-size: 11px;
    padding: 9px 5px;
    border-radius: 14px;
  }
}
@media (max-width: 380px){
  .hero{
    min-height: 400px;
    padding: 16px;
  }
  .hero h1{
    font-size: 30px;
  }
  .card{
    min-height: 236px;
  }
  .product-grid .card{
    min-height: 308px;
  }
  .card h3{
    margin-top: 90px;
    font-size: 19px;
  }
  .product-grid .card h3{
    margin-top: 114px;
  }
  .filters button,
  .bottom-nav-btn{
    font-size: 11px;
  }
}


/* v28: base filters in compact rows instead of one long column */
.base-dropdown-filters{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  align-items:start;
  width:100%;
}
.base-dropdown-filters .switch-filter-summary{
  grid-column:1/-1;
}
@media (max-width:1280px){
  .base-dropdown-filters{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:920px){
  .base-dropdown-filters{
    grid-template-columns:1fr;
  }
}


/* v29: mobile base filters should not become a long single column */
@media (max-width:920px){
  .base-dropdown-filters{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px;
  }

  .base-dropdown-filters .switch-select-head{
    min-height:58px;
    padding:11px 12px;
  }

  .base-dropdown-filters .switch-select-head span{
    font-size:11px;
    margin-bottom:3px;
  }

  .base-dropdown-filters .switch-select-head b{
    font-size:15px;
    line-height:1.05;
  }

  .base-dropdown-filters .switch-select-arrow{
    width:30px;
    height:30px;
    font-size:14px;
  }

  .base-dropdown-filters .switch-select-card{
    border-radius:16px;
  }

  .base-dropdown-filters .switch-select-menu{
    padding:0 8px 8px;
  }

  .base-dropdown-filters .switch-select-option{
    padding:10px 10px;
    border-radius:13px;
  }

  .base-dropdown-filters .switch-option-title{
    font-size:13px;
  }

  .base-dropdown-filters .switch-option-desc{
    display:none;
  }

  .base-dropdown-filters .switch-option-count{
    min-width:24px;
    height:24px;
    font-size:10px;
  }

  .base-dropdown-filters .switch-filter-summary{
    grid-column:1/-1;
  }
}

/* on very narrow phones still keep 2 columns, but make the text tighter */
@media (max-width:380px){
  .base-dropdown-filters{
    gap:8px;
  }

  .base-dropdown-filters .switch-select-head{
    min-height:54px;
    padding:10px 10px;
  }

  .base-dropdown-filters .switch-select-head span{
    font-size:10px;
  }

  .base-dropdown-filters .switch-select-head b{
    font-size:14px;
  }

  .base-dropdown-filters .switch-select-arrow{
    width:28px;
    height:28px;
  }
}


/* v30: ready keyboard filters include color and stay compact on mobile */
@media(max-width:920px){
  .keyboard-dropdown-filters{grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:10px;}
}
@media(max-width:420px){
  .keyboard-dropdown-filters{grid-template-columns:1fr !important;}
}


/* v32: size and color sit next to each other; opened lists are compact and visual */
.switch-select-card[data-group="size"].open,
.switch-select-card[data-group="color"].open{
  grid-column:1/-1;
}

/* Size opens as compact tiles, not a long list */
.switch-select-card[data-group="size"] .switch-select-menu{
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:8px;
}
.switch-select-card[data-group="size"] .switch-select-option{
  min-height:58px;
  align-items:center;
  padding:12px;
}
.switch-select-card[data-group="size"] .switch-option-desc{
  display:none;
}
.switch-select-card[data-group="size"] .switch-option-title{
  font-size:15px;
}

/* Color opens with round color swatches */
.switch-select-card[data-group="color"] .switch-select-menu{
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:8px;
  max-height:360px;
  overflow:auto;
  padding-right:8px;
}
.switch-select-card[data-group="color"] .switch-select-option{
  min-height:56px;
  align-items:center;
  padding:10px;
}
.switch-select-card[data-group="color"] .switch-option-desc{
  display:none;
}
.switch-select-card[data-group="color"] .switch-select-option > div{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0;
}
.color-swatch{
  width:22px;
  height:22px;
  border-radius:999px;
  display:inline-block;
  flex:0 0 auto;
  border:1px solid rgba(255,255,255,.42);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25), 0 4px 10px rgba(0,0,0,.18);
}
.color-all{background:linear-gradient(135deg,#45c7ff,#8d61ff,#61ffc7);}
.color-black{background:#08090d}.color-white{background:#f4f5f8}.color-gray{background:#8a8f98}.color-silver{background:#c8ccd3}.color-graphite{background:#303744}
.color-titanium{background:#8e8a80}.color-blue{background:#1655d9}.color-sky{background:#62b6ff}.color-turquoise{background:#19c7c9}.color-green{background:#1e9a5a}
.color-olive{background:#6f7b32}.color-mint{background:#98f0c8}.color-yellow{background:#ffd94a}.color-orange{background:#ff8b2b}.color-red{background:#e53935}
.color-burgundy{background:#7b1832}.color-pink{background:#ff8fc8}.color-purple{background:#7c3cff}.color-lavender{background:#b8a3ff}.color-beige{background:#d8c2a3}
.color-cream{background:#fff1cf}.color-brown{background:#7b4b2a}.color-copper{background:#b86b3d}.color-gold{background:#d4af37}.color-bronze{background:#8c6239}
.color-clear{background:linear-gradient(135deg,rgba(255,255,255,.8),rgba(255,255,255,.18));}.color-smoke{background:#5f6570}.color-peach{background:#ffb087}.color-emerald{background:#008f6b}.color-darkgray{background:#22252c}

@media(max-width:920px){
  .switch-select-card[data-group="size"] .switch-select-menu{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .switch-select-card[data-group="color"] .switch-select-menu{
    grid-template-columns:repeat(3,minmax(0,1fr));
    max-height:320px;
  }
  .switch-select-card[data-group="size"] .switch-select-option,
  .switch-select-card[data-group="color"] .switch-select-option{
    min-height:48px;
    padding:9px;
  }
  .switch-select-card[data-group="size"] .switch-option-title,
  .switch-select-card[data-group="color"] .switch-option-title{
    font-size:13px;
  }
  .color-swatch{
    width:18px;
    height:18px;
  }
}
@media(max-width:380px){
  .switch-select-card[data-group="size"] .switch-select-menu,
  .switch-select-card[data-group="color"] .switch-select-menu{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}


/* v34: quick choice row for custom keyboards */
.quick-filter-row{
  grid-column:1/-1;
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 14px;
  border-radius:20px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.12);
}
.quick-filter-title{
  flex:0 0 auto;
  color:#dff8ff;
  font-weight:950;
  font-size:14px;
}
.quick-filter-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.quick-filter-chip{
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.07);
  color:#fff;
  border-radius:999px;
  padding:10px 14px;
  font-weight:900;
  cursor:pointer;
  transition:.18s ease;
}
.quick-filter-chip:hover{
  background:rgba(255,255,255,.12);
}
.quick-filter-chip.active{
  background:linear-gradient(135deg,rgba(70,199,255,.45),rgba(154,109,255,.42));
  border-color:rgba(255,255,255,.32);
  box-shadow:0 12px 28px rgba(70,199,255,.16);
}
@media(max-width:920px){
  .quick-filter-row{
    align-items:flex-start;
    flex-direction:column;
    gap:10px;
  }
  .quick-filter-list{
    width:100%;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .quick-filter-chip{
    padding:10px 11px;
    font-size:13px;
  }
}


/* v35: visual filter panel like reference mockup */
.custom-visual-panel{
  border-radius:28px;
  padding:18px;
  background:
    radial-gradient(circle at 14% 15%, rgba(58,199,255,.13), transparent 34%),
    radial-gradient(circle at 84% 22%, rgba(154,109,255,.16), transparent 36%),
    rgba(5,14,36,.42);
  border:1px solid rgba(126,168,255,.20);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

.custom-panel-section{
  border-radius:24px;
  padding:16px;
  margin-bottom:12px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.09);
}

.panel-section-title{
  display:flex;
  align-items:center;
  gap:10px;
  color:#d7e7ff;
  font-size:15px;
  font-weight:950;
  margin-bottom:12px;
}
.panel-section-title span{
  width:12px;
  height:12px;
  border-radius:999px;
  background:linear-gradient(135deg,#42c7ff,#8d5cff);
  box-shadow:0 0 18px rgba(98,116,255,.65);
}

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

.custom-main-grid .switch-select-card{
  border-radius:22px;
  background:
    linear-gradient(135deg,rgba(64,143,255,.14),rgba(115,78,255,.10)),
    rgba(255,255,255,.055);
  border-color:rgba(130,170,255,.20);
}

.custom-main-grid .switch-select-card.open{
  grid-column:span 2;
}

.filter-card-left{
  display:flex;
  align-items:center;
  gap:13px;
  min-width:0;
}

.filter-card-icon{
  width:38px;
  height:38px;
  border-radius:12px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  color:#dff8ff;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);
  font-size:18px;
}

.custom-main-grid .switch-select-head{
  min-height:78px;
  padding:16px 18px;
}

.custom-main-grid .switch-select-head span{
  font-size:14px;
  color:#b9c7df;
  margin-bottom:5px;
}

.custom-main-grid .switch-select-head b{
  font-size:17px;
}

.quick-filter-row{
  margin:10px 0 8px;
  border-radius:22px;
  background:rgba(255,255,255,.04);
  border-color:rgba(126,168,255,.16);
}

.quick-filter-title{
  font-size:15px;
  color:#d7e7ff;
}

.quick-filter-chip{
  min-width:82px;
  border-radius:14px;
  padding:11px 15px;
  background:rgba(8,22,54,.62);
  border-color:rgba(126,168,255,.18);
}
.quick-filter-chip.active{
  background:linear-gradient(135deg,rgba(105,72,255,.65),rgba(50,173,255,.65));
  box-shadow:0 0 18px rgba(79,137,255,.35);
}

.active-filter-row{
  grid-column:1/-1;
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 16px;
  border-radius:22px;
  margin:8px 0;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(126,168,255,.12);
}
.active-filter-title{
  color:#d7e7ff;
  font-weight:950;
  flex:0 0 auto;
}
.active-filter-empty{
  color:#94a6c1;
  font-size:13px;
  font-weight:800;
}
.active-filter-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.active-filter-chip{
  border:1px solid rgba(126,168,255,.22);
  background:rgba(100,85,255,.18);
  color:#fff;
  border-radius:999px;
  padding:9px 13px;
  font-weight:900;
  cursor:pointer;
}
.active-filter-chip span{
  opacity:.85;
  margin-left:6px;
}

.custom-result-bar{
  margin-top:10px;
  border-radius:22px;
}
.result-note{
  color:#aebbd0;
  font-weight:800;
  font-size:13px;
}

@media(max-width:1180px){
  .custom-main-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:680px){
  .custom-visual-panel{
    padding:12px;
    border-radius:22px;
  }
  .custom-panel-section{
    padding:12px;
    border-radius:18px;
  }
  .custom-main-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
  }
  .custom-main-grid .switch-select-card.open{
    grid-column:1/-1;
  }
  .filter-card-icon{
    display:none;
  }
  .custom-main-grid .switch-select-head{
    min-height:62px;
    padding:12px 13px;
  }
  .custom-main-grid .switch-select-head span{
    font-size:11px;
  }
  .custom-main-grid .switch-select-head b{
    font-size:14px;
  }
  .quick-filter-list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    width:100%;
  }
  .quick-filter-chip{
    min-width:0;
    padding:10px 8px;
    font-size:12px;
  }
  .active-filter-row{
    align-items:flex-start;
    flex-direction:column;
    gap:10px;
    padding:12px;
  }
  .custom-result-bar{
    align-items:stretch;
  }
  .custom-result-bar button{
    width:100%;
  }
}



/* v36 fix: opened filter should not stretch соседние карточки */
.custom-main-grid{
  align-items:start;
}
.custom-main-grid .switch-select-card{
  align-self:start;
  height:auto;
}
.custom-main-grid .switch-select-card.open{
  height:auto;
}

/* make dropdown head compact and stable */
.switch-select-card{
  overflow:hidden;
}
.switch-select-head{
  align-items:center;
}

/* fix arrow button centering */
.switch-select-arrow{
  width:34px;
  height:34px;
  min-width:34px;
  min-height:34px;
  border-radius:999px;
  display:grid;
  place-items:center;
  line-height:1;
  font-size:16px;
  font-weight:900;
  padding:0;
  text-align:center;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.05);
}
.switch-select-card.open .switch-select-arrow{
  transform:rotate(180deg);
}

/* keep opened menu visually attached without breaking layout */
.switch-select-menu{
  margin-top:0;
}

/* mobile/tablet polish */
@media (max-width: 900px){
  .custom-main-grid{
    align-items:start;
  }
  .switch-select-arrow{
    width:32px;
    height:32px;
    min-width:32px;
    min-height:32px;
    font-size:15px;
  }
}


/* v37: compact filter cards and narrower opened dropdowns */
.custom-main-grid .switch-select-card.open{
  grid-column: span 1 !important;
}

.custom-main-grid{
  gap: 12px;
}

.custom-main-grid .switch-select-head{
  min-height: 68px;
  padding: 12px 14px;
}

.custom-main-grid .switch-select-head span{
  font-size: 12px;
}

.custom-main-grid .switch-select-head b{
  font-size: 15px;
}

.filter-card-icon{
  width: 32px;
  height: 32px;
  border-radius: 10px;
  font-size: 15px;
}

.switch-select-option{
  padding: 10px 12px;
  min-height: 54px;
}

.switch-option-title{
  font-size: 14px;
}

.switch-option-desc{
  font-size: 11px;
}

.switch-option-count{
  min-width: 24px;
  height: 24px;
  font-size: 11px;
}

@media (min-width: 1181px){
  .custom-main-grid{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 680px){
  .custom-main-grid .switch-select-card.open{
    grid-column: 1 / -1 !important;
  }
}


/* v39: safe mobile fix, without breaking page load */
@media (max-width: 640px){
  html, body{
    overflow-x:hidden;
    width:100%;
  }

  .app{
    padding-left:8px;
    padding-right:8px;
    padding-bottom:128px;
  }

  /* categories: no horizontal carousel on phone */
  .filters{
    display:flex !important;
    flex-wrap:wrap !important;
    overflow:visible !important;
    gap:8px !important;
    padding:9px !important;
    border-radius:18px !important;
  }

  .filters button{
    flex:1 1 calc(50% - 8px) !important;
    min-width:0 !important;
    justify-content:center;
    min-height:46px;
    padding:10px 11px !important;
    font-size:13px !important;
    white-space:normal !important;
    line-height:1.12;
  }

  .filters button:first-child{
    flex:0 0 100%;
  }

  /* hero: less heavy, more visible photo */
  .hero{
    min-height:430px !important;
    padding:18px !important;
    border-radius:22px !important;
    align-items:flex-end !important;
  }

  .hero-bg{
    transform:none !important;
    background-position:center top !important;
    filter:brightness(1.02) saturate(.98) !important;
  }

  .hero-overlay{
    background:
      linear-gradient(180deg,rgba(3,7,14,.08) 0%,rgba(3,7,14,.38) 46%,rgba(3,7,14,.86) 100%) !important;
  }

  .hero h1{
    font-size:34px !important;
    line-height:.96 !important;
    letter-spacing:-.055em !important;
    margin:10px 0 12px !important;
  }

  .hero p{
    font-size:14px !important;
    line-height:1.42 !important;
    margin-bottom:14px !important;
    color:#d3deea !important;
  }

  .hero-actions{
    flex-direction:column !important;
    align-items:stretch !important;
    gap:10px !important;
  }

  .search{
    height:48px !important;
    border-radius:15px !important;
    padding:0 13px !important;
  }

  .search input{
    font-size:14px !important;
  }

  .hero-btn,
  .hero-btn-primary{
    width:100% !important;
    min-width:0 !important;
    height:52px !important;
    border-radius:16px !important;
    font-size:15px !important;
  }

  .hero-features{
    display:none !important;
  }
}

@media (max-width: 380px){
  .filters button{
    flex:1 1 100% !important;
  }

  .hero{
    min-height:400px !important;
  }

  .hero h1{
    font-size:30px !important;
  }
}


/* v40 mobile: remove long hero description and make matching products obvious */
@media (max-width: 640px){
  .hero p{
    display:none !important;
  }

  .hero{
    min-height:360px !important;
  }

  .hero h1{
    margin-bottom:14px !important;
  }

  .popular .section-title span,
  .category-popular .section-title span{
    font-size:10px !important;
  }

  .category-popular .section-title h2{
    font-size:28px !important;
    line-height:1.05 !important;
  }

  /* Result cards should be closer and less visually heavy on mobile */
  .category-popular{
    margin-top:18px !important;
    padding:16px !important;
  }

  .product-grid{
    margin-top:14px !important;
  }

  .product-grid .card,
  .category-popular .card{
    min-height:330px !important;
  }

  .product-grid .card h3,
  .category-popular .card h3{
    margin-top:132px !important;
    font-size:24px !important;
  }

  .product-grid .card p,
  .category-popular .card p{
    font-size:13px !important;
  }

  /* prevent bottom nav from hiding the add-to-cart button */
  .product-grid .card:last-child,
  .category-popular .card:last-child{
    margin-bottom:72px;
  }
}

/* If there are active filters, the block is a result block, not just popular. */


/* v41: raise filter arrows and keep home popular section category-specific */
.custom-main-grid .switch-select-head,
.base-dropdown-filters .switch-select-head,
.keyboard-dropdown-filters .switch-select-head,
.switch-dropdown-filters .switch-select-head,
.keycaps-dropdown-filters .switch-select-head{
  align-items:flex-start;
}

.custom-main-grid .switch-select-arrow,
.base-dropdown-filters .switch-select-arrow,
.keyboard-dropdown-filters .switch-select-arrow,
.switch-dropdown-filters .switch-select-arrow,
.keycaps-dropdown-filters .switch-select-arrow{
  align-self:flex-start;
  margin-top:2px;
}

@media (max-width: 640px){
  .custom-main-grid .switch-select-arrow,
  .base-dropdown-filters .switch-select-arrow,
  .keyboard-dropdown-filters .switch-select-arrow,
  .switch-dropdown-filters .switch-select-arrow,
  .keycaps-dropdown-filters .switch-select-arrow{
    margin-top:0;
  }
}


/* v42: category matching options in 4 windows */
.category-popular-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  align-items:stretch;
}

.category-popular-grid .card{
  min-height:410px;
}

@media(max-width:1180px){
  .category-popular-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:900px){
  .category-popular-grid{
    grid-template-columns:1fr;
  }
}


/* v43: 4 cards everywhere on desktop */
#categoryGrid,
#productGrid,
#popularGrid,
#categoryPopularGrid{
  grid-template-columns:repeat(4,minmax(0,1fr));
}

@media (max-width: 1180px){
  #categoryGrid,
  #productGrid,
  #popularGrid,
  #categoryPopularGrid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width: 700px){
  #categoryGrid,
  #productGrid,
  #popularGrid,
  #categoryPopularGrid{
    grid-template-columns:1fr;
  }
}


/* v45: stable product card actions + clearer product detail opening */
.card.card-clickable{
  display:flex;
  flex-direction:column;
}

.card.card-clickable p{
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.card.card-clickable .tag-row{
  min-height:34px;
  align-content:flex-start;
}

.card.card-clickable .product-meta{
  margin-top:auto;
}

.card.card-clickable .price{
  line-height:1;
}

.card.card-clickable .card-quick-actions{
  margin-top:12px;
}

.card.card-clickable .card-quick-actions .mini-btn,
.card.card-clickable .card-quick-actions .add{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  line-height:1.1;
  white-space:nowrap;
}

.card.card-clickable .card-open-hint{
  position:relative;
  z-index:1;
  margin-top:10px;
  font-size:12px;
  color:rgba(232,244,255,.82);
  opacity:.9;
}

@media (max-width: 900px){
  .card.card-clickable .tag-row{min-height:30px;}
  .card.card-clickable .card-open-hint{font-size:11px;}
}

@media (max-width: 640px){
  .card.card-clickable .card-quick-actions .mini-btn,
  .card.card-clickable .card-quick-actions .add{
    white-space:normal;
  }
}


/* v46: phone grids show 4 as 2x2 instead of one-by-one */
@media (max-width: 700px){
  #productGrid,
  #popularGrid,
  #categoryPopularGrid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }

  #categoryGrid{
    grid-template-columns:1fr !important;
  }

  #productGrid .card,
  #popularGrid .card,
  #categoryPopularGrid .card{
    min-height:300px !important;
    padding:12px !important;
    border-radius:18px !important;
  }

  #productGrid .card h3,
  #popularGrid .card h3,
  #categoryPopularGrid .card h3{
    margin-top:112px !important;
    font-size:17px !important;
    line-height:1.06 !important;
    margin-bottom:6px !important;
  }

  #productGrid .card p,
  #popularGrid .card p,
  #categoryPopularGrid .card p{
    font-size:11px !important;
    line-height:1.3 !important;
    -webkit-line-clamp:2 !important;
  }

  #productGrid .tag-row,
  #popularGrid .tag-row,
  #categoryPopularGrid .tag-row{
    gap:5px !important;
    margin-top:8px !important;
    min-height:26px !important;
  }

  #productGrid .tag-row span,
  #popularGrid .tag-row span,
  #categoryPopularGrid .tag-row span{
    font-size:9px !important;
    padding:5px 7px !important;
  }

  #productGrid .mini-badge,
  #popularGrid .mini-badge,
  #categoryPopularGrid .mini-badge{
    font-size:9px !important;
    padding:6px 8px !important;
  }

  #productGrid .price,
  #popularGrid .price,
  #categoryPopularGrid .price{
    font-size:16px !important;
    margin-top:6px !important;
  }

  #productGrid .card-open-hint,
  #popularGrid .card-open-hint,
  #categoryPopularGrid .card-open-hint{
    display:none !important;
  }

  #productGrid .card-quick-actions,
  #popularGrid .card-quick-actions,
  #categoryPopularGrid .card-quick-actions{
    display:grid !important;
    grid-template-columns:1fr;
    gap:6px !important;
    margin-top:8px !important;
  }

  #productGrid .card-quick-actions .mini-btn,
  #popularGrid .card-quick-actions .mini-btn,
  #categoryPopularGrid .card-quick-actions .mini-btn,
  #productGrid .card-quick-actions .add,
  #popularGrid .card-quick-actions .add,
  #categoryPopularGrid .card-quick-actions .add{
    height:36px !important;
    min-height:36px !important;
    border-radius:12px !important;
    font-size:11px !important;
    padding:0 8px !important;
  }
}

/* very narrow iPhones still keep 2 cards per row, but tighter */
@media (max-width: 390px){
  #productGrid,
  #popularGrid,
  #categoryPopularGrid{
    gap:8px !important;
  }

  #productGrid .card,
  #popularGrid .card,
  #categoryPopularGrid .card{
    min-height:282px !important;
    padding:10px !important;
  }

  #productGrid .card h3,
  #popularGrid .card h3,
  #categoryPopularGrid .card h3{
    margin-top:102px !important;
    font-size:15px !important;
  }
}

/* v46: safer mobile cart drawer */
@media (max-width: 700px){
  body.cart-mode{
    overflow:hidden !important;
  }

  body.cart-mode .bottom-nav,
  body.cart-mode .cart-open{
    display:none !important;
  }

  .cart{
    position:fixed !important;
    left:8px !important;
    right:8px !important;
    top:auto !important;
    bottom:calc(8px + env(safe-area-inset-bottom, 0px)) !important;
    width:auto !important;
    max-width:none !important;
    max-height:calc(88vh - env(safe-area-inset-bottom, 0px)) !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch !important;
    overscroll-behavior:contain !important;
    padding:14px !important;
    border-radius:22px !important;
    transform:translate3d(0, 112%, 0) !important;
    transition:transform .22s ease !important;
    z-index:120 !important;
  }

  .cart.open{
    transform:translate3d(0, 0, 0) !important;
  }

  .cart-head{
    position:sticky;
    top:0;
    z-index:2;
    padding-bottom:8px;
    background:linear-gradient(180deg, rgba(17,27,53,.96), rgba(17,27,53,.74));
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
  }

  .cart-head h3{
    font-size:24px !important;
  }

  .cart-head button{
    width:38px !important;
    height:38px !important;
    display:grid !important;
    place-items:center !important;
    font-size:30px !important;
  }

  .cart-items{
    max-height:22vh !important;
    margin:10px 0 !important;
  }

  .cart-total{
    font-size:17px !important;
    margin:10px 0 !important;
  }

  .checkout-form-wrap{
    margin-top:10px !important;
  }

  .checkout-title{
    font-size:16px !important;
  }

  .checkout-note{
    font-size:12px !important;
    margin:6px 0 10px !important;
  }

  .field input,
  .field textarea{
    padding:11px 12px !important;
    border-radius:12px !important;
    font-size:14px !important;
  }

  .field textarea{
    min-height:72px !important;
  }

  .checkout{
    height:48px !important;
    border-radius:14px !important;
  }
}


/* v47: arrow alignment fix */
.switch-select-head,
.custom-main-grid .switch-select-head,
.base-dropdown-filters .switch-select-head,
.keyboard-dropdown-filters .switch-select-head,
.switch-dropdown-filters .switch-select-head,
.keycaps-dropdown-filters .switch-select-head{
  align-items:center !important;
}

.switch-select-arrow,
.custom-main-grid .switch-select-arrow,
.base-dropdown-filters .switch-select-arrow,
.keyboard-dropdown-filters .switch-select-arrow,
.switch-dropdown-filters .switch-select-arrow,
.keycaps-dropdown-filters .switch-select-arrow{
  align-self:center !important;
  margin-top:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  line-height:1 !important;
  transform:none !important;
}

.switch-select-card.open .switch-select-arrow{
  transform:none !important;
}

/* v47: user request — 4 product cards in a row on phones too */
@media (max-width:700px){
  #productGrid,
  #popularGrid,
  #categoryPopularGrid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:6px !important;
  }

  #productGrid .card,
  #popularGrid .card,
  #categoryPopularGrid .card{
    min-height:190px !important;
    padding:7px !important;
    border-radius:14px !important;
  }

  #productGrid .card h3,
  #popularGrid .card h3,
  #categoryPopularGrid .card h3{
    margin-top:64px !important;
    font-size:10.5px !important;
    line-height:1.05 !important;
    margin-bottom:4px !important;
    letter-spacing:-.02em !important;
  }

  #productGrid .card p,
  #popularGrid .card p,
  #categoryPopularGrid .card p{
    font-size:8.5px !important;
    line-height:1.18 !important;
    -webkit-line-clamp:2 !important;
  }

  #productGrid .mini-badge,
  #popularGrid .mini-badge,
  #categoryPopularGrid .mini-badge{
    font-size:7px !important;
    padding:4px 5px !important;
  }

  #productGrid .tag-row,
  #popularGrid .tag-row,
  #categoryPopularGrid .tag-row{
    gap:3px !important;
    margin-top:4px !important;
    min-height:16px !important;
  }

  #productGrid .tag-row span,
  #popularGrid .tag-row span,
  #categoryPopularGrid .tag-row span{
    font-size:6.5px !important;
    padding:3px 4px !important;
  }

  #productGrid .price,
  #popularGrid .price,
  #categoryPopularGrid .price{
    font-size:11px !important;
    margin-top:3px !important;
  }

  #productGrid .product-meta,
  #popularGrid .product-meta,
  #categoryPopularGrid .product-meta{
    margin-top:auto !important;
  }

  #productGrid .card-open-hint,
  #popularGrid .card-open-hint,
  #categoryPopularGrid .card-open-hint{
    display:none !important;
  }

  #productGrid .card-quick-actions,
  #popularGrid .card-quick-actions,
  #categoryPopularGrid .card-quick-actions{
    gap:3px !important;
    margin-top:4px !important;
  }

  #productGrid .card-quick-actions .mini-btn,
  #popularGrid .card-quick-actions .mini-btn,
  #categoryPopularGrid .card-quick-actions .mini-btn,
  #productGrid .card-quick-actions .add,
  #popularGrid .card-quick-actions .add,
  #categoryPopularGrid .card-quick-actions .add{
    height:24px !important;
    min-height:24px !important;
    border-radius:8px !important;
    font-size:7.5px !important;
    padding:0 3px !important;
    line-height:1 !important;
  }
}

@media (max-width:380px){
  #productGrid,
  #popularGrid,
  #categoryPopularGrid{
    gap:5px !important;
  }

  #productGrid .card,
  #popularGrid .card,
  #categoryPopularGrid .card{
    min-height:178px !important;
    padding:6px !important;
  }

  #productGrid .card h3,
  #popularGrid .card h3,
  #categoryPopularGrid .card h3{
    margin-top:58px !important;
    font-size:9.5px !important;
  }
}


/* v48 — noticeable 2/4/6 card density switcher */
.density-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:16px 18px;
  margin:0 0 22px;
  border-radius:24px;
  position:relative;
  overflow:hidden;
}
.density-toolbar::before{
  content:"";
  position:absolute;
  inset:auto auto -40px -40px;
  width:180px;
  height:180px;
  background:radial-gradient(circle,rgba(70,199,255,.16),transparent 68%);
  pointer-events:none;
}
.density-toolbar-label{position:relative;z-index:1;display:flex;flex-direction:column;gap:4px}
.density-toolbar-label span{font-size:12px;font-weight:900;letter-spacing:.14em;color:var(--blue)}
.density-toolbar-label b{font-size:18px;line-height:1.1;color:#fff}
.density-toolbar-controls{position:relative;z-index:1;display:flex;gap:10px;flex-wrap:wrap}
.density-btn{
  min-width:104px;
  height:46px;
  padding:0 18px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.08);
  color:#ecf3ff;
  font-size:15px;
  font-weight:900;
  cursor:pointer;
  transition:.2s ease;
}
.density-btn:hover{
  transform:translateY(-1px);
  border-color:rgba(255,255,255,.26);
}
.density-btn.active{
  background:linear-gradient(135deg,rgba(70,199,255,.44),rgba(154,109,255,.44));
  border-color:rgba(255,255,255,.34);
  box-shadow:0 12px 28px rgba(82,129,255,.2), inset 0 1px 0 rgba(255,255,255,.2);
}

/* desktop density presets */
body.grid-density-2 #productGrid,
body.grid-density-2 #popularGrid,
body.grid-density-2 #categoryPopularGrid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
body.grid-density-4 #productGrid,
body.grid-density-4 #popularGrid,
body.grid-density-4 #categoryPopularGrid{grid-template-columns:repeat(4,minmax(0,1fr)) !important;}
body.grid-density-6 #productGrid,
body.grid-density-6 #popularGrid,
body.grid-density-6 #categoryPopularGrid{grid-template-columns:repeat(6,minmax(0,1fr)) !important;}

body.grid-density-2 #productGrid .card,
body.grid-density-2 #popularGrid .card,
body.grid-density-2 #categoryPopularGrid .card{min-height:420px !important;}
body.grid-density-4 #productGrid .card,
body.grid-density-4 #popularGrid .card,
body.grid-density-4 #categoryPopularGrid .card{min-height:360px !important;}
body.grid-density-4 #productGrid .card h3,
body.grid-density-4 #popularGrid .card h3,
body.grid-density-4 #categoryPopularGrid .card h3{font-size:18px !important;margin-top:145px !important;}
body.grid-density-4 #productGrid .card p,
body.grid-density-4 #popularGrid .card p,
body.grid-density-4 #categoryPopularGrid .card p{font-size:13px !important;line-height:1.3 !important;}

body.grid-density-6 #productGrid .card,
body.grid-density-6 #popularGrid .card,
body.grid-density-6 #categoryPopularGrid .card{min-height:310px !important;padding:12px !important;}
body.grid-density-6 #productGrid .card h3,
body.grid-density-6 #popularGrid .card h3,
body.grid-density-6 #categoryPopularGrid .card h3{font-size:16px !important;margin-top:118px !important;line-height:1.05 !important;}
body.grid-density-6 #productGrid .card p,
body.grid-density-6 #popularGrid .card p,
body.grid-density-6 #categoryPopularGrid .card p{font-size:12px !important;line-height:1.22 !important;-webkit-line-clamp:3 !important;}
body.grid-density-6 #productGrid .tag-row,
body.grid-density-6 #popularGrid .tag-row,
body.grid-density-6 #categoryPopularGrid .tag-row{gap:4px !important;}
body.grid-density-6 #productGrid .tag-row span,
body.grid-density-6 #popularGrid .tag-row span,
body.grid-density-6 #categoryPopularGrid .tag-row span{font-size:9px !important;padding:4px 7px !important;}
body.grid-density-6 #productGrid .card-quick-actions .mini-btn,
body.grid-density-6 #popularGrid .card-quick-actions .mini-btn,
body.grid-density-6 #categoryPopularGrid .card-quick-actions .mini-btn,
body.grid-density-6 #productGrid .card-quick-actions .add,
body.grid-density-6 #popularGrid .card-quick-actions .add,
body.grid-density-6 #categoryPopularGrid .card-quick-actions .add{height:40px !important;font-size:12px !important;padding:0 8px !important;}

@media (max-width:900px){
  .density-toolbar{flex-direction:column;align-items:stretch;padding:14px 14px 16px}
  .density-toolbar-label b{font-size:16px}
  .density-toolbar-controls{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
  .density-btn{min-width:0;width:100%;padding:0 8px;font-size:13px;height:42px}
}

@media (max-width:700px){
  body.grid-density-2 #productGrid,
  body.grid-density-2 #popularGrid,
  body.grid-density-2 #categoryPopularGrid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:8px !important;}
  body.grid-density-4 #productGrid,
  body.grid-density-4 #popularGrid,
  body.grid-density-4 #categoryPopularGrid{grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:6px !important;}
  body.grid-density-6 #productGrid,
  body.grid-density-6 #popularGrid,
  body.grid-density-6 #categoryPopularGrid{grid-template-columns:repeat(6,minmax(0,1fr)) !important;gap:4px !important;}

  body.grid-density-2 #productGrid .card,
  body.grid-density-2 #popularGrid .card,
  body.grid-density-2 #categoryPopularGrid .card{min-height:245px !important;padding:10px !important;}
  body.grid-density-2 #productGrid .card h3,
  body.grid-density-2 #popularGrid .card h3,
  body.grid-density-2 #categoryPopularGrid .card h3{margin-top:86px !important;font-size:16px !important;}
  body.grid-density-2 #productGrid .card p,
  body.grid-density-2 #popularGrid .card p,
  body.grid-density-2 #categoryPopularGrid .card p{font-size:11px !important;line-height:1.25 !important;}

  body.grid-density-4 #productGrid .card,
  body.grid-density-4 #popularGrid .card,
  body.grid-density-4 #categoryPopularGrid .card{min-height:190px !important;padding:7px !important;border-radius:14px !important;}
  body.grid-density-4 #productGrid .card h3,
  body.grid-density-4 #popularGrid .card h3,
  body.grid-density-4 #categoryPopularGrid .card h3{margin-top:64px !important;font-size:10.5px !important;line-height:1.05 !important;margin-bottom:4px !important;letter-spacing:-.02em !important;}
  body.grid-density-4 #productGrid .card p,
  body.grid-density-4 #popularGrid .card p,
  body.grid-density-4 #categoryPopularGrid .card p{font-size:8.5px !important;line-height:1.18 !important;-webkit-line-clamp:2 !important;}
  body.grid-density-4 #productGrid .tag-row,
  body.grid-density-4 #popularGrid .tag-row,
  body.grid-density-4 #categoryPopularGrid .tag-row{gap:3px !important;margin-top:4px !important;min-height:16px !important;}
  body.grid-density-4 #productGrid .tag-row span,
  body.grid-density-4 #popularGrid .tag-row span,
  body.grid-density-4 #categoryPopularGrid .tag-row span{font-size:6.5px !important;padding:3px 4px !important;}
  body.grid-density-4 #productGrid .price,
  body.grid-density-4 #popularGrid .price,
  body.grid-density-4 #categoryPopularGrid .price{font-size:11px !important;margin-top:3px !important;}
  body.grid-density-4 #productGrid .card-quick-actions,
  body.grid-density-4 #popularGrid .card-quick-actions,
  body.grid-density-4 #categoryPopularGrid .card-quick-actions{gap:3px !important;margin-top:4px !important;}
  body.grid-density-4 #productGrid .card-quick-actions .mini-btn,
  body.grid-density-4 #popularGrid .card-quick-actions .mini-btn,
  body.grid-density-4 #categoryPopularGrid .card-quick-actions .mini-btn,
  body.grid-density-4 #productGrid .card-quick-actions .add,
  body.grid-density-4 #popularGrid .card-quick-actions .add,
  body.grid-density-4 #categoryPopularGrid .card-quick-actions .add{height:24px !important;min-height:24px !important;border-radius:8px !important;font-size:7.5px !important;padding:0 3px !important;line-height:1 !important;}

  body.grid-density-6 #productGrid .card,
  body.grid-density-6 #popularGrid .card,
  body.grid-density-6 #categoryPopularGrid .card{min-height:138px !important;padding:5px !important;border-radius:12px !important;}
  body.grid-density-6 #productGrid .card h3,
  body.grid-density-6 #popularGrid .card h3,
  body.grid-density-6 #categoryPopularGrid .card h3{margin-top:46px !important;font-size:8px !important;line-height:1.02 !important;margin-bottom:2px !important;}
  body.grid-density-6 #productGrid .card p,
  body.grid-density-6 #popularGrid .card p,
  body.grid-density-6 #categoryPopularGrid .card p{display:none !important;}
  body.grid-density-6 #productGrid .tag-row,
  body.grid-density-6 #popularGrid .tag-row,
  body.grid-density-6 #categoryPopularGrid .tag-row{display:none !important;}
  body.grid-density-6 #productGrid .price,
  body.grid-density-6 #popularGrid .price,
  body.grid-density-6 #categoryPopularGrid .price{font-size:9px !important;margin-top:2px !important;}
  body.grid-density-6 #productGrid .card-quick-actions,
  body.grid-density-6 #popularGrid .card-quick-actions,
  body.grid-density-6 #categoryPopularGrid .card-quick-actions{gap:2px !important;margin-top:2px !important;}
  body.grid-density-6 #productGrid .card-quick-actions .mini-btn,
  body.grid-density-6 #popularGrid .card-quick-actions .mini-btn,
  body.grid-density-6 #categoryPopularGrid .card-quick-actions .mini-btn,
  body.grid-density-6 #productGrid .card-quick-actions .add,
  body.grid-density-6 #popularGrid .card-quick-actions .add,
  body.grid-density-6 #categoryPopularGrid .card-quick-actions .add{height:20px !important;min-height:20px !important;border-radius:7px !important;font-size:6px !important;padding:0 2px !important;line-height:1 !important;}
  body.grid-density-6 #productGrid .mini-badge,
  body.grid-density-6 #popularGrid .mini-badge,
  body.grid-density-6 #categoryPopularGrid .mini-badge{font-size:6px !important;padding:3px 4px !important;}
}


/* v49 — custom long color filter */
.custom-long-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:14px;
  margin-top:14px;
}
.switch-select-card.long-color-filter{
  min-height:96px;
}
.switch-select-card.long-color-filter .switch-select-head{
  min-height:74px;
}
.switch-select-card.long-color-filter .switch-select-menu{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.switch-select-card.long-color-filter .switch-option-title{
  font-size:18px;
}
.switch-select-card.long-color-filter .switch-option-desc{
  font-size:12px;
}
@media (max-width:900px){
  .custom-long-grid{margin-top:10px;gap:10px}
  .switch-select-card.long-color-filter .switch-select-head{min-height:68px}
}
@media (max-width:700px){
  .switch-select-card.long-color-filter .switch-select-menu{grid-template-columns:1fr;}
}


/* v51 keycaps color + modding */
.keycaps-filter-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.keycaps-color-row{margin-top:14px;}
.keycaps-color-row .switch-select-menu{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));}
@media (max-width: 760px){
  .keycaps-filter-grid{grid-template-columns:1fr;}
  .keycaps-color-row .switch-select-menu{grid-template-columns:1fr;}
}


/* v52: hero paragraph removed, trust labels updated */
.hero .hero-content > p:empty{
  display:none !important;
}
@media(max-width:640px){
  .hero h1{
    margin-bottom:16px !important;
  }
}


/* v53: keycaps color filter must sit below profile and plastic */
.keycaps-filter-grid,
.keycaps-color-row{
  grid-column:1 / -1;
  width:100%;
}
.keycaps-color-row{
  display:block;
}


/* v54: switch services centered like keycaps color row */
.switch-service-row,
.keycaps-filter-grid,
.keycaps-color-row{
  width:100%;
}
.switch-dropdown-filters .keycaps-filter-grid,
.switch-dropdown-filters .keycaps-color-row{
  grid-column:1 / -1;
}
.switch-dropdown-filters .keycaps-color-row{
  display:block;
}


/* v55 FORCE: switch service centered and full-width */
.switch-dropdown-filters{
  display:block !important;
}

.switch-top-filter-grid{
  width:100%;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}

.switch-service-center-row{
  width:100%;
  display:flex;
  justify-content:center;
  margin-top:14px;
}

.switch-service-center-row .switch-select-card{
  width:min(560px, 100%);
  max-width:560px;
}

.switch-service-center-row .switch-select-card.open{
  width:min(720px, 100%);
  max-width:720px;
}

.switch-service-center-row .switch-select-menu{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.switch-service-center-row .switch-select-head{
  min-height:74px;
}

@media(max-width:760px){
  .switch-top-filter-grid{
    grid-template-columns:1fr;
  }

  .switch-service-center-row{
    justify-content:stretch;
  }

  .switch-service-center-row .switch-select-card,
  .switch-service-center-row .switch-select-card.open{
    width:100%;
    max-width:100%;
  }

  .switch-service-center-row .switch-select-menu{
    grid-template-columns:1fr;
  }
}


/* v56: Switches -> long full-width 'Услуги' pill like the color filter */
.switch-service-pill-row{
  width:100%;
  display:block;
  margin-top:14px;
}

.switch-service-pill-row .switch-select-card{
  width:100%;
  max-width:100%;
}

.switch-service-pill-row .switch-select-card.open{
  width:100%;
  max-width:100%;
}

.switch-service-pill-row .switch-select-menu{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.switch-service-pill-row .switch-select-head{
  min-height:74px;
}

@media (max-width: 760px){
  .switch-service-pill-row .switch-select-menu{
    grid-template-columns:1fr;
  }
}


/* v57: switches filters positioned like keycaps */
.switch-like-keycaps-grid,
.switch-like-keycaps-row{
  grid-column: 1 / -1;
  width: 100%;
}
.switch-like-keycaps-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.switch-like-keycaps-row{
  display:block;
  margin-top:14px;
}
.switch-like-keycaps-row .switch-select-card,
.switch-like-keycaps-row .switch-select-card.open{
  width:100%;
  max-width:100%;
}
.switch-like-keycaps-row .switch-select-head{
  min-height:74px;
}
.switch-like-keycaps-row .switch-select-menu{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
@media (max-width:760px){
  .switch-like-keycaps-grid{grid-template-columns:1fr;}
  .switch-like-keycaps-row .switch-select-menu{grid-template-columns:1fr;}
}


/* v58: restore switch filters grid so 'Услуги' has spacing from summary like keycaps */
.switch-dropdown-filters{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  align-items:start;
}
.switch-like-keycaps-grid,
.switch-like-keycaps-row,
.switch-filter-summary{
  grid-column:1 / -1;
}
.switch-like-keycaps-row{
  margin-top:0;
}
@media (max-width:760px){
  .switch-dropdown-filters{
    grid-template-columns:1fr;
  }
}


/* v59: upgraded product cards */
.product-card-v59{
  min-height:430px;
  padding:16px;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}

.product-card-v59 .product-badge-row{
  position:absolute;
  top:14px;
  right:14px;
  z-index:2;
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:6px;
  max-width:68%;
}

.product-badge{
  border:1px solid rgba(255,255,255,.20);
  background:rgba(255,255,255,.11);
  color:#fff;
  border-radius:999px;
  padding:6px 9px;
  font-size:10px;
  font-weight:950;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

.product-badge.stock{
  color:#66ffc4;
  background:rgba(82,255,190,.14);
  border-color:rgba(82,255,190,.24);
}

.product-badge.order{
  color:#ffd88a;
  background:rgba(255,197,90,.13);
  border-color:rgba(255,197,90,.24);
}

.product-card-v59 h3{
  margin-top:160px;
  min-height:46px;
}

.product-card-v59 p{
  min-height:38px;
  -webkit-line-clamp:2 !important;
}

.product-chip-row{
  position:relative;
  z-index:1;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:10px;
  min-height:34px;
}

.product-chip-row span{
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.10);
  color:#edf5ff;
  border-radius:999px;
  padding:6px 9px;
  font-size:11px;
  font-weight:900;
}

.product-card-bottom{
  position:relative;
  z-index:1;
  margin-top:auto;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
}

.product-status{
  color:#b9c8dc;
  font-weight:900;
  font-size:12px;
  margin-bottom:8px;
}

.product-status.green{
  color:#64ffc1;
}

.product-card-bottom .price{
  font-size:24px;
}

.product-card-bottom .card-quick-actions{
  min-width:132px;
  margin-top:0;
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}

.product-card-bottom .mini-btn,
.product-card-bottom .add{
  height:40px;
  border-radius:14px;
  white-space:nowrap;
}

.modal-related{
  margin-top:16px;
  padding-top:16px;
  border-top:1px solid rgba(255,255,255,.10);
}

.modal-related-title{
  font-size:13px;
  font-weight:950;
  color:#58d6ff;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:10px;
}

.modal-related-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}

.modal-related-card{
  text-align:left;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  color:#fff;
  border-radius:16px;
  padding:10px;
  cursor:pointer;
}

.modal-related-card span{
  display:block;
  font-size:12px;
  font-weight:900;
  line-height:1.15;
  min-height:30px;
}

.modal-related-card b{
  display:block;
  margin-top:8px;
  color:#64ffc1;
}

@media(max-width:900px){
  .product-card-v59{
    min-height:360px;
  }
  .product-card-v59 h3{
    margin-top:132px;
  }
  .product-card-bottom{
    flex-direction:column;
    align-items:stretch;
    gap:8px;
  }
  .product-card-bottom .card-quick-actions{
    min-width:0;
  }
  .modal-related-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:700px){
  .product-card-v59{
    min-height:220px !important;
    padding:8px !important;
  }
  .product-card-v59 .product-badge-row{
    top:8px;
    right:8px;
    gap:3px;
  }
  .product-badge{
    font-size:6.5px;
    padding:3px 5px;
  }
  .product-card-v59 h3{
    margin-top:66px !important;
    min-height:24px;
  }
  .product-card-v59 p{
    display:none !important;
  }
  .product-chip-row{
    gap:3px;
    min-height:18px;
    margin-top:4px;
  }
  .product-chip-row span{
    font-size:6.5px;
    padding:3px 4px;
  }
  .product-status{
    font-size:7px;
    margin-bottom:3px;
  }
  .product-card-bottom .price{
    font-size:11px !important;
  }
  .product-card-bottom{
    gap:4px;
  }
  .product-card-bottom .card-quick-actions{
    gap:3px;
  }
  .product-card-bottom .mini-btn,
  .product-card-bottom .add{
    height:22px !important;
    min-height:22px !important;
    border-radius:8px !important;
    font-size:7px !important;
    padding:0 3px !important;
  }
}


/* v60: larger premium product detail card */
.modal{
  padding:28px !important;
}

.modal-card{
  width:min(1180px, calc(100vw - 42px)) !important;
  max-height:calc(100vh - 54px) !important;
  border-radius:34px !important;
  overflow:hidden !important;
}

.modal-grid{
  grid-template-columns:1.12fr .88fr !important;
  gap:24px !important;
  padding:24px !important;
}

.modal-media{
  min-height:560px !important;
  border-radius:28px !important;
}

.modal-media img{
  height:100% !important;
  min-height:560px !important;
  object-fit:cover !important;
}

.modal-info{
  padding:4px 4px 4px 0 !important;
  display:flex !important;
  flex-direction:column !important;
  min-height:560px !important;
}

.modal-info h2{
  font-size:42px !important;
  line-height:.98 !important;
  letter-spacing:-.05em !important;
  margin:6px 0 14px !important;
}

.modal-info > p{
  font-size:16px !important;
  line-height:1.55 !important;
  color:#cdd8e8 !important;
  margin-bottom:16px !important;
}

.modal-tags{
  gap:8px !important;
  margin-bottom:16px !important;
}

.modal-tags span{
  font-size:13px !important;
  padding:9px 12px !important;
}

.modal-price{
  font-size:38px !important;
  margin:10px 0 18px !important;
}

.spec-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:12px !important;
  margin-bottom:18px !important;
}

.spec-grid div{
  padding:14px !important;
  border-radius:18px !important;
}

.spec-grid span{
  font-size:12px !important;
}

.spec-grid b{
  font-size:15px !important;
}

.modal-actions{
  margin-top:auto !important;
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:12px !important;
}

.modal-actions .add,
.modal-actions .mini-btn,
#modalAdd{
  min-height:58px !important;
  border-radius:18px !important;
  font-size:16px !important;
}

.modal-related{
  margin-top:18px !important;
  padding-top:18px !important;
}

.modal-related-grid{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:10px !important;
}

.modal-related-card{
  min-height:92px !important;
  border-radius:18px !important;
  padding:13px !important;
}

.modal-related-card span{
  font-size:13px !important;
  min-height:34px !important;
}

.modal-close{
  width:46px !important;
  height:46px !important;
  font-size:30px !important;
  border-radius:16px !important;
  top:18px !important;
  right:18px !important;
  z-index:5 !important;
}

@media(max-width:980px){
  .modal-card{
    width:min(760px, calc(100vw - 26px)) !important;
    max-height:calc(100vh - 26px) !important;
    overflow:auto !important;
  }

  .modal-grid{
    grid-template-columns:1fr !important;
    padding:18px !important;
    gap:16px !important;
  }

  .modal-media{
    min-height:360px !important;
  }

  .modal-media img{
    min-height:360px !important;
  }

  .modal-info{
    min-height:auto !important;
    padding:0 !important;
  }

  .modal-info h2{
    font-size:34px !important;
  }

  .modal-related-grid{
    grid-template-columns:1fr !important;
  }
}

@media(max-width:640px){
  .modal{
    padding:8px !important;
    align-items:flex-end !important;
  }

  .modal-card{
    width:100% !important;
    max-height:92vh !important;
    border-radius:26px 26px 0 0 !important;
  }

  .modal-grid{
    padding:14px !important;
    gap:14px !important;
  }

  .modal-media{
    min-height:300px !important;
    border-radius:22px !important;
  }

  .modal-media img{
    min-height:300px !important;
  }

  .modal-info h2{
    font-size:28px !important;
    line-height:1 !important;
    margin-right:42px !important;
  }

  .modal-info > p{
    font-size:14px !important;
    line-height:1.45 !important;
  }

  .modal-price{
    font-size:30px !important;
  }

  .spec-grid{
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
  }

  .spec-grid div{
    padding:10px !important;
    border-radius:14px !important;
  }

  .spec-grid span{
    font-size:10px !important;
  }

  .spec-grid b{
    font-size:12px !important;
  }

  .modal-actions{
    position:sticky !important;
    bottom:0 !important;
    padding-top:10px !important;
    padding-bottom:calc(8px + env(safe-area-inset-bottom, 0px)) !important;
    background:linear-gradient(180deg,rgba(11,18,38,0),rgba(11,18,38,.96) 28%) !important;
    backdrop-filter:blur(12px) !important;
    -webkit-backdrop-filter:blur(12px) !important;
  }

  .modal-actions .add,
  .modal-actions .mini-btn,
  #modalAdd{
    min-height:52px !important;
    font-size:14px !important;
  }

  .modal-close{
    top:12px !important;
    right:12px !important;
    width:40px !important;
    height:40px !important;
    font-size:26px !important;
  }
}


/* v61: click + chip/header visual fix */
.product-card-v59{
  cursor:pointer !important;
}

/* keep overlay elements from blocking card click */
.product-card-v59 img,
.product-card-v59 .mini-badge,
.product-card-v59 .product-badge-row,
.product-card-v59 .product-badge,
.product-card-v59 .product-chip-row,
.product-card-v59 .product-chip-row span,
.product-card-v59 h3,
.product-card-v59 p,
.product-card-v59 .product-status,
.product-card-v59 .price{
  pointer-events:none !important;
}

/* buttons must still be clickable */
.product-card-v59 button,
.product-card-v59 .card-quick-actions{
  pointer-events:auto !important;
}

/* top badges are now real centered pills, not thin broken line */
.product-card-v59 .product-badge-row{
  align-items:center !important;
  gap:6px !important;
}

.product-card-v59 .product-badge{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:24px !important;
  line-height:1 !important;
  padding:0 10px !important;
  font-size:10px !important;
  border-radius:999px !important;
  white-space:nowrap !important;
}

/* характеристика в центре обводки */
.product-card-v59 .product-chip-row{
  align-items:center !important;
  min-height:38px !important;
}

.product-card-v59 .product-chip-row span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:26px !important;
  line-height:1 !important;
  padding:0 10px !important;
  border-radius:999px !important;
  white-space:nowrap !important;
}

@media(max-width:700px){
  .product-card-v59 .product-badge-row{
    gap:3px !important;
    max-width:72% !important;
  }

  .product-card-v59 .product-badge{
    min-height:16px !important;
    padding:0 5px !important;
    font-size:6.5px !important;
  }

  .product-card-v59 .product-chip-row{
    min-height:18px !important;
    gap:3px !important;
  }

  .product-card-v59 .product-chip-row span{
    min-height:14px !important;
    padding:0 4px !important;
    font-size:6.5px !important;
  }
}


/* v62 FORCE: product cards open reliably + badges/chips centered */
.product-card-v62{
  cursor:pointer !important;
  min-height:430px !important;
}

/* Full-card invisible hitbox. Quick action buttons stay above it. */
.product-card-v62 .card-open-hitbox{
  position:absolute !important;
  inset:0 !important;
  z-index:2 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  border:0 !important;
  background:transparent !important;
  cursor:pointer !important;
  padding:0 !important;
}

.product-card-v62 .card-quick-actions,
.product-card-v62 .card-quick-actions button{
  position:relative !important;
  z-index:5 !important;
  pointer-events:auto !important;
}

.product-card-v62 .product-top-line,
.product-card-v62 h3,
.product-card-v62 p,
.product-card-v62 .product-chip-row,
.product-card-v62 .product-card-bottom{
  position:relative !important;
  z-index:3 !important;
  pointer-events:none !important;
}

/* Replace broken thin top row with a stable top bar */
.product-card-v62 .mini-badge{
  display:none !important;
}

.product-card-v62 .product-top-line{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:8px !important;
  width:100% !important;
  min-height:34px !important;
  margin:0 !important;
}

.product-card-v62 .product-brand-pill{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:28px !important;
  line-height:1 !important;
  padding:0 12px !important;
  border-radius:999px !important;
  border:1px solid rgba(255,255,255,.24) !important;
  background:rgba(255,255,255,.14) !important;
  color:#f7fbff !important;
  font-size:11px !important;
  font-weight:950 !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16) !important;
  backdrop-filter:blur(14px) !important;
  -webkit-backdrop-filter:blur(14px) !important;
  white-space:nowrap !important;
}

.product-card-v62 .product-badge-row{
  position:static !important;
  z-index:auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  flex-wrap:wrap !important;
  gap:6px !important;
  max-width:none !important;
  pointer-events:none !important;
}

.product-card-v62 .product-badge{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:28px !important;
  line-height:1 !important;
  padding:0 11px !important;
  border-radius:999px !important;
  font-size:10.5px !important;
  font-weight:950 !important;
  white-space:nowrap !important;
}

/* Move title down consistently after top bar */
.product-card-v62 h3{
  margin-top:128px !important;
}

/* характеристики строго по центру обводки */
.product-card-v62 .product-chip-row{
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:7px !important;
  min-height:38px !important;
}

.product-card-v62 .product-chip-row span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  min-height:28px !important;
  line-height:1 !important;
  padding:0 11px !important;
  border-radius:999px !important;
  font-size:11px !important;
  font-weight:950 !important;
  white-space:nowrap !important;
}

@media(max-width:900px){
  .product-card-v62{
    min-height:360px !important;
  }
  .product-card-v62 h3{
    margin-top:104px !important;
  }
}

@media(max-width:700px){
  .product-card-v62{
    min-height:230px !important;
  }

  .product-card-v62 .product-top-line{
    min-height:20px !important;
    gap:4px !important;
  }

  .product-card-v62 .product-brand-pill{
    min-height:17px !important;
    padding:0 6px !important;
    font-size:7px !important;
  }

  .product-card-v62 .product-badge-row{
    gap:3px !important;
  }

  .product-card-v62 .product-badge{
    min-height:17px !important;
    padding:0 6px !important;
    font-size:6.8px !important;
  }

  .product-card-v62 h3{
    margin-top:62px !important;
  }

  .product-card-v62 .product-chip-row{
    min-height:20px !important;
    gap:3px !important;
  }

  .product-card-v62 .product-chip-row span{
    min-height:16px !important;
    padding:0 5px !important;
    font-size:6.8px !important;
  }
}


/* v63: readable premium product cards on photo background */
.product-card-v62{
  border-color:rgba(255,255,255,.18) !important;
  box-shadow:
    0 24px 70px rgba(0,0,0,.42),
    inset 0 1px 0 rgba(255,255,255,.16) !important;
  background:#10192a !important;
}

/* stronger dark readability layer */
.product-card-v62::after{
  z-index:1 !important;
  background:
    linear-gradient(180deg,
      rgba(4,8,16,.18) 0%,
      rgba(4,8,16,.32) 32%,
      rgba(5,9,18,.72) 62%,
      rgba(5,9,18,.94) 100%) !important,
    radial-gradient(circle at 10% 0%,rgba(120,170,255,.16),transparent 36%) !important;
  pointer-events:none !important;
}

.product-card-v62 img{
  filter:saturate(.96) contrast(1.04) brightness(.82) !important;
}

/* top pills: darker glass so they don't merge with image */
.product-card-v62 .product-brand-pill,
.product-card-v62 .product-badge{
  background:rgba(12,18,30,.72) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  color:#f5f8ff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 8px 18px rgba(0,0,0,.24) !important;
}

.product-card-v62 .product-badge.stock{
  color:#73ffc8 !important;
  background:rgba(12,35,29,.76) !important;
  border-color:rgba(105,255,195,.26) !important;
}

.product-card-v62 .product-badge.order{
  color:#ffd58a !important;
  background:rgba(44,31,12,.76) !important;
  border-color:rgba(255,205,105,.28) !important;
}

/* text contrast */
.product-card-v62 h3{
  color:#f8fbff !important;
  text-shadow:0 3px 14px rgba(0,0,0,.62) !important;
  letter-spacing:-.035em !important;
}

.product-card-v62 p{
  color:#d8e1ef !important;
  text-shadow:0 2px 10px rgba(0,0,0,.55) !important;
  font-weight:750 !important;
  line-height:1.34 !important;
  opacity:1 !important;
}

/* dark readable characteristic chips */
.product-card-v62 .product-chip-row span{
  color:#f2f6ff !important;
  background:rgba(12,18,30,.72) !important;
  border:1px solid rgba(255,255,255,.17) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 8px 18px rgba(0,0,0,.22) !important;
  backdrop-filter:blur(12px) !important;
  -webkit-backdrop-filter:blur(12px) !important;
}

/* make status quieter, price still bright */
.product-card-v62 .product-status{
  color:#93f2c9 !important;
  text-shadow:0 2px 8px rgba(0,0,0,.55) !important;
  font-weight:950 !important;
}

.product-card-v62 .price{
  color:#65ffc4 !important;
  text-shadow:
    0 2px 12px rgba(0,0,0,.65),
    0 0 18px rgba(101,255,196,.18) !important;
}

/* secondary "Подробнее", primary "В корзину" */
.product-card-v62 .card-quick-actions .mini-btn{
  color:#f1f6ff !important;
  background:rgba(12,18,30,.68) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12), 0 10px 24px rgba(0,0,0,.22) !important;
  backdrop-filter:blur(12px) !important;
  -webkit-backdrop-filter:blur(12px) !important;
}

.product-card-v62 .card-quick-actions .add{
  color:#fff !important;
  background:linear-gradient(135deg,#39c8ff,#8b5cff) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  box-shadow:0 14px 34px rgba(68,154,255,.28) !important;
}

.product-card-v62 .card-quick-actions .mini-btn:hover{
  background:rgba(24,34,52,.78) !important;
}

.product-card-v62 .card-quick-actions .add:hover{
  filter:brightness(1.08) !important;
}

/* better spacing in bottom content */
.product-card-v62 .product-card-bottom{
  align-items:flex-end !important;
  gap:14px !important;
}

@media(max-width:700px){
  .product-card-v62::after{
    background:
      linear-gradient(180deg,
        rgba(4,8,16,.12) 0%,
        rgba(4,8,16,.36) 34%,
        rgba(5,9,18,.78) 62%,
        rgba(5,9,18,.96) 100%) !important;
  }

  .product-card-v62 p{
    display:none !important;
  }

  .product-card-v62 .product-brand-pill,
  .product-card-v62 .product-badge,
  .product-card-v62 .product-chip-row span{
    background:rgba(10,16,27,.78) !important;
  }

  .product-card-v62 h3{
    font-size:13px !important;
    text-shadow:0 2px 9px rgba(0,0,0,.72) !important;
  }

  .product-card-v62 .price{
    font-size:12px !important;
  }
}


/* v64 HARD CONTRAST: noticeable readable product cards */
.product-card-v62{
  overflow:hidden !important;
  background:#070d18 !important;
}

/* darken image much stronger */
.product-card-v62 img{
  filter:brightness(.58) contrast(1.12) saturate(.9) !important;
}

/* full image overlay */
.product-card-v62::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  background:
    linear-gradient(180deg,
      rgba(4,8,16,.24) 0%,
      rgba(4,8,16,.38) 34%,
      rgba(3,7,14,.74) 58%,
      rgba(3,7,14,.98) 100%) !important;
  pointer-events:none !important;
}

/* obvious dark glass panel under all lower text */
.product-card-v62::before{
  content:"" !important;
  position:absolute !important;
  left:12px !important;
  right:12px !important;
  bottom:12px !important;
  height:54% !important;
  z-index:2 !important;
  border-radius:24px !important;
  background:
    linear-gradient(180deg,rgba(8,14,26,.72),rgba(5,9,18,.94)) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  box-shadow:
    0 18px 46px rgba(0,0,0,.48),
    inset 0 1px 0 rgba(255,255,255,.10) !important;
  backdrop-filter:blur(12px) !important;
  -webkit-backdrop-filter:blur(12px) !important;
  pointer-events:none !important;
}

/* top badges above overlay */
.product-card-v62 .product-top-line{
  z-index:4 !important;
}

/* text above the new panel */
.product-card-v62 h3,
.product-card-v62 p,
.product-card-v62 .product-chip-row,
.product-card-v62 .product-card-bottom{
  z-index:4 !important;
}

/* move content into the dark panel */
.product-card-v62 h3{
  margin-top:124px !important;
  padding:0 10px !important;
  color:#ffffff !important;
  font-size:24px !important;
  line-height:1.05 !important;
  text-shadow:0 3px 18px rgba(0,0,0,.85) !important;
}

.product-card-v62 p{
  padding:0 10px !important;
  color:#e7eefb !important;
  font-size:14px !important;
  font-weight:850 !important;
  line-height:1.32 !important;
  text-shadow:0 2px 12px rgba(0,0,0,.88) !important;
  opacity:1 !important;
}

.product-card-v62 .product-chip-row{
  padding:0 10px !important;
  gap:7px !important;
}

.product-card-v62 .product-chip-row span{
  background:rgba(2,7,15,.86) !important;
  border:1px solid rgba(255,255,255,.20) !important;
  color:#ffffff !important;
  min-height:28px !important;
  padding:0 11px !important;
  box-shadow:0 8px 20px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.12) !important;
}

.product-card-v62 .product-card-bottom{
  padding:0 10px 0 !important;
}

/* make price/status readable and separated */
.product-card-v62 .product-status{
  color:#7dffd0 !important;
  font-size:12px !important;
  letter-spacing:.01em !important;
  text-shadow:0 2px 12px rgba(0,0,0,.9) !important;
}

.product-card-v62 .price{
  color:#66ffc8 !important;
  font-size:24px !important;
  font-weight:1000 !important;
  text-shadow:
    0 3px 14px rgba(0,0,0,.95),
    0 0 20px rgba(102,255,200,.23) !important;
}

/* buttons clearly separated */
.product-card-v62 .card-quick-actions .mini-btn{
  background:rgba(2,7,15,.78) !important;
  color:#ffffff !important;
  border:1px solid rgba(255,255,255,.22) !important;
  box-shadow:0 10px 24px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.12) !important;
}

.product-card-v62 .card-quick-actions .add{
  background:linear-gradient(135deg,#20c9ff,#8a58ff) !important;
  color:#ffffff !important;
  box-shadow:0 14px 34px rgba(45,151,255,.38) !important;
}

/* top badges darker and readable */
.product-card-v62 .product-brand-pill,
.product-card-v62 .product-badge{
  background:rgba(3,8,17,.82) !important;
  color:#ffffff !important;
  border-color:rgba(255,255,255,.24) !important;
  box-shadow:0 8px 22px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.13) !important;
}

.product-card-v62 .product-badge.stock{
  background:rgba(5,42,31,.88) !important;
  color:#77ffd1 !important;
  border-color:rgba(110,255,205,.38) !important;
}

@media(max-width:900px){
  .product-card-v62::before{
    height:58% !important;
  }

  .product-card-v62 h3{
    margin-top:104px !important;
    font-size:22px !important;
  }
}

@media(max-width:700px){
  .product-card-v62 img{
    filter:brightness(.55) contrast(1.12) saturate(.9) !important;
  }

  .product-card-v62::before{
    left:7px !important;
    right:7px !important;
    bottom:7px !important;
    height:58% !important;
    border-radius:16px !important;
  }

  .product-card-v62 h3{
    margin-top:58px !important;
    padding:0 5px !important;
    font-size:13px !important;
  }

  .product-card-v62 .product-chip-row{
    padding:0 5px !important;
  }

  .product-card-v62 .product-card-bottom{
    padding:0 5px !important;
  }
}


/* v65: clean product cards — visible image + readable separate content panel */
.product-card-v62{
  min-height:420px !important;
  padding:14px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-start !important;
  overflow:hidden !important;
  background:#0b1322 !important;
  border-color:rgba(90,210,255,.28) !important;
  box-shadow:
    0 22px 56px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.12) !important;
}

/* image must be visible, not killed by dark overlay */
.product-card-v62 img{
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  width:100% !important;
  height:210px !important;
  object-fit:cover !important;
  object-position:center !important;
  opacity:1 !important;
  filter:brightness(.88) contrast(1.03) saturate(1.02) !important;
  transform:none !important;
}

/* light gradient only for top photo readability */
.product-card-v62::after{
  content:"" !important;
  position:absolute !important;
  inset:0 0 auto 0 !important;
  height:210px !important;
  z-index:1 !important;
  background:
    linear-gradient(180deg,rgba(5,9,17,.18) 0%,rgba(5,9,17,.10) 44%,rgba(5,9,17,.42) 100%) !important;
  pointer-events:none !important;
}

/* bottom content panel — separate from image, not covering all of it */
.product-card-v62::before{
  content:"" !important;
  position:absolute !important;
  left:12px !important;
  right:12px !important;
  top:176px !important;
  bottom:12px !important;
  height:auto !important;
  z-index:2 !important;
  border-radius:22px !important;
  background:
    linear-gradient(180deg,rgba(12,18,31,.96),rgba(6,10,19,.98)) !important;
  border:1px solid rgba(110,210,255,.20) !important;
  box-shadow:
    0 14px 36px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.09) !important;
  backdrop-filter:blur(10px) !important;
  -webkit-backdrop-filter:blur(10px) !important;
  pointer-events:none !important;
}

/* top badges stay on image */
.product-card-v62 .product-top-line{
  position:relative !important;
  z-index:4 !important;
  min-height:30px !important;
  margin:0 !important;
  pointer-events:none !important;
}

.product-card-v62 .product-brand-pill,
.product-card-v62 .product-badge{
  min-height:24px !important;
  padding:0 10px !important;
  font-size:9.5px !important;
  background:rgba(8,13,23,.72) !important;
  border:1px solid rgba(255,255,255,.22) !important;
  color:#f6f9ff !important;
  box-shadow:0 8px 18px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.12) !important;
}

.product-card-v62 .product-badge.stock{
  background:rgba(8,48,36,.76) !important;
  color:#7dffd0 !important;
  border-color:rgba(120,255,210,.32) !important;
}

/* content starts inside lower panel */
.product-card-v62 h3{
  position:relative !important;
  z-index:4 !important;
  margin:138px 10px 10px !important;
  min-height:auto !important;
  padding:0 !important;
  color:#ffffff !important;
  font-size:22px !important;
  line-height:1.08 !important;
  letter-spacing:-.035em !important;
  text-shadow:none !important;
  pointer-events:none !important;
}

.product-card-v62 p{
  position:relative !important;
  z-index:4 !important;
  min-height:38px !important;
  margin:0 10px 10px !important;
  padding:0 !important;
  color:#cbd6e6 !important;
  font-size:13px !important;
  line-height:1.34 !important;
  font-weight:750 !important;
  text-shadow:none !important;
  opacity:1 !important;
  pointer-events:none !important;
}

/* centered readable characteristic pills */
.product-card-v62 .product-chip-row{
  position:relative !important;
  z-index:4 !important;
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:6px !important;
  min-height:30px !important;
  margin:0 10px 10px !important;
  padding:0 !important;
  pointer-events:none !important;
}

.product-card-v62 .product-chip-row span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:23px !important;
  padding:0 9px !important;
  line-height:1 !important;
  color:#eef5ff !important;
  font-size:10px !important;
  font-weight:950 !important;
  background:rgba(17,25,40,.86) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  border-radius:999px !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10) !important;
  text-align:center !important;
  white-space:nowrap !important;
}

/* bottom actions inside panel */
.product-card-v62 .product-card-bottom{
  position:relative !important;
  z-index:4 !important;
  margin:auto 10px 0 !important;
  padding:0 0 2px !important;
  display:flex !important;
  align-items:flex-end !important;
  justify-content:space-between !important;
  gap:12px !important;
  pointer-events:none !important;
}

.product-card-v62 .product-status{
  font-size:11px !important;
  margin-bottom:4px !important;
  color:#73ffc8 !important;
  font-weight:950 !important;
  text-shadow:none !important;
}

.product-card-v62 .price{
  font-size:23px !important;
  line-height:1 !important;
  color:#65ffc4 !important;
  font-weight:1000 !important;
  text-shadow:0 0 16px rgba(101,255,196,.16) !important;
}

.product-card-v62 .card-quick-actions{
  min-width:118px !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:8px !important;
  pointer-events:auto !important;
  z-index:6 !important;
}

.product-card-v62 .card-quick-actions .mini-btn,
.product-card-v62 .card-quick-actions .add{
  height:40px !important;
  min-height:40px !important;
  border-radius:14px !important;
  font-size:13px !important;
  font-weight:950 !important;
}

.product-card-v62 .card-quick-actions .mini-btn{
  background:rgba(20,29,46,.76) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  color:#f7fbff !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10) !important;
}

.product-card-v62 .card-quick-actions .add{
  background:linear-gradient(135deg,#36caff,#8b5cff) !important;
  color:#fff !important;
  box-shadow:0 12px 28px rgba(67,155,255,.26) !important;
}

/* hitbox stays behind quick action buttons */
.product-card-v62 .card-open-hitbox{
  z-index:3 !important;
}

@media(max-width:900px){
  .product-card-v62{
    min-height:390px !important;
  }

  .product-card-v62 img,
  .product-card-v62::after{
    height:190px !important;
  }

  .product-card-v62::before{
    top:158px !important;
  }

  .product-card-v62 h3{
    margin-top:120px !important;
    font-size:20px !important;
  }
}

@media(max-width:700px){
  .product-card-v62{
    min-height:236px !important;
    padding:8px !important;
  }

  .product-card-v62 img,
  .product-card-v62::after{
    height:112px !important;
  }

  .product-card-v62::before{
    left:6px !important;
    right:6px !important;
    top:88px !important;
    bottom:6px !important;
    border-radius:15px !important;
  }

  .product-card-v62 .product-top-line{
    min-height:18px !important;
    gap:4px !important;
  }

  .product-card-v62 .product-brand-pill,
  .product-card-v62 .product-badge{
    min-height:16px !important;
    padding:0 5px !important;
    font-size:6.5px !important;
  }

  .product-card-v62 h3{
    margin:70px 5px 5px !important;
    font-size:13px !important;
    line-height:1.05 !important;
  }

  .product-card-v62 p{
    display:none !important;
  }

  .product-card-v62 .product-chip-row{
    min-height:18px !important;
    margin:0 5px 5px !important;
    gap:3px !important;
  }

  .product-card-v62 .product-chip-row span{
    min-height:15px !important;
    padding:0 4px !important;
    font-size:6.5px !important;
  }

  .product-card-v62 .product-card-bottom{
    margin:auto 5px 0 !important;
    gap:4px !important;
  }

  .product-card-v62 .product-status{
    font-size:7px !important;
    margin-bottom:2px !important;
  }

  .product-card-v62 .price{
    font-size:12px !important;
  }

  .product-card-v62 .card-quick-actions{
    min-width:62px !important;
    gap:3px !important;
  }

  .product-card-v62 .card-quick-actions .mini-btn,
  .product-card-v62 .card-quick-actions .add{
    height:22px !important;
    min-height:22px !important;
    border-radius:8px !important;
    font-size:7px !important;
    padding:0 4px !important;
  }
}


/* v66: full product card redesign */
.product-card-v66{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  padding:0 !important;
  min-height:420px !important;
  overflow:hidden !important;
  border-radius:24px !important;
  background:linear-gradient(180deg,#10192a 0%, #0a1220 100%) !important;
  border:1px solid rgba(95,205,255,.24) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
.product-card-v66 *{box-sizing:border-box !important;}
.product-card-v66 .pc-media{
  position:relative !important;
  height:225px !important;
  min-height:225px !important;
  overflow:hidden !important;
}
.product-card-v66 .pc-media img{
  width:100% !important;
  height:100% !important;
  display:block !important;
  object-fit:cover !important;
  object-position:center !important;
  filter:brightness(.86) contrast(1.04) saturate(1.02) !important;
}
.product-card-v66 .pc-media::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:linear-gradient(180deg,rgba(6,10,18,.08) 0%, rgba(6,10,18,.14) 38%, rgba(6,10,18,.42) 100%) !important;
  pointer-events:none !important;
}
.product-card-v66 .card-open-hitbox{
  position:absolute !important;
  inset:0 !important;
  z-index:2 !important;
  background:transparent !important;
  border:0 !important;
  cursor:pointer !important;
}
.product-card-v66 .product-top-line{
  position:absolute !important;
  left:14px !important;
  right:14px !important;
  top:14px !important;
  z-index:4 !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:8px !important;
  pointer-events:none !important;
}
.product-card-v66 .product-brand-pill,
.product-card-v66 .product-badge{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:24px !important;
  padding:0 10px !important;
  border-radius:999px !important;
  font-size:9.5px !important;
  line-height:1 !important;
  font-weight:900 !important;
  color:#ffffff !important;
  background:rgba(10,16,27,.74) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  backdrop-filter:blur(6px) !important;
  -webkit-backdrop-filter:blur(6px) !important;
  box-shadow:0 6px 16px rgba(0,0,0,.18) !important;
}
.product-card-v66 .product-badge-row{
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:flex-end !important;
  gap:6px !important;
}
.product-card-v66 .product-badge.stock{
  color:#7fffcc !important;
  border-color:rgba(125,255,204,.32) !important;
  background:rgba(8,47,36,.76) !important;
}
.product-card-v66 .product-badge.order{
  color:#ffd89b !important;
  border-color:rgba(255,216,155,.28) !important;
  background:rgba(53,35,10,.76) !important;
}
.product-card-v66 .pc-content{
  position:relative !important;
  z-index:3 !important;
  display:flex !important;
  flex-direction:column !important;
  gap:10px !important;
  flex:1 !important;
  margin-top:-8px !important;
  padding:18px 16px 16px !important;
  background:linear-gradient(180deg, rgba(8,14,24,.88) 0%, rgba(7,12,21,.97) 24%, rgba(6,10,18,.99) 100%) !important;
  border-top:1px solid rgba(110,210,255,.18) !important;
  border-radius:20px 20px 24px 24px !important;
  box-shadow:0 -10px 26px rgba(0,0,0,.24) !important;
}
.product-card-v66 h3{
  margin:0 !important;
  font-size:18px !important;
  line-height:1.12 !important;
  letter-spacing:-.03em !important;
  font-weight:950 !important;
  color:#ffffff !important;
  text-shadow:none !important;
}
.product-card-v66 p{
  margin:0 !important;
  font-size:13px !important;
  line-height:1.35 !important;
  color:#d0d9e7 !important;
  font-weight:700 !important;
  text-shadow:none !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}
.product-card-v66 .product-chip-row{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:6px !important;
  align-items:center !important;
  min-height:28px !important;
  margin:0 !important;
}
.product-card-v66 .product-chip-row span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:0 9px !important;
  min-height:24px !important;
  border-radius:999px !important;
  font-size:10px !important;
  line-height:1 !important;
  font-weight:850 !important;
  color:#f3f7ff !important;
  white-space:nowrap !important;
  background:rgba(255,255,255,.08) !important;
  border:1px solid rgba(255,255,255,.14) !important;
}
.product-card-v66 .product-card-bottom{
  margin-top:auto !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  gap:12px !important;
  align-items:end !important;
}
.product-card-v66 .pc-price-block{min-width:0 !important;}
.product-card-v66 .product-status{
  margin:0 0 4px !important;
  font-size:11px !important;
  line-height:1 !important;
  font-weight:950 !important;
  color:#78ffca !important;
}
.product-card-v66 .price{
  margin:0 !important;
  font-size:18px !important;
  line-height:1 !important;
  font-weight:1000 !important;
  letter-spacing:-.03em !important;
  color:#54ffbc !important;
}
.product-card-v66 .card-quick-actions{
  display:flex !important;
  flex-direction:column !important;
  gap:8px !important;
  width:132px !important;
  min-width:132px !important;
  pointer-events:auto !important;
  z-index:5 !important;
}
.product-card-v66 .card-quick-actions .mini-btn,
.product-card-v66 .card-quick-actions .add{
  width:100% !important;
  height:38px !important;
  min-height:38px !important;
  border-radius:12px !important;
  border:1px solid rgba(255,255,255,.16) !important;
  font-size:13px !important;
  line-height:1 !important;
  font-weight:900 !important;
  cursor:pointer !important;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease !important;
}
.product-card-v66 .card-quick-actions .mini-btn{
  background:rgba(255,255,255,.06) !important;
  color:#ffffff !important;
}
.product-card-v66 .card-quick-actions .add{
  background:linear-gradient(135deg,#42caff,#8b61ff) !important;
  color:#ffffff !important;
  box-shadow:0 10px 20px rgba(74,156,255,.22) !important;
}
.product-card-v66 .card-quick-actions .mini-btn:hover,
.product-card-v66 .card-quick-actions .add:hover{
  transform:translateY(-1px) !important;
}

/* density modes */
body.grid-density-4 .product-card-v66{
  min-height:400px !important;
}
body.grid-density-6 .product-card-v66{
  min-height:360px !important;
}
body.grid-density-6 .product-card-v66 .pc-media{height:190px !important;min-height:190px !important;}
body.grid-density-6 .product-card-v66 h3{font-size:16px !important;}
body.grid-density-6 .product-card-v66 p{font-size:12px !important;}
body.grid-density-6 .product-card-v66 .product-chip-row span{font-size:9px !important;min-height:22px !important;padding:0 8px !important;}
body.grid-density-6 .product-card-v66 .card-quick-actions{width:120px !important;min-width:120px !important;}
body.grid-density-6 .product-card-v66 .card-quick-actions .mini-btn,
body.grid-density-6 .product-card-v66 .card-quick-actions .add{height:34px !important;font-size:12px !important;}

/* mobile */
@media(max-width:700px){
  .product-card-v66{
    min-height:234px !important;
    border-radius:18px !important;
  }
  .product-card-v66 .pc-media{height:104px !important;min-height:104px !important;}
  .product-card-v66 .product-top-line{left:8px !important;right:8px !important;top:8px !important;gap:5px !important;}
  .product-card-v66 .product-brand-pill,
  .product-card-v66 .product-badge{min-height:16px !important;padding:0 6px !important;font-size:6.5px !important;}
  .product-card-v66 .product-badge-row{gap:4px !important;}
  .product-card-v66 .pc-content{margin-top:-5px !important;padding:10px 8px 8px !important;border-radius:14px 14px 18px 18px !important;gap:6px !important;}
  .product-card-v66 h3{font-size:11px !important;line-height:1.08 !important;}
  .product-card-v66 p{font-size:8px !important;line-height:1.22 !important;-webkit-line-clamp:2 !important;}
  .product-card-v66 .product-chip-row{gap:4px !important;min-height:18px !important;}
  .product-card-v66 .product-chip-row span{min-height:16px !important;padding:0 5px !important;font-size:6.5px !important;}
  .product-card-v66 .product-card-bottom{gap:6px !important;}
  .product-card-v66 .product-status{font-size:7px !important;margin-bottom:2px !important;}
  .product-card-v66 .price{font-size:11px !important;}
  .product-card-v66 .card-quick-actions{width:72px !important;min-width:72px !important;gap:4px !important;}
  .product-card-v66 .card-quick-actions .mini-btn,
  .product-card-v66 .card-quick-actions .add{height:24px !important;min-height:24px !important;border-radius:8px !important;font-size:7px !important;padding:0 4px !important;}
}


/* v67: balanced product card — no floating buttons, no heavy photo overlay */
.product-card-v66{
  min-height:390px !important;
  border-radius:24px !important;
  background:#0a1220 !important;
}

.product-card-v66 .pc-media{
  height:185px !important;
  min-height:185px !important;
}

.product-card-v66 .pc-media img{
  filter:brightness(.92) contrast(1.03) saturate(1.04) !important;
}

.product-card-v66 .pc-media::after{
  background:
    linear-gradient(180deg,rgba(4,8,16,.04) 0%,rgba(4,8,16,.12) 52%,rgba(4,8,16,.36) 100%) !important;
}

.product-card-v66 .pc-content{
  margin-top:0 !important;
  flex:1 !important;
  padding:16px !important;
  gap:9px !important;
  border-radius:0 0 24px 24px !important;
  background:linear-gradient(180deg,rgba(8,14,24,.98),rgba(5,10,18,1)) !important;
  border-top:1px solid rgba(110,210,255,.16) !important;
  box-shadow:none !important;
}

.product-card-v66 h3{
  font-size:18px !important;
  line-height:1.08 !important;
  margin:0 !important;
}

.product-card-v66 p{
  font-size:12.5px !important;
  line-height:1.32 !important;
  min-height:34px !important;
  color:#d3dcec !important;
}

.product-card-v66 .product-chip-row{
  min-height:28px !important;
  gap:6px !important;
}

.product-card-v66 .product-chip-row span{
  min-height:23px !important;
  padding:0 9px !important;
  font-size:9.5px !important;
  background:rgba(255,255,255,.075) !important;
}

/* Footer now has price/status above and buttons in a stable bottom row */
.product-card-v66 .product-card-bottom{
  margin-top:auto !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
  align-items:stretch !important;
}

.product-card-v66 .pc-price-block{
  display:flex !important;
  align-items:flex-end !important;
  justify-content:space-between !important;
  gap:10px !important;
  min-width:0 !important;
}

.product-card-v66 .product-status{
  margin:0 !important;
  font-size:11px !important;
  line-height:1 !important;
}

.product-card-v66 .price{
  font-size:20px !important;
  line-height:1 !important;
  white-space:nowrap !important;
}

.product-card-v66 .card-quick-actions{
  width:100% !important;
  min-width:0 !important;
  display:grid !important;
  grid-template-columns:.9fr 1.1fr !important;
  gap:8px !important;
}

.product-card-v66 .card-quick-actions .mini-btn,
.product-card-v66 .card-quick-actions .add{
  width:100% !important;
  height:40px !important;
  min-height:40px !important;
  border-radius:13px !important;
  font-size:13px !important;
}

/* keep top badges compact but readable */
.product-card-v66 .product-top-line{
  left:13px !important;
  right:13px !important;
  top:13px !important;
}

.product-card-v66 .product-brand-pill,
.product-card-v66 .product-badge{
  min-height:23px !important;
  padding:0 9px !important;
  font-size:9px !important;
}

@media(max-width:900px){
  .product-card-v66{
    min-height:370px !important;
  }

  .product-card-v66 .pc-media{
    height:170px !important;
    min-height:170px !important;
  }

  .product-card-v66 h3{
    font-size:17px !important;
  }
}

@media(max-width:700px){
  .product-card-v66{
    min-height:240px !important;
    border-radius:18px !important;
  }

  .product-card-v66 .pc-media{
    height:95px !important;
    min-height:95px !important;
  }

  .product-card-v66 .pc-content{
    padding:9px 8px 8px !important;
    gap:5px !important;
    border-radius:0 0 18px 18px !important;
  }

  .product-card-v66 h3{
    font-size:11px !important;
  }

  .product-card-v66 p{
    font-size:7.8px !important;
    line-height:1.2 !important;
    min-height:18px !important;
  }

  .product-card-v66 .product-chip-row{
    min-height:16px !important;
    gap:3px !important;
  }

  .product-card-v66 .product-chip-row span{
    min-height:14px !important;
    padding:0 4px !important;
    font-size:6.2px !important;
  }

  .product-card-v66 .pc-price-block{
    gap:5px !important;
  }

  .product-card-v66 .product-status{
    font-size:6.8px !important;
  }

  .product-card-v66 .price{
    font-size:11px !important;
  }

  .product-card-v66 .card-quick-actions{
    grid-template-columns:1fr 1fr !important;
    gap:4px !important;
  }

  .product-card-v66 .card-quick-actions .mini-btn,
  .product-card-v66 .card-quick-actions .add{
    height:23px !important;
    min-height:23px !important;
    border-radius:8px !important;
    font-size:6.8px !important;
    padding:0 3px !important;
  }
}


/* v68 HARD RESET — product cards rebuilt from zero */
#productGrid .card.product-card-v68,
#popularGrid .card.product-card-v68,
#categoryPopularGrid .card.product-card-v68,
.card.product-card-v68{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  min-height:392px !important;
  height:auto !important;
  padding:0 !important;
  overflow:hidden !important;
  border-radius:24px !important;
  background:#09111f !important;
  border:1px solid rgba(93,204,255,.24) !important;
  box-shadow:0 18px 46px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.10) !important;
  transform:none !important;
  cursor:pointer !important;
}

.card.product-card-v68::before,
.card.product-card-v68::after{
  display:none !important;
  content:none !important;
}

.card.product-card-v68 *{
  box-sizing:border-box !important;
}

.card.product-card-v68 .v68-image{
  position:relative !important;
  width:100% !important;
  height:180px !important;
  min-height:180px !important;
  overflow:hidden !important;
  background:#111827 !important;
}

.card.product-card-v68 .v68-image img{
  position:relative !important;
  inset:auto !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
  opacity:1 !important;
  filter:brightness(.94) contrast(1.04) saturate(1.03) !important;
  transform:none !important;
}

.card.product-card-v68 .v68-image::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:linear-gradient(180deg,rgba(5,9,18,.06),rgba(5,9,18,.10) 50%,rgba(5,9,18,.42)) !important;
  pointer-events:none !important;
}

.card.product-card-v68 .v68-hitbox{
  position:absolute !important;
  inset:0 !important;
  z-index:2 !important;
  border:0 !important;
  background:transparent !important;
  padding:0 !important;
  cursor:pointer !important;
}

.card.product-card-v68 .v68-top{
  position:absolute !important;
  left:13px !important;
  right:13px !important;
  top:13px !important;
  z-index:3 !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:8px !important;
  pointer-events:none !important;
}

.card.product-card-v68 .v68-brand,
.card.product-card-v68 .v68-badges span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:23px !important;
  padding:0 9px !important;
  border-radius:999px !important;
  line-height:1 !important;
  font-size:9px !important;
  font-weight:900 !important;
  color:#fff !important;
  background:rgba(6,11,20,.72) !important;
  border:1px solid rgba(255,255,255,.20) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.22) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
  white-space:nowrap !important;
}

.card.product-card-v68 .v68-badges{
  display:flex !important;
  justify-content:flex-end !important;
  flex-wrap:wrap !important;
  gap:6px !important;
}

.card.product-card-v68 .v68-badges .is-stock{
  color:#7fffd0 !important;
  background:rgba(8,52,39,.76) !important;
  border-color:rgba(127,255,208,.32) !important;
}

.card.product-card-v68 .v68-badges .is-order{
  color:#ffd796 !important;
  background:rgba(52,35,10,.76) !important;
  border-color:rgba(255,215,150,.28) !important;
}

.card.product-card-v68 .v68-body{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  flex:1 !important;
  gap:10px !important;
  padding:16px !important;
  background:linear-gradient(180deg,#0d1626 0%,#07101d 100%) !important;
  border-top:1px solid rgba(100,208,255,.16) !important;
}

.card.product-card-v68 .v68-title-hitbox{
  display:block !important;
  text-align:left !important;
  border:0 !important;
  padding:0 !important;
  margin:0 !important;
  background:transparent !important;
  color:inherit !important;
  cursor:pointer !important;
}

.card.product-card-v68 h3{
  position:static !important;
  z-index:auto !important;
  margin:0 0 8px !important;
  min-height:0 !important;
  padding:0 !important;
  font-size:18px !important;
  line-height:1.12 !important;
  letter-spacing:-.03em !important;
  font-weight:950 !important;
  color:#fff !important;
  text-shadow:none !important;
}

.card.product-card-v68 p{
  position:static !important;
  z-index:auto !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
  min-height:34px !important;
  margin:0 !important;
  padding:0 !important;
  font-size:12.5px !important;
  line-height:1.34 !important;
  font-weight:700 !important;
  color:#d2dbea !important;
  opacity:1 !important;
  text-shadow:none !important;
}

.card.product-card-v68 .v68-chips{
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:6px !important;
  min-height:28px !important;
  margin:0 !important;
  padding:0 !important;
}

.card.product-card-v68 .v68-chips span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:23px !important;
  padding:0 9px !important;
  border-radius:999px !important;
  line-height:1 !important;
  font-size:9.5px !important;
  font-weight:850 !important;
  color:#eef5ff !important;
  background:rgba(255,255,255,.075) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  white-space:nowrap !important;
}

.card.product-card-v68 .v68-footer{
  margin-top:auto !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
}

.card.product-card-v68 .v68-pricebox{
  display:flex !important;
  align-items:flex-end !important;
  justify-content:space-between !important;
  gap:10px !important;
}

.card.product-card-v68 .v68-status{
  font-size:11px !important;
  line-height:1 !important;
  font-weight:950 !important;
  color:#9fb0c7 !important;
}

.card.product-card-v68 .v68-status.is-green{
  color:#78ffca !important;
}

.card.product-card-v68 .v68-pricebox b{
  font-size:20px !important;
  line-height:1 !important;
  font-weight:1000 !important;
  letter-spacing:-.03em !important;
  color:#5dffc4 !important;
  white-space:nowrap !important;
}

.card.product-card-v68 .v68-actions{
  display:grid !important;
  grid-template-columns:.9fr 1.1fr !important;
  gap:8px !important;
  width:100% !important;
}

.card.product-card-v68 .v68-more,
.card.product-card-v68 .v68-cart{
  width:100% !important;
  height:40px !important;
  min-height:40px !important;
  border-radius:13px !important;
  font-size:13px !important;
  line-height:1 !important;
  font-weight:950 !important;
  cursor:pointer !important;
}

.card.product-card-v68 .v68-more{
  color:#fff !important;
  background:rgba(255,255,255,.065) !important;
  border:1px solid rgba(255,255,255,.18) !important;
}

.card.product-card-v68 .v68-cart{
  color:#fff !important;
  background:linear-gradient(135deg,#42caff,#8b61ff) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  box-shadow:0 12px 24px rgba(66,159,255,.24) !important;
}

/* grid density */
body.grid-density-6 .card.product-card-v68{
  min-height:356px !important;
}
body.grid-density-6 .card.product-card-v68 .v68-image{
  height:155px !important;
  min-height:155px !important;
}
body.grid-density-6 .card.product-card-v68 h3{
  font-size:15px !important;
}
body.grid-density-6 .card.product-card-v68 p{
  font-size:11px !important;
  min-height:30px !important;
}
body.grid-density-6 .card.product-card-v68 .v68-chips span{
  font-size:8px !important;
  min-height:20px !important;
  padding:0 7px !important;
}
body.grid-density-6 .card.product-card-v68 .v68-more,
body.grid-density-6 .card.product-card-v68 .v68-cart{
  height:34px !important;
  min-height:34px !important;
  font-size:11px !important;
}

@media(max-width:700px){
  .card.product-card-v68{
    min-height:238px !important;
    border-radius:18px !important;
  }
  .card.product-card-v68 .v68-image{
    height:96px !important;
    min-height:96px !important;
  }
  .card.product-card-v68 .v68-top{
    left:8px !important;
    right:8px !important;
    top:8px !important;
  }
  .card.product-card-v68 .v68-brand,
  .card.product-card-v68 .v68-badges span{
    min-height:16px !important;
    padding:0 5px !important;
    font-size:6.5px !important;
  }
  .card.product-card-v68 .v68-badges{
    gap:3px !important;
  }
  .card.product-card-v68 .v68-body{
    padding:9px 8px 8px !important;
    gap:5px !important;
  }
  .card.product-card-v68 h3{
    font-size:11px !important;
    margin-bottom:4px !important;
  }
  .card.product-card-v68 p{
    font-size:7.8px !important;
    line-height:1.2 !important;
    min-height:18px !important;
  }
  .card.product-card-v68 .v68-chips{
    gap:3px !important;
    min-height:16px !important;
  }
  .card.product-card-v68 .v68-chips span{
    min-height:14px !important;
    padding:0 4px !important;
    font-size:6.2px !important;
  }
  .card.product-card-v68 .v68-footer{
    gap:5px !important;
  }
  .card.product-card-v68 .v68-status{
    font-size:6.8px !important;
  }
  .card.product-card-v68 .v68-pricebox b{
    font-size:11px !important;
  }
  .card.product-card-v68 .v68-actions{
    gap:4px !important;
  }
  .card.product-card-v68 .v68-more,
  .card.product-card-v68 .v68-cart{
    height:23px !important;
    min-height:23px !important;
    border-radius:8px !important;
    font-size:6.8px !important;
    padding:0 3px !important;
  }
}


/* v69 DEBUG: if this is visible, deployment uses this archive */
#v69-debug-version-marker{
  position:fixed !important;
  z-index:999999 !important;
  left:12px !important;
  top:12px !important;
  padding:12px 16px !important;
  border-radius:16px !important;
  background:linear-gradient(135deg,#00e5ff,#7cffc7) !important;
  color:#03101f !important;
  font-weight:1000 !important;
  font-size:14px !important;
  box-shadow:0 14px 40px rgba(0,229,255,.35) !important;
  border:2px solid #fff !important;
  pointer-events:none !important;
}

/* v69 DEBUG: make product cards visually unmistakable */
.card.product-card-v68{
  border:3px solid #00e5ff !important;
  box-shadow:0 0 0 3px rgba(124,255,199,.45), 0 26px 70px rgba(0,229,255,.28) !important;
}

.card.product-card-v68 .v68-body{
  background:linear-gradient(180deg,#071d2a 0%,#06111f 100%) !important;
}

.card.product-card-v68 .v68-cart{
  background:linear-gradient(135deg,#00e5ff,#7cffc7) !important;
  color:#02101f !important;
}

.card.product-card-v68 .v68-more{
  background:rgba(0,229,255,.12) !important;
  border-color:rgba(0,229,255,.45) !important;
}

body::before{
  content:"V69 TEST" !important;
  position:fixed !important;
  right:14px !important;
  bottom:14px !important;
  z-index:999999 !important;
  font-size:13px !important;
  font-weight:1000 !important;
  color:#00111c !important;
  background:#7cffc7 !important;
  padding:10px 14px !important;
  border-radius:999px !important;
  border:2px solid #fff !important;
}


/* ===== V70 PRODUCT CARD FIXES ===== */
#v69-debug-version-marker,
body::before{
  display:none !important;
  content:none !important;
}

/* reset loud debug glow */
#productGrid .card.product-card-v68,
#popularGrid .card.product-card-v68,
#categoryPopularGrid .card.product-card-v68,
.card.product-card-v68{
  border:1px solid rgba(114,186,255,.22) !important;
  box-shadow:0 18px 40px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.08) !important;
  background:linear-gradient(180deg,rgba(10,17,31,.96),rgba(8,13,24,.98)) !important;
  min-height:448px !important;
  border-radius:24px !important;
}

.card.product-card-v68 .v68-image{
  height:236px !important;
  min-height:236px !important;
}

.card.product-card-v68 .v68-image img{
  filter:brightness(.97) contrast(1.02) saturate(1.03) !important;
}

.card.product-card-v68 .v68-image::after{
  background:linear-gradient(180deg,rgba(4,8,16,.08) 0%,rgba(4,8,16,.12) 55%,rgba(4,8,16,.32) 100%) !important;
}

.card.product-card-v68 .v68-top{
  left:14px !important;
  right:14px !important;
  top:14px !important;
}

.card.product-card-v68 .v68-brand,
.card.product-card-v68 .v68-badges span{
  min-height:26px !important;
  padding:0 10px !important;
  font-size:10px !important;
  font-weight:900 !important;
  background:rgba(6,11,20,.60) !important;
  border-color:rgba(255,255,255,.18) !important;
}

.card.product-card-v68 .v68-badges{gap:7px !important;}

.card.product-card-v68 .v68-body{
  padding:18px 16px 16px !important;
  gap:12px !important;
  background:linear-gradient(180deg,#0c1626 0%,#08121f 100%) !important;
}

.card.product-card-v68 h3{
  font-size:18px !important;
  line-height:1.15 !important;
  margin:0 0 8px !important;
}

.card.product-card-v68 p{
  font-size:13.5px !important;
  line-height:1.42 !important;
  color:#d9e4f4 !important;
  min-height:38px !important;
  -webkit-line-clamp:2 !important;
}

.card.product-card-v68 .v68-chips{
  gap:7px !important;
  min-height:32px !important;
}

.card.product-card-v68 .v68-chips span{
  min-height:26px !important;
  padding:0 10px !important;
  border-radius:999px !important;
  font-size:10px !important;
  font-weight:800 !important;
  color:#f4f8ff !important;
  background:rgba(255,255,255,.06) !important;
  border:1px solid rgba(255,255,255,.14) !important;
}

.card.product-card-v68 .v68-footer{gap:12px !important;}

.card.product-card-v68 .v68-status{
  font-size:12px !important;
  font-weight:900 !important;
}

.card.product-card-v68 .v68-pricebox b{
  font-size:18px !important;
  letter-spacing:-.02em !important;
  color:#6cf0c4 !important;
}

.card.product-card-v68 .v68-actions{
  grid-template-columns:1fr 1fr !important;
  gap:10px !important;
  align-items:stretch !important;
}

.card.product-card-v68 .v68-more,
.card.product-card-v68 .v68-cart{
  height:46px !important;
  min-height:46px !important;
  border-radius:14px !important;
  font-size:14px !important;
  font-weight:900 !important;
  letter-spacing:-.01em !important;
  justify-content:center !important;
}

.card.product-card-v68 .v68-more{
  background:rgba(255,255,255,.025) !important;
  border:1px solid rgba(140,170,215,.28) !important;
  color:#f6fbff !important;
}

.card.product-card-v68 .v68-cart{
  background:linear-gradient(135deg,#4aa6ff 0%,#746dff 100%) !important;
  border:1px solid rgba(161,196,255,.28) !important;
  color:#ffffff !important;
  box-shadow:0 10px 24px rgba(61,120,255,.18) !important;
}

/* better appearance when using 4 or 6 cards */
body.grid-density-4 .card.product-card-v68,
body.grid-density-6 .card.product-card-v68{
  min-height:420px !important;
}
body.grid-density-4 .card.product-card-v68 .v68-image,
body.grid-density-6 .card.product-card-v68 .v68-image{
  height:206px !important;
  min-height:206px !important;
}
body.grid-density-4 .card.product-card-v68 h3,
body.grid-density-6 .card.product-card-v68 h3{
  font-size:16px !important;
}
body.grid-density-4 .card.product-card-v68 p,
body.grid-density-6 .card.product-card-v68 p{
  font-size:12px !important;
  min-height:34px !important;
}
body.grid-density-4 .card.product-card-v68 .v68-chips span,
body.grid-density-6 .card.product-card-v68 .v68-chips span{
  min-height:24px !important;
  font-size:9px !important;
}
body.grid-density-4 .card.product-card-v68 .v68-more,
body.grid-density-4 .card.product-card-v68 .v68-cart,
body.grid-density-6 .card.product-card-v68 .v68-more,
body.grid-density-6 .card.product-card-v68 .v68-cart{
  height:42px !important;
  min-height:42px !important;
  font-size:13px !important;
}

@media (max-width: 1100px){
  .card.product-card-v68{min-height:410px !important;}
  .card.product-card-v68 .v68-image{height:198px !important;min-height:198px !important;}
}

@media (max-width: 700px){
  .card.product-card-v68{
    min-height:312px !important;
    border-radius:18px !important;
  }
  .card.product-card-v68 .v68-image{
    height:136px !important;
    min-height:136px !important;
  }
  .card.product-card-v68 .v68-top{
    left:10px !important;
    right:10px !important;
    top:10px !important;
  }
  .card.product-card-v68 .v68-brand,
  .card.product-card-v68 .v68-badges span{
    min-height:20px !important;
    padding:0 8px !important;
    font-size:8px !important;
  }
  .card.product-card-v68 .v68-badges{gap:4px !important;}
  .card.product-card-v68 .v68-body{
    padding:12px 10px 10px !important;
    gap:8px !important;
  }
  .card.product-card-v68 h3{
    font-size:14px !important;
    margin-bottom:4px !important;
  }
  .card.product-card-v68 p{
    font-size:10px !important;
    line-height:1.35 !important;
    min-height:28px !important;
  }
  .card.product-card-v68 .v68-chips{
    gap:4px !important;
    min-height:22px !important;
  }
  .card.product-card-v68 .v68-chips span{
    min-height:18px !important;
    padding:0 7px !important;
    font-size:8px !important;
  }
  .card.product-card-v68 .v68-footer{gap:8px !important;}
  .card.product-card-v68 .v68-status{
    font-size:10px !important;
  }
  .card.product-card-v68 .v68-pricebox b{
    font-size:16px !important;
  }
  .card.product-card-v68 .v68-actions{
    gap:6px !important;
  }
  .card.product-card-v68 .v68-more,
  .card.product-card-v68 .v68-cart{
    height:34px !important;
    min-height:34px !important;
    border-radius:10px !important;
    font-size:11px !important;
    padding:0 8px !important;
  }
}


/* V71: больше фото, меньше нижний текстовый блок */
#productGrid .card.product-card-v68,
#popularGrid .card.product-card-v68,
#categoryPopularGrid .card.product-card-v68,
.card.product-card-v68{
  min-height:470px !important;
}

/* фото теперь занимает заметно больше карточки */
.card.product-card-v68 .v68-image{
  height:300px !important;
  min-height:300px !important;
}

.card.product-card-v68 .v68-image img{
  filter:brightness(.98) contrast(1.02) saturate(1.04) !important;
}

/* низ затемняем только мягко, без ощущения большой плашки */
.card.product-card-v68 .v68-image::after{
  background:linear-gradient(
    180deg,
    rgba(4,8,16,.02) 0%,
    rgba(4,8,16,.04) 50%,
    rgba(4,8,16,.20) 100%
  ) !important;
}

/* сам блок с текстом стал компактнее */
.card.product-card-v68 .v68-body{
  padding:12px 14px 14px !important;
  gap:8px !important;
  background:linear-gradient(180deg,#0b1423 0%,#07111e 100%) !important;
  border-top:1px solid rgba(120,190,255,.12) !important;
}

.card.product-card-v68 h3{
  font-size:17px !important;
  line-height:1.08 !important;
  margin:0 0 5px !important;
}

.card.product-card-v68 p{
  font-size:12px !important;
  line-height:1.25 !important;
  min-height:30px !important;
  -webkit-line-clamp:2 !important;
}

.card.product-card-v68 .v68-chips{
  min-height:24px !important;
  gap:5px !important;
}

.card.product-card-v68 .v68-chips span{
  min-height:22px !important;
  padding:0 8px !important;
  font-size:9px !important;
}

/* статус/цена компактнее, но читабельно */
.card.product-card-v68 .v68-footer{
  gap:8px !important;
}

.card.product-card-v68 .v68-status{
  font-size:11px !important;
}

.card.product-card-v68 .v68-pricebox b{
  font-size:18px !important;
}

/* кнопки не лезут вверх, сидят ровно снизу */
.card.product-card-v68 .v68-more,
.card.product-card-v68 .v68-cart{
  height:40px !important;
  min-height:40px !important;
  border-radius:12px !important;
  font-size:13px !important;
}

/* плотность 4/6: тоже больше фото */
body.grid-density-4 .card.product-card-v68,
body.grid-density-6 .card.product-card-v68{
  min-height:440px !important;
}

body.grid-density-4 .card.product-card-v68 .v68-image,
body.grid-density-6 .card.product-card-v68 .v68-image{
  height:260px !important;
  min-height:260px !important;
}

body.grid-density-4 .card.product-card-v68 h3,
body.grid-density-6 .card.product-card-v68 h3{
  font-size:15px !important;
}

body.grid-density-4 .card.product-card-v68 p,
body.grid-density-6 .card.product-card-v68 p{
  font-size:11px !important;
  min-height:28px !important;
}

body.grid-density-4 .card.product-card-v68 .v68-more,
body.grid-density-4 .card.product-card-v68 .v68-cart,
body.grid-density-6 .card.product-card-v68 .v68-more,
body.grid-density-6 .card.product-card-v68 .v68-cart{
  height:36px !important;
  min-height:36px !important;
  font-size:12px !important;
}

@media (max-width: 1100px){
  .card.product-card-v68{
    min-height:430px !important;
  }

  .card.product-card-v68 .v68-image{
    height:245px !important;
    min-height:245px !important;
  }
}

@media (max-width:700px){
  .card.product-card-v68{
    min-height:300px !important;
  }

  .card.product-card-v68 .v68-image{
    height:155px !important;
    min-height:155px !important;
  }

  .card.product-card-v68 .v68-body{
    padding:9px 8px 8px !important;
    gap:5px !important;
  }

  .card.product-card-v68 h3{
    font-size:12px !important;
    margin-bottom:3px !important;
  }

  .card.product-card-v68 p{
    font-size:8.5px !important;
    line-height:1.22 !important;
    min-height:20px !important;
  }

  .card.product-card-v68 .v68-chips span{
    min-height:15px !important;
    padding:0 5px !important;
    font-size:6.7px !important;
  }

  .card.product-card-v68 .v68-status{
    font-size:7.5px !important;
  }

  .card.product-card-v68 .v68-pricebox b{
    font-size:12px !important;
  }

  .card.product-card-v68 .v68-more,
  .card.product-card-v68 .v68-cart{
    height:25px !important;
    min-height:25px !important;
    font-size:7.4px !important;
  }
}


/* ===== V72: density-safe product cards ===== */
.card.product-card-v72,
#productGrid .card.product-card-v72,
#popularGrid .card.product-card-v72,
#categoryPopularGrid .card.product-card-v72{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  padding:0 !important;
  overflow:hidden !important;
  min-height:430px !important;
  border-radius:24px !important;
  background:#0a1322 !important;
  border:1px solid rgba(115,190,255,.22) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08) !important;
  transform:none !important;
  cursor:pointer !important;
}

.card.product-card-v72::before,
.card.product-card-v72::after{
  display:none !important;
  content:none !important;
}

.card.product-card-v72 *{
  box-sizing:border-box !important;
}

.card.product-card-v72 .pc72-media{
  position:relative !important;
  width:100% !important;
  height:210px !important;
  min-height:210px !important;
  overflow:hidden !important;
  background:#111827 !important;
}

.card.product-card-v72 .pc72-media img{
  position:static !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
  opacity:1 !important;
  filter:brightness(.96) contrast(1.03) saturate(1.03) !important;
  transform:none !important;
}

.card.product-card-v72 .pc72-media::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:linear-gradient(180deg,rgba(4,8,16,.04) 0%,rgba(4,8,16,.10) 55%,rgba(4,8,16,.34) 100%) !important;
  pointer-events:none !important;
}

.card.product-card-v72 .pc72-hitbox{
  position:absolute !important;
  inset:0 !important;
  z-index:2 !important;
  border:0 !important;
  background:transparent !important;
  padding:0 !important;
  cursor:pointer !important;
}

.card.product-card-v72 .pc72-top{
  position:absolute !important;
  left:13px !important;
  right:13px !important;
  top:13px !important;
  z-index:3 !important;
  display:flex !important;
  justify-content:space-between !important;
  align-items:flex-start !important;
  gap:8px !important;
  pointer-events:none !important;
}

.card.product-card-v72 .pc72-brand,
.card.product-card-v72 .pc72-badges span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:24px !important;
  padding:0 9px !important;
  border-radius:999px !important;
  font-size:9px !important;
  line-height:1 !important;
  font-weight:900 !important;
  color:#fff !important;
  background:rgba(6,11,20,.68) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.20) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
  white-space:nowrap !important;
}

.card.product-card-v72 .pc72-badges{
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:flex-end !important;
  gap:6px !important;
}

.card.product-card-v72 .pc72-badges .is-stock{
  color:#7fffd0 !important;
  background:rgba(8,48,37,.72) !important;
  border-color:rgba(127,255,208,.28) !important;
}

.card.product-card-v72 .pc72-badges .is-order{
  color:#ffd79a !important;
  background:rgba(48,32,10,.72) !important;
  border-color:rgba(255,215,154,.24) !important;
}

.card.product-card-v72 .pc72-body{
  display:flex !important;
  flex-direction:column !important;
  flex:1 !important;
  gap:10px !important;
  padding:15px !important;
  background:linear-gradient(180deg,#0c1626 0%,#08111f 100%) !important;
  border-top:1px solid rgba(120,195,255,.14) !important;
}

.card.product-card-v72 .pc72-open{
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  text-align:left !important;
  border:0 !important;
  background:transparent !important;
  color:inherit !important;
  cursor:pointer !important;
}

.card.product-card-v72 h3{
  position:static !important;
  margin:0 0 7px !important;
  padding:0 !important;
  min-height:0 !important;
  color:#fff !important;
  font-size:18px !important;
  line-height:1.13 !important;
  letter-spacing:-.03em !important;
  font-weight:950 !important;
  text-shadow:none !important;
}

.card.product-card-v72 p{
  position:static !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
  margin:0 !important;
  padding:0 !important;
  min-height:34px !important;
  color:#d6dfef !important;
  font-size:13px !important;
  line-height:1.34 !important;
  font-weight:700 !important;
  opacity:1 !important;
  text-shadow:none !important;
}

.card.product-card-v72 .pc72-chips{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:6px !important;
  min-height:28px !important;
}

.card.product-card-v72 .pc72-chips span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:23px !important;
  padding:0 9px !important;
  border-radius:999px !important;
  color:#f3f7ff !important;
  background:rgba(255,255,255,.07) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  font-size:9.5px !important;
  line-height:1 !important;
  font-weight:850 !important;
  white-space:nowrap !important;
}

.card.product-card-v72 .pc72-footer{
  margin-top:auto !important;
  display:grid !important;
  gap:10px !important;
}

.card.product-card-v72 .pc72-price{
  display:flex !important;
  align-items:flex-end !important;
  justify-content:space-between !important;
  gap:10px !important;
}

.card.product-card-v72 .pc72-price span{
  color:#9fb0c7 !important;
  font-size:11px !important;
  line-height:1 !important;
  font-weight:900 !important;
}

.card.product-card-v72 .pc72-price span.is-green{
  color:#78ffca !important;
}

.card.product-card-v72 .pc72-price b{
  color:#63f6c4 !important;
  font-size:19px !important;
  line-height:1 !important;
  font-weight:1000 !important;
  letter-spacing:-.03em !important;
  white-space:nowrap !important;
}

.card.product-card-v72 .pc72-actions{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;
}

.card.product-card-v72 .pc72-more,
.card.product-card-v72 .pc72-cart{
  width:100% !important;
  height:40px !important;
  min-height:40px !important;
  border-radius:13px !important;
  font-size:13px !important;
  line-height:1 !important;
  font-weight:900 !important;
  cursor:pointer !important;
  white-space:nowrap !important;
}

.card.product-card-v72 .pc72-more{
  color:#fff !important;
  background:rgba(255,255,255,.035) !important;
  border:1px solid rgba(160,185,220,.24) !important;
}

.card.product-card-v72 .pc72-cart{
  color:#fff !important;
  background:linear-gradient(135deg,#4e9eff,#736cff) !important;
  border:1px solid rgba(160,190,255,.24) !important;
  box-shadow:0 10px 22px rgba(70,120,255,.17) !important;
}

/* 4 cards in row: compact without blank collapse */
body.grid-density-4 .card.product-card-v72{
  min-height:410px !important;
}
body.grid-density-4 .card.product-card-v72 .pc72-media{
  height:175px !important;
  min-height:175px !important;
}
body.grid-density-4 .card.product-card-v72 .pc72-body{
  padding:13px !important;
  gap:8px !important;
}
body.grid-density-4 .card.product-card-v72 h3{
  font-size:16px !important;
}
body.grid-density-4 .card.product-card-v72 p{
  font-size:11.5px !important;
  min-height:31px !important;
}
body.grid-density-4 .card.product-card-v72 .pc72-chips{
  gap:5px !important;
}
body.grid-density-4 .card.product-card-v72 .pc72-chips span{
  min-height:22px !important;
  padding:0 8px !important;
  font-size:8.5px !important;
}
body.grid-density-4 .card.product-card-v72 .pc72-more,
body.grid-density-4 .card.product-card-v72 .pc72-cart{
  height:38px !important;
  min-height:38px !important;
  font-size:12px !important;
}

/* 6 cards in row: no text/button collision */
body.grid-density-6 .card.product-card-v72{
  min-height:370px !important;
  border-radius:20px !important;
}
body.grid-density-6 .card.product-card-v72 .pc72-media{
  height:150px !important;
  min-height:150px !important;
}
body.grid-density-6 .card.product-card-v72 .pc72-body{
  padding:11px !important;
  gap:7px !important;
}
body.grid-density-6 .card.product-card-v72 .pc72-brand,
body.grid-density-6 .card.product-card-v72 .pc72-badges span{
  min-height:20px !important;
  padding:0 7px !important;
  font-size:7.5px !important;
}
body.grid-density-6 .card.product-card-v72 h3{
  font-size:14px !important;
  line-height:1.10 !important;
}
body.grid-density-6 .card.product-card-v72 p{
  display:none !important;
}
body.grid-density-6 .card.product-card-v72 .pc72-chips span:nth-child(n+3){
  display:none !important;
}
body.grid-density-6 .card.product-card-v72 .pc72-chips{
  min-height:24px !important;
}
body.grid-density-6 .card.product-card-v72 .pc72-chips span{
  min-height:20px !important;
  padding:0 7px !important;
  font-size:7.5px !important;
}
body.grid-density-6 .card.product-card-v72 .pc72-price{
  display:grid !important;
  gap:3px !important;
}
body.grid-density-6 .card.product-card-v72 .pc72-price span{
  font-size:9px !important;
}
body.grid-density-6 .card.product-card-v72 .pc72-price b{
  font-size:15px !important;
}
body.grid-density-6 .card.product-card-v72 .pc72-actions{
  grid-template-columns:1fr !important;
  gap:6px !important;
}
body.grid-density-6 .card.product-card-v72 .pc72-more,
body.grid-density-6 .card.product-card-v72 .pc72-cart{
  height:32px !important;
  min-height:32px !important;
  font-size:10.5px !important;
  border-radius:10px !important;
}

@media(max-width:700px){
  .card.product-card-v72{
    min-height:285px !important;
    border-radius:18px !important;
  }
  .card.product-card-v72 .pc72-media{
    height:126px !important;
    min-height:126px !important;
  }
  .card.product-card-v72 .pc72-top{
    left:8px !important;
    right:8px !important;
    top:8px !important;
  }
  .card.product-card-v72 .pc72-brand,
  .card.product-card-v72 .pc72-badges span{
    min-height:18px !important;
    padding:0 6px !important;
    font-size:7px !important;
  }
  .card.product-card-v72 .pc72-badges{gap:4px !important;}
  .card.product-card-v72 .pc72-body{
    padding:10px 8px 8px !important;
    gap:6px !important;
  }
  .card.product-card-v72 h3{
    font-size:12px !important;
    margin-bottom:3px !important;
  }
  .card.product-card-v72 p{
    font-size:8.5px !important;
    line-height:1.25 !important;
    min-height:20px !important;
  }
  .card.product-card-v72 .pc72-chips{
    gap:4px !important;
    min-height:18px !important;
  }
  .card.product-card-v72 .pc72-chips span{
    min-height:16px !important;
    padding:0 5px !important;
    font-size:6.8px !important;
  }
  .card.product-card-v72 .pc72-footer{gap:6px !important;}
  .card.product-card-v72 .pc72-price span{font-size:7.5px !important;}
  .card.product-card-v72 .pc72-price b{font-size:12px !important;}
  .card.product-card-v72 .pc72-actions{gap:5px !important;}
  .card.product-card-v72 .pc72-more,
  .card.product-card-v72 .pc72-cart{
    height:27px !important;
    min-height:27px !important;
    font-size:7.5px !important;
    border-radius:8px !important;
    padding:0 4px !important;
  }
}


/* ===== V73: photo-first card balance ===== */
.card.product-card-v72,
#productGrid .card.product-card-v72,
#popularGrid .card.product-card-v72,
#categoryPopularGrid .card.product-card-v72{
  min-height: 470px !important;
}
.card.product-card-v72 .pc72-media{
  height: 255px !important;
  min-height: 255px !important;
}
.card.product-card-v72 .pc72-body{
  padding: 12px 14px 14px !important;
  gap: 8px !important;
}
.card.product-card-v72 h3{
  font-size: 17px !important;
  margin-bottom: 5px !important;
}
.card.product-card-v72 p{
  font-size: 12px !important;
  line-height: 1.28 !important;
  min-height: 30px !important;
  -webkit-line-clamp: 2 !important;
}
.card.product-card-v72 .pc72-chips{min-height: 24px !important;}
.card.product-card-v72 .pc72-chips span{
  min-height: 22px !important;
  padding: 0 8px !important;
  font-size: 8.8px !important;
}
.card.product-card-v72 .pc72-price span{font-size: 10px !important;}
.card.product-card-v72 .pc72-price b{font-size: 18px !important;}
.card.product-card-v72 .pc72-more,
.card.product-card-v72 .pc72-cart{
  height: 38px !important;
  min-height: 38px !important;
  font-size: 12px !important;
}

/* 4 in a row: more photo, tighter HUD */
body.grid-density-4 .card.product-card-v72{
  min-height: 425px !important;
}
body.grid-density-4 .card.product-card-v72 .pc72-media{
  height: 235px !important;
  min-height: 235px !important;
}
body.grid-density-4 .card.product-card-v72 .pc72-body{
  padding: 11px 12px 12px !important;
  gap: 7px !important;
}
body.grid-density-4 .card.product-card-v72 h3{
  font-size: 15px !important;
  line-height: 1.1 !important;
  margin-bottom: 4px !important;
}
body.grid-density-4 .card.product-card-v72 p{
  font-size: 10.8px !important;
  line-height: 1.23 !important;
  min-height: 26px !important;
  -webkit-line-clamp: 2 !important;
}
body.grid-density-4 .card.product-card-v72 .pc72-chips span:nth-child(n+5){display:none !important;}
body.grid-density-4 .card.product-card-v72 .pc72-chips span{
  min-height: 20px !important;
  padding: 0 7px !important;
  font-size: 8px !important;
}
body.grid-density-4 .card.product-card-v72 .pc72-price span{font-size: 9px !important;}
body.grid-density-4 .card.product-card-v72 .pc72-price b{font-size: 16px !important;}
body.grid-density-4 .card.product-card-v72 .pc72-more,
body.grid-density-4 .card.product-card-v72 .pc72-cart{
  height: 36px !important;
  min-height: 36px !important;
  font-size: 11px !important;
}

/* 6 in a row: image should still dominate, info simplified */
body.grid-density-6 .card.product-card-v72{
  min-height: 360px !important;
}
body.grid-density-6 .card.product-card-v72 .pc72-media{
  height: 175px !important;
  min-height: 175px !important;
}
body.grid-density-6 .card.product-card-v72 .pc72-body{
  padding: 9px 10px 10px !important;
  gap: 6px !important;
}
body.grid-density-6 .card.product-card-v72 h3{
  font-size: 12px !important;
  line-height: 1.08 !important;
  margin-bottom: 3px !important;
}
body.grid-density-6 .card.product-card-v72 p{
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  overflow: hidden !important;
  font-size: 9px !important;
  line-height: 1.2 !important;
  min-height: 21px !important;
}
body.grid-density-6 .card.product-card-v72 .pc72-chips span:nth-child(n+3){display:none !important;}
body.grid-density-6 .card.product-card-v72 .pc72-chips span{
  min-height: 18px !important;
  padding: 0 6px !important;
  font-size: 7px !important;
}
body.grid-density-6 .card.product-card-v72 .pc72-price{
  align-items: center !important;
}
body.grid-density-6 .card.product-card-v72 .pc72-price span{font-size: 8px !important;}
body.grid-density-6 .card.product-card-v72 .pc72-price b{font-size: 13px !important;}
body.grid-density-6 .card.product-card-v72 .pc72-actions{
  grid-template-columns: 1fr !important;
  gap: 6px !important;
}
body.grid-density-6 .card.product-card-v72 .pc72-more,
body.grid-density-6 .card.product-card-v72 .pc72-cart{
  height: 31px !important;
  min-height: 31px !important;
  font-size: 10px !important;
  border-radius: 10px !important;
}

/* mobile still compact */
@media(max-width:700px){
  .card.product-card-v72{min-height: 290px !important;}
  .card.product-card-v72 .pc72-media{height: 132px !important; min-height: 132px !important;}
}


/* ===== V74: photo-first cards + mobile/filter fixes ===== */

/* User said search is not needed because categories already exist */
.hero .search,
.search{
  display:none !important;
}

/* Remove the extra trust strip block shown under hero */
.trust-strip{
  display:none !important;
}

/* Wider desktop layout so PC does not look too narrow */
.app{
  max-width:1480px !important;
}

/* Product card rebuilt around photo. HUD is compact and translucent, not a giant dark rectangle. */
.card.product-card-v74,
#productGrid .card.product-card-v74,
#popularGrid .card.product-card-v74,
#categoryPopularGrid .card.product-card-v74{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-end !important;
  min-height:430px !important;
  height:auto !important;
  padding:0 !important;
  overflow:hidden !important;
  border-radius:24px !important;
  background:#08111f !important;
  border:1px solid rgba(115,190,255,.24) !important;
  box-shadow:0 18px 44px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.08) !important;
  transform:none !important;
  cursor:pointer !important;
}

.card.product-card-v74::before,
.card.product-card-v74::after{
  display:none !important;
  content:none !important;
}

.card.product-card-v74 *{
  box-sizing:border-box !important;
}

.card.product-card-v74 .pc74-img{
  position:absolute !important;
  inset:0 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
  opacity:1 !important;
  filter:brightness(.88) contrast(1.04) saturate(1.04) !important;
  transform:none !important;
}

.card.product-card-v74 .pc74-shade{
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  background:
    linear-gradient(180deg,
      rgba(4,8,16,.04) 0%,
      rgba(4,8,16,.03) 32%,
      rgba(4,8,16,.18) 54%,
      rgba(4,8,16,.70) 74%,
      rgba(4,8,16,.92) 100%) !important;
  pointer-events:none !important;
}

.card.product-card-v74 .pc74-top{
  position:absolute !important;
  z-index:3 !important;
  left:13px !important;
  right:13px !important;
  top:13px !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:8px !important;
  pointer-events:none !important;
}

.card.product-card-v74 .pc74-brand,
.card.product-card-v74 .pc74-badges span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:24px !important;
  padding:0 9px !important;
  border-radius:999px !important;
  font-size:9px !important;
  line-height:1 !important;
  font-weight:900 !important;
  color:#fff !important;
  background:rgba(6,11,20,.64) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.18) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
  white-space:nowrap !important;
}

.card.product-card-v74 .pc74-badges{
  display:flex !important;
  justify-content:flex-end !important;
  flex-wrap:wrap !important;
  gap:6px !important;
}

.card.product-card-v74 .pc74-badges .is-stock{
  color:#7fffd0 !important;
  background:rgba(8,48,37,.70) !important;
  border-color:rgba(127,255,208,.28) !important;
}

.card.product-card-v74 .pc74-badges .is-order{
  color:#ffd79a !important;
  background:rgba(48,32,10,.70) !important;
  border-color:rgba(255,215,154,.24) !important;
}

/* Compact HUD on the image */
.card.product-card-v74 .pc74-body{
  position:relative !important;
  z-index:2 !important;
  margin:0 10px 10px !important;
  padding:13px !important;
  display:flex !important;
  flex-direction:column !important;
  gap:8px !important;
  border-radius:20px !important;
  background:rgba(6,12,22,.70) !important;
  border:1px solid rgba(155,190,235,.16) !important;
  box-shadow:0 14px 30px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.07) !important;
  backdrop-filter:blur(10px) !important;
  -webkit-backdrop-filter:blur(10px) !important;
}

.card.product-card-v74 .pc74-open{
  display:block !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  text-align:left !important;
  background:transparent !important;
  color:inherit !important;
  cursor:pointer !important;
}

.card.product-card-v74 h3{
  position:static !important;
  margin:0 0 5px !important;
  padding:0 !important;
  min-height:0 !important;
  color:#fff !important;
  font-size:18px !important;
  line-height:1.12 !important;
  letter-spacing:-.03em !important;
  font-weight:950 !important;
  text-shadow:0 2px 9px rgba(0,0,0,.48) !important;
}

.card.product-card-v74 p{
  position:static !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
  min-height:30px !important;
  margin:0 !important;
  padding:0 !important;
  color:#dce6f5 !important;
  font-size:12px !important;
  line-height:1.28 !important;
  font-weight:700 !important;
  opacity:1 !important;
  text-shadow:0 2px 8px rgba(0,0,0,.44) !important;
}

.card.product-card-v74 .pc74-chips{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:5px !important;
  min-height:24px !important;
}

.card.product-card-v74 .pc74-chips span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:22px !important;
  padding:0 8px !important;
  border-radius:999px !important;
  color:#f3f7ff !important;
  background:rgba(255,255,255,.08) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  font-size:8.8px !important;
  line-height:1 !important;
  font-weight:850 !important;
  white-space:nowrap !important;
}

.card.product-card-v74 .pc74-footer{
  display:grid !important;
  gap:8px !important;
}

.card.product-card-v74 .pc74-price{
  display:flex !important;
  align-items:flex-end !important;
  justify-content:space-between !important;
  gap:10px !important;
}

.card.product-card-v74 .pc74-price span{
  color:#9fb0c7 !important;
  font-size:10px !important;
  line-height:1 !important;
  font-weight:900 !important;
}

.card.product-card-v74 .pc74-price span.is-green{
  color:#78ffca !important;
}

.card.product-card-v74 .pc74-price b{
  color:#63f6c4 !important;
  font-size:18px !important;
  line-height:1 !important;
  font-weight:1000 !important;
  letter-spacing:-.03em !important;
  white-space:nowrap !important;
}

.card.product-card-v74 .pc74-actions{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;
}

.card.product-card-v74 .pc74-more,
.card.product-card-v74 .pc74-cart{
  width:100% !important;
  height:38px !important;
  min-height:38px !important;
  border-radius:12px !important;
  font-size:12px !important;
  line-height:1 !important;
  font-weight:900 !important;
  cursor:pointer !important;
  white-space:nowrap !important;
}

.card.product-card-v74 .pc74-more{
  color:#fff !important;
  background:rgba(255,255,255,.035) !important;
  border:1px solid rgba(160,185,220,.24) !important;
}

.card.product-card-v74 .pc74-cart{
  color:#fff !important;
  background:linear-gradient(135deg,#4e9eff,#736cff) !important;
  border:1px solid rgba(160,190,255,.24) !important;
  box-shadow:0 10px 22px rgba(70,120,255,.17) !important;
}

/* 4 in row */
body.grid-density-4 .card.product-card-v74{
  min-height:400px !important;
}
body.grid-density-4 .card.product-card-v74 .pc74-body{
  margin:0 9px 9px !important;
  padding:11px !important;
  gap:7px !important;
}
body.grid-density-4 .card.product-card-v74 h3{
  font-size:16px !important;
}
body.grid-density-4 .card.product-card-v74 p{
  font-size:10.8px !important;
  line-height:1.24 !important;
  min-height:25px !important;
}
body.grid-density-4 .card.product-card-v74 .pc74-chips span:nth-child(n+5){
  display:none !important;
}
body.grid-density-4 .card.product-card-v74 .pc74-chips span{
  min-height:20px !important;
  padding:0 7px !important;
  font-size:8px !important;
}
body.grid-density-4 .card.product-card-v74 .pc74-price span{
  font-size:9px !important;
}
body.grid-density-4 .card.product-card-v74 .pc74-price b{
  font-size:16px !important;
}
body.grid-density-4 .card.product-card-v74 .pc74-more,
body.grid-density-4 .card.product-card-v74 .pc74-cart{
  height:36px !important;
  min-height:36px !important;
  font-size:11px !important;
}

/* 6 in row */
body.grid-density-6 .card.product-card-v74{
  min-height:360px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-body{
  margin:0 7px 7px !important;
  padding:9px !important;
  gap:6px !important;
}
body.grid-density-6 .card.product-card-v74 h3{
  font-size:12px !important;
  line-height:1.08 !important;
  margin-bottom:3px !important;
}
body.grid-density-6 .card.product-card-v74 p{
  font-size:9px !important;
  line-height:1.18 !important;
  min-height:21px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-chips span:nth-child(n+3){
  display:none !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-chips span{
  min-height:18px !important;
  padding:0 6px !important;
  font-size:7px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-price{
  display:grid !important;
  gap:3px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-price span{
  font-size:8px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-price b{
  font-size:13px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-actions{
  grid-template-columns:1fr !important;
  gap:6px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-more,
body.grid-density-6 .card.product-card-v74 .pc74-cart{
  height:30px !important;
  min-height:30px !important;
  font-size:10px !important;
  border-radius:10px !important;
}

/* Mobile: keep image visible and stop button overflow */
@media(max-width:700px){
  .app{
    max-width:100% !important;
  }

  .card.product-card-v74{
    min-height:305px !important;
    border-radius:18px !important;
  }

  .card.product-card-v74 .pc74-top{
    left:8px !important;
    right:8px !important;
    top:8px !important;
  }

  .card.product-card-v74 .pc74-brand,
  .card.product-card-v74 .pc74-badges span{
    min-height:18px !important;
    padding:0 6px !important;
    font-size:7px !important;
  }

  .card.product-card-v74 .pc74-badges{
    gap:4px !important;
  }

  .card.product-card-v74 .pc74-body{
    margin:0 7px 7px !important;
    padding:9px 8px 8px !important;
    gap:6px !important;
    border-radius:15px !important;
  }

  .card.product-card-v74 h3{
    font-size:12px !important;
    margin-bottom:3px !important;
  }

  .card.product-card-v74 p{
    font-size:8.5px !important;
    line-height:1.22 !important;
    min-height:20px !important;
  }

  .card.product-card-v74 .pc74-chips{
    gap:4px !important;
    min-height:18px !important;
  }

  .card.product-card-v74 .pc74-chips span{
    min-height:16px !important;
    padding:0 5px !important;
    font-size:6.8px !important;
  }

  .card.product-card-v74 .pc74-footer{
    gap:6px !important;
  }

  .card.product-card-v74 .pc74-price span{
    font-size:7.5px !important;
  }

  .card.product-card-v74 .pc74-price b{
    font-size:12px !important;
  }

  .card.product-card-v74 .pc74-actions{
    gap:5px !important;
  }

  .card.product-card-v74 .pc74-more,
  .card.product-card-v74 .pc74-cart{
    height:27px !important;
    min-height:27px !important;
    border-radius:8px !important;
    font-size:7.5px !important;
    padding:0 4px !important;
  }
}


/* ===== V75: wider desktop layout ===== */
@media (min-width: 1100px){
  .app{
    width:min(96vw, 1760px) !important;
    max-width:1760px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  .topbar,
  .hero,
  .top-filter,
  .density-toolbar,
  .category-panel,
  .products-page,
  .trust-strip,
  .support,
  .category-popular{
    width:100% !important;
    max-width:none !important;
  }

  .hero{
    min-height:560px !important;
  }

  .hero-content{
    max-width:760px !important;
  }

  .grid,
  .product-grid,
  #popularGrid,
  #productGrid,
  #categoryPopularGrid{
    width:100% !important;
  }

  /* categories and products use the available width */
  .grid{
    grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  }

  body.grid-density-2 #productGrid,
  body.grid-density-2 #popularGrid,
  body.grid-density-2 #categoryPopularGrid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }

  body.grid-density-4 #productGrid,
  body.grid-density-4 #popularGrid,
  body.grid-density-4 #categoryPopularGrid{
    grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  }

  body.grid-density-6 #productGrid,
  body.grid-density-6 #popularGrid,
  body.grid-density-6 #categoryPopularGrid{
    grid-template-columns:repeat(6, minmax(0, 1fr)) !important;
  }
}

/* very wide monitors */
@media (min-width: 1600px){
  .app{
    width:min(94vw, 1900px) !important;
    max-width:1900px !important;
  }

  .hero{
    min-height:600px !important;
  }
}


/* ===== V76: wider adaptive desktop HUD/layout ===== */
@media (min-width: 1180px){
  .app{
    width:min(calc(100vw - 28px), 1960px) !important;
    max-width:1960px !important;
    padding-left:0 !important;
    padding-right:0 !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  .topbar,
  .hero,
  .trust-strip,
  .top-filter,
  .density-toolbar,
  .category-panel,
  .category-popular,
  .products-page,
  .support{
    width:100% !important;
    max-width:none !important;
  }

  .hero,
  .topbar,
  .trust-strip,
  .top-filter,
  .density-toolbar,
  .category-panel,
  .category-popular,
  .products-page,
  .support{
    margin-left:0 !important;
    margin-right:0 !important;
  }

  .hero{
    min-height:clamp(540px, 46vw, 680px) !important;
  }

  .hero-content{
    max-width:min(44%, 840px) !important;
    padding-left:28px !important;
  }

  .category-panel,
  .category-popular,
  .products-page{
    padding-left:18px !important;
    padding-right:18px !important;
  }

  .grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  }

  body.grid-density-2 #productGrid,
  body.grid-density-2 #popularGrid,
  body.grid-density-2 #categoryPopularGrid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  body.grid-density-4 #productGrid,
  body.grid-density-4 #popularGrid,
  body.grid-density-4 #categoryPopularGrid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  }

  body.grid-density-6 #productGrid,
  body.grid-density-6 #popularGrid,
  body.grid-density-6 #categoryPopularGrid{
    grid-template-columns:repeat(6,minmax(0,1fr)) !important;
  }
}

@media (min-width: 1450px){
  .app{
    width:min(calc(100vw - 32px), 2100px) !important;
    max-width:2100px !important;
  }

  .hero-content{
    max-width:min(42%, 900px) !important;
  }
}

@media (min-width: 1700px){
  .app{
    width:min(calc(100vw - 40px), 2300px) !important;
    max-width:2300px !important;
  }

  .hero{
    min-height:700px !important;
  }
}


/* ===== V77: product cards — less HUD, more photo ===== */
.card.product-card-v74,
#productGrid .card.product-card-v74,
#popularGrid .card.product-card-v74,
#categoryPopularGrid .card.product-card-v74{
  display:block !important;
  min-height:500px !important;
  padding:0 !important;
}

.card.product-card-v74 .pc74-img{
  object-fit:cover !important;
  object-position:center 36% !important;
  filter:brightness(.95) contrast(1.03) saturate(1.03) !important;
}

.card.product-card-v74 .pc74-shade{
  background:
    linear-gradient(180deg,
      rgba(4,8,16,.02) 0%,
      rgba(4,8,16,.00) 38%,
      rgba(4,8,16,.10) 58%,
      rgba(4,8,16,.28) 70%,
      rgba(4,8,16,.52) 100%) !important;
}

.card.product-card-v74 .pc74-body{
  position:relative !important;
  z-index:2 !important;
  margin:250px 10px 10px !important;
  padding:12px !important;
  gap:7px !important;
  border-radius:18px !important;
  background:linear-gradient(180deg, rgba(5,10,18,.92) 0%, rgba(4,9,16,.975) 100%) !important;
  border:1px solid rgba(126,166,220,.15) !important;
  box-shadow:0 10px 24px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.05) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

.card.product-card-v74 h3{
  font-size:17px !important;
  line-height:1.08 !important;
  margin:0 0 4px !important;
}

.card.product-card-v74 p{
  min-height:0 !important;
  font-size:11.5px !important;
  line-height:1.28 !important;
}

.card.product-card-v74 .pc74-chips{
  gap:6px !important;
}

.card.product-card-v74 .pc74-chips span{
  min-height:22px !important;
  padding:0 8px !important;
  font-size:9px !important;
}

.card.product-card-v74 .pc74-footer{
  gap:7px !important;
}

.card.product-card-v74 .pc74-price span{
  font-size:10px !important;
}

.card.product-card-v74 .pc74-price b{
  font-size:17px !important;
}

.card.product-card-v74 .pc74-more,
.card.product-card-v74 .pc74-cart{
  height:36px !important;
  min-height:36px !important;
  border-radius:12px !important;
  font-size:11.5px !important;
}

/* 2 cards row */
body.grid-density-2 .card.product-card-v74{
  min-height:520px !important;
}
body.grid-density-2 .card.product-card-v74 .pc74-body{
  margin:278px 12px 12px !important;
  padding:14px !important;
}
body.grid-density-2 .card.product-card-v74 h3{
  font-size:20px !important;
}
body.grid-density-2 .card.product-card-v74 p{
  font-size:13px !important;
  -webkit-line-clamp:2 !important;
}
body.grid-density-2 .card.product-card-v74 .pc74-chips span{
  font-size:10px !important;
  min-height:24px !important;
}
body.grid-density-2 .card.product-card-v74 .pc74-price b{
  font-size:18px !important;
}
body.grid-density-2 .card.product-card-v74 .pc74-more,
body.grid-density-2 .card.product-card-v74 .pc74-cart{
  height:40px !important;
  min-height:40px !important;
  font-size:12px !important;
}

/* 4 cards row */
body.grid-density-4 .card.product-card-v74{
  min-height:445px !important;
}
body.grid-density-4 .card.product-card-v74 .pc74-body{
  margin:220px 9px 9px !important;
  padding:11px !important;
}
body.grid-density-4 .card.product-card-v74 h3{
  font-size:16px !important;
}
body.grid-density-4 .card.product-card-v74 p{
  font-size:11px !important;
  min-height:0 !important;
}
body.grid-density-4 .card.product-card-v74 .pc74-chips span:nth-child(n+5){
  display:none !important;
}
body.grid-density-4 .card.product-card-v74 .pc74-chips span{
  font-size:8.5px !important;
}
body.grid-density-4 .card.product-card-v74 .pc74-price b{
  font-size:16px !important;
}

/* 6 cards row */
body.grid-density-6 .card.product-card-v74{
  min-height:350px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-img{
  object-position:center 32% !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-body{
  margin:145px 7px 7px !important;
  padding:8px !important;
  gap:5px !important;
}
body.grid-density-6 .card.product-card-v74 h3{
  font-size:12px !important;
  line-height:1.06 !important;
}
body.grid-density-6 .card.product-card-v74 p{
  display:none !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-chips{
  gap:4px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-chips span:nth-child(n+4){
  display:none !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-chips span{
  min-height:18px !important;
  padding:0 6px !important;
  font-size:7px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-price span{
  font-size:8px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-price b{
  font-size:12px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-actions{
  grid-template-columns:1fr !important;
  gap:5px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-more,
body.grid-density-6 .card.product-card-v74 .pc74-cart{
  height:28px !important;
  min-height:28px !important;
  font-size:9.5px !important;
}

/* Mobile fallback — keep more image visible and do not let HUD dominate */
@media (max-width: 700px){
  .card.product-card-v74{
    min-height:300px !important;
  }
  .card.product-card-v74 .pc74-top{
    left:8px !important;
    right:8px !important;
    top:8px !important;
  }
  .card.product-card-v74 .pc74-body{
    margin:145px 7px 7px !important;
    padding:8px !important;
    gap:5px !important;
    border-radius:14px !important;
  }
  .card.product-card-v74 h3{
    font-size:12px !important;
  }
  .card.product-card-v74 p{
    font-size:8.8px !important;
    display:-webkit-box !important;
    -webkit-line-clamp:2 !important;
  }
  .card.product-card-v74 .pc74-chips span:nth-child(n+4){
    display:none !important;
  }
  .card.product-card-v74 .pc74-chips span{
    min-height:16px !important;
    padding:0 5px !important;
    font-size:6.8px !important;
  }
  .card.product-card-v74 .pc74-price span{
    font-size:7.5px !important;
  }
  .card.product-card-v74 .pc74-price b{
    font-size:12px !important;
  }
  .card.product-card-v74 .pc74-actions{
    gap:5px !important;
  }
  .card.product-card-v74 .pc74-more,
  .card.product-card-v74 .pc74-cart{
    height:28px !important;
    min-height:28px !important;
    font-size:7.6px !important;
    padding:0 4px !important;
  }
}


/* ===== V78: vertical product cards instead of wide horizontal cards ===== */
#productGrid,
#popularGrid,
#categoryPopularGrid{
  align-items:start !important;
  justify-items:stretch !important;
}

/* Density presets */
body.grid-density-2 #productGrid,
body.grid-density-2 #popularGrid,
body.grid-density-2 #categoryPopularGrid{
  grid-template-columns:repeat(2, minmax(360px, 1fr)) !important;
  gap:20px !important;
}

body.grid-density-4 #productGrid,
body.grid-density-4 #popularGrid,
body.grid-density-4 #categoryPopularGrid{
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:18px !important;
}

body.grid-density-6 #productGrid,
body.grid-density-6 #popularGrid,
body.grid-density-6 #categoryPopularGrid{
  grid-template-columns:repeat(6, minmax(0, 1fr)) !important;
  gap:14px !important;
}

/* Base vertical card */
.card.product-card-v74,
#productGrid .card.product-card-v74,
#popularGrid .card.product-card-v74,
#categoryPopularGrid .card.product-card-v74{
  width:100% !important;
  min-height:520px !important;
  height:520px !important;
  max-height:none !important;
  border-radius:22px !important;
  overflow:hidden !important;
}

.card.product-card-v74 .pc74-img{
  object-fit:cover !important;
  object-position:center 34% !important;
}

.card.product-card-v74 .pc74-top{
  left:10px !important;
  right:10px !important;
  top:10px !important;
}

.card.product-card-v74 .pc74-brand,
.card.product-card-v74 .pc74-badge{
  min-height:24px !important;
  font-size:10px !important;
  padding:0 10px !important;
}

.card.product-card-v74 .pc74-body{
  position:relative !important;
  margin:318px 10px 10px !important;
  padding:12px !important;
  gap:7px !important;
  border-radius:18px !important;
  background:linear-gradient(180deg, rgba(5,10,18,.90) 0%, rgba(4,9,16,.97) 100%) !important;
  border:1px solid rgba(126,166,220,.16) !important;
  box-shadow:0 10px 24px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.05) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
}

.card.product-card-v74 h3{
  font-size:18px !important;
  line-height:1.08 !important;
  margin:0 0 4px !important;
}

.card.product-card-v74 p{
  font-size:12px !important;
  line-height:1.28 !important;
  min-height:30px !important;
  -webkit-line-clamp:2 !important;
}

.card.product-card-v74 .pc74-chips{
  gap:6px !important;
}

.card.product-card-v74 .pc74-chips span{
  min-height:22px !important;
  padding:0 8px !important;
  font-size:9px !important;
}

.card.product-card-v74 .pc74-footer{
  gap:8px !important;
}

.card.product-card-v74 .pc74-price span{
  font-size:10px !important;
}
.card.product-card-v74 .pc74-price b{
  font-size:18px !important;
}

.card.product-card-v74 .pc74-actions{
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;
}

.card.product-card-v74 .pc74-more,
.card.product-card-v74 .pc74-cart{
  height:38px !important;
  min-height:38px !important;
  border-radius:12px !important;
  font-size:12px !important;
}

/* 2 in row: clearly vertical, big photo */
body.grid-density-2 .card.product-card-v74{
  min-height:540px !important;
  height:540px !important;
}
body.grid-density-2 .card.product-card-v74 .pc74-body{
  margin:330px 12px 12px !important;
  padding:14px !important;
}
body.grid-density-2 .card.product-card-v74 h3{
  font-size:19px !important;
}
body.grid-density-2 .card.product-card-v74 p{
  font-size:13px !important;
}
body.grid-density-2 .card.product-card-v74 .pc74-price b{
  font-size:19px !important;
}

/* 4 in row: portrait layout */
body.grid-density-4 .card.product-card-v74{
  min-height:470px !important;
  height:470px !important;
}
body.grid-density-4 .card.product-card-v74 .pc74-body{
  margin:275px 10px 10px !important;
  padding:11px !important;
}
body.grid-density-4 .card.product-card-v74 h3{
  font-size:17px !important;
}
body.grid-density-4 .card.product-card-v74 p{
  font-size:11.5px !important;
}
body.grid-density-4 .card.product-card-v74 .pc74-chips span:nth-child(n+5){
  display:none !important;
}
body.grid-density-4 .card.product-card-v74 .pc74-price b{
  font-size:17px !important;
}
body.grid-density-4 .card.product-card-v74 .pc74-more,
body.grid-density-4 .card.product-card-v74 .pc74-cart{
  height:36px !important;
  min-height:36px !important;
}

/* 6 in row: still vertical, lighter content */
body.grid-density-6 .card.product-card-v74{
  min-height:380px !important;
  height:380px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-img{
  object-position:center 30% !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-top{
  left:8px !important;
  right:8px !important;
  top:8px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-brand,
body.grid-density-6 .card.product-card-v74 .pc74-badge{
  min-height:20px !important;
  font-size:8px !important;
  padding:0 8px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-body{
  margin:205px 8px 8px !important;
  padding:8px !important;
  gap:5px !important;
  border-radius:14px !important;
}
body.grid-density-6 .card.product-card-v74 h3{
  font-size:13px !important;
  line-height:1.06 !important;
}
body.grid-density-6 .card.product-card-v74 p{
  display:none !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-chips{
  gap:4px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-chips span:nth-child(n+4){
  display:none !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-chips span{
  min-height:18px !important;
  padding:0 6px !important;
  font-size:7px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-price span{
  font-size:8px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-price b{
  font-size:13px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-actions{
  grid-template-columns:1fr !important;
  gap:5px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-more,
body.grid-density-6 .card.product-card-v74 .pc74-cart{
  height:30px !important;
  min-height:30px !important;
  font-size:10px !important;
}

/* Keep tablet/mobile safe */
@media (max-width: 1180px){
  body.grid-density-2 #productGrid,
  body.grid-density-2 #popularGrid,
  body.grid-density-2 #categoryPopularGrid{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }
}

@media (max-width: 700px){
  .card.product-card-v74,
  body.grid-density-2 .card.product-card-v74,
  body.grid-density-4 .card.product-card-v74,
  body.grid-density-6 .card.product-card-v74{
    min-height:300px !important;
    height:300px !important;
  }
  .card.product-card-v74 .pc74-body,
  body.grid-density-2 .card.product-card-v74 .pc74-body,
  body.grid-density-4 .card.product-card-v74 .pc74-body,
  body.grid-density-6 .card.product-card-v74 .pc74-body{
    margin:145px 7px 7px !important;
    padding:8px !important;
    gap:5px !important;
  }
  .card.product-card-v74 h3{
    font-size:12px !important;
  }
  .card.product-card-v74 p{
    display:-webkit-box !important;
    font-size:8.8px !important;
  }
  .card.product-card-v74 .pc74-chips span:nth-child(n+4){
    display:none !important;
  }
  .card.product-card-v74 .pc74-actions{
    grid-template-columns:1fr 1fr !important;
    gap:5px !important;
  }
  .card.product-card-v74 .pc74-more,
  .card.product-card-v74 .pc74-cart{
    height:28px !important;
    min-height:28px !important;
    font-size:7.6px !important;
  }
}


/* ===== V79: fixed-width vertical product cards ===== */
/* Главная причина горизонтальности была в том, что карточки растягивались на всю ширину ячейки.
   Теперь сетка даёт карточкам ограниченную ширину, а не растягивает их как баннеры. */

#productGrid,
#popularGrid,
#categoryPopularGrid{
  justify-content:start !important;
  align-items:start !important;
}

/* 2 в ряд: две нормальные вертикальные карточки, не два широких баннера */
body.grid-density-2 #productGrid,
body.grid-density-2 #popularGrid,
body.grid-density-2 #categoryPopularGrid{
  grid-template-columns:repeat(2, minmax(320px, 420px)) !important;
  gap:22px !important;
}

/* 4 в ряд: классический каталог */
body.grid-density-4 #productGrid,
body.grid-density-4 #popularGrid,
body.grid-density-4 #categoryPopularGrid{
  grid-template-columns:repeat(4, minmax(230px, 310px)) !important;
  gap:18px !important;
}

/* 6 в ряд: компактная вертикальная карточка */
body.grid-density-6 #productGrid,
body.grid-density-6 #popularGrid,
body.grid-density-6 #categoryPopularGrid{
  grid-template-columns:repeat(6, minmax(160px, 230px)) !important;
  gap:14px !important;
}

/* Base: карточка больше не становится горизонтальным баннером */
.card.product-card-v74,
#productGrid .card.product-card-v74,
#popularGrid .card.product-card-v74,
#categoryPopularGrid .card.product-card-v74{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  aspect-ratio:auto !important;
  height:520px !important;
  min-height:520px !important;
  max-height:520px !important;
}

/* Визуально делаем её именно карточкой: фото сверху, HUD ниже, но не огромный */
.card.product-card-v74 .pc74-img{
  object-fit:cover !important;
  object-position:center 35% !important;
}

.card.product-card-v74 .pc74-shade{
  background:
    linear-gradient(180deg,
      rgba(4,8,16,.02) 0%,
      rgba(4,8,16,.02) 44%,
      rgba(4,8,16,.16) 61%,
      rgba(4,8,16,.55) 77%,
      rgba(4,8,16,.88) 100%) !important;
}

.card.product-card-v74 .pc74-body{
  margin:300px 10px 10px !important;
  padding:12px !important;
  gap:7px !important;
  border-radius:18px !important;
  background:rgba(6,12,22,.78) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
}

.card.product-card-v74 h3{
  font-size:18px !important;
  line-height:1.08 !important;
  margin-bottom:4px !important;
}

.card.product-card-v74 p{
  font-size:12px !important;
  line-height:1.25 !important;
  min-height:30px !important;
  -webkit-line-clamp:2 !important;
}

.card.product-card-v74 .pc74-chips{
  gap:5px !important;
}

.card.product-card-v74 .pc74-chips span{
  min-height:21px !important;
  padding:0 8px !important;
  font-size:8.5px !important;
}

.card.product-card-v74 .pc74-price b{
  font-size:18px !important;
}

.card.product-card-v74 .pc74-actions{
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;
}

.card.product-card-v74 .pc74-more,
.card.product-card-v74 .pc74-cart{
  height:36px !important;
  min-height:36px !important;
  border-radius:12px !important;
  font-size:11.5px !important;
}

/* 2 cards */
body.grid-density-2 .card.product-card-v74{
  height:540px !important;
  min-height:540px !important;
  max-height:540px !important;
}
body.grid-density-2 .card.product-card-v74 .pc74-body{
  margin-top:315px !important;
}
body.grid-density-2 .card.product-card-v74 h3{
  font-size:20px !important;
}
body.grid-density-2 .card.product-card-v74 p{
  font-size:13px !important;
}

/* 4 cards */
body.grid-density-4 .card.product-card-v74{
  height:470px !important;
  min-height:470px !important;
  max-height:470px !important;
}
body.grid-density-4 .card.product-card-v74 .pc74-body{
  margin:265px 9px 9px !important;
  padding:10px !important;
}
body.grid-density-4 .card.product-card-v74 h3{
  font-size:16px !important;
}
body.grid-density-4 .card.product-card-v74 p{
  font-size:10.5px !important;
  min-height:26px !important;
}
body.grid-density-4 .card.product-card-v74 .pc74-chips span:nth-child(n+4){
  display:none !important;
}
body.grid-density-4 .card.product-card-v74 .pc74-price b{
  font-size:16px !important;
}

/* 6 cards */
body.grid-density-6 .card.product-card-v74{
  height:390px !important;
  min-height:390px !important;
  max-height:390px !important;
  border-radius:18px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-top{
  left:7px !important;
  right:7px !important;
  top:7px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-brand,
body.grid-density-6 .card.product-card-v74 .pc74-badges span{
  min-height:18px !important;
  padding:0 6px !important;
  font-size:7px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-body{
  margin:215px 7px 7px !important;
  padding:8px !important;
  gap:5px !important;
  border-radius:13px !important;
}
body.grid-density-6 .card.product-card-v74 h3{
  font-size:12px !important;
  line-height:1.06 !important;
}
body.grid-density-6 .card.product-card-v74 p{
  display:none !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-chips span:nth-child(n+3){
  display:none !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-chips span{
  min-height:17px !important;
  padding:0 5px !important;
  font-size:6.8px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-price{
  display:grid !important;
  gap:2px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-price span{
  font-size:7.5px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-price b{
  font-size:12px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-actions{
  grid-template-columns:1fr !important;
  gap:5px !important;
}
body.grid-density-6 .card.product-card-v74 .pc74-more,
body.grid-density-6 .card.product-card-v74 .pc74-cart{
  height:28px !important;
  min-height:28px !important;
  font-size:9px !important;
}

/* Smaller desktops/tablets: don't overflow */
@media(max-width:1180px){
  body.grid-density-2 #productGrid,
  body.grid-density-2 #popularGrid,
  body.grid-density-2 #categoryPopularGrid,
  body.grid-density-4 #productGrid,
  body.grid-density-4 #popularGrid,
  body.grid-density-4 #categoryPopularGrid{
    grid-template-columns:repeat(2, minmax(260px, 1fr)) !important;
  }

  body.grid-density-6 #productGrid,
  body.grid-density-6 #popularGrid,
  body.grid-density-6 #categoryPopularGrid{
    grid-template-columns:repeat(4, minmax(170px, 1fr)) !important;
  }
}

/* Phones */
@media(max-width:700px){
  body.grid-density-2 #productGrid,
  body.grid-density-2 #popularGrid,
  body.grid-density-2 #categoryPopularGrid,
  body.grid-density-4 #productGrid,
  body.grid-density-4 #popularGrid,
  body.grid-density-4 #categoryPopularGrid,
  body.grid-density-6 #productGrid,
  body.grid-density-6 #popularGrid,
  body.grid-density-6 #categoryPopularGrid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:12px !important;
  }

  .card.product-card-v74,
  body.grid-density-2 .card.product-card-v74,
  body.grid-density-4 .card.product-card-v74,
  body.grid-density-6 .card.product-card-v74{
    height:300px !important;
    min-height:300px !important;
    max-height:300px !important;
  }

  .card.product-card-v74 .pc74-body,
  body.grid-density-2 .card.product-card-v74 .pc74-body,
  body.grid-density-4 .card.product-card-v74 .pc74-body,
  body.grid-density-6 .card.product-card-v74 .pc74-body{
    margin:145px 7px 7px !important;
    padding:8px !important;
    gap:5px !important;
  }

  .card.product-card-v74 h3{
    font-size:12px !important;
  }

  .card.product-card-v74 p{
    display:-webkit-box !important;
    font-size:8px !important;
    min-height:18px !important;
  }

  .card.product-card-v74 .pc74-chips span:nth-child(n+3){
    display:none !important;
  }

  .card.product-card-v74 .pc74-actions{
    grid-template-columns:1fr 1fr !important;
  }

  .card.product-card-v74 .pc74-more,
  .card.product-card-v74 .pc74-cart{
    height:26px !important;
    min-height:26px !important;
    font-size:7px !important;
  }
}


/* ===== V80: separate photo + separate info block, fixed vertical cards ===== */

/* Force product grids to stop making banner-wide cards */
#productGrid,
#popularGrid,
#categoryPopularGrid{
  display:grid !important;
  justify-content:start !important;
  align-items:start !important;
}

/* 2 / 4 / 6 are now fixed vertical card columns, not stretched banners */
body.grid-density-2 #productGrid,
body.grid-density-2 #popularGrid,
body.grid-density-2 #categoryPopularGrid{
  grid-template-columns:repeat(2, 380px) !important;
  gap:22px !important;
}

body.grid-density-4 #productGrid,
body.grid-density-4 #popularGrid,
body.grid-density-4 #categoryPopularGrid{
  grid-template-columns:repeat(4, 285px) !important;
  gap:18px !important;
}

body.grid-density-6 #productGrid,
body.grid-density-6 #popularGrid,
body.grid-density-6 #categoryPopularGrid{
  grid-template-columns:repeat(6, 205px) !important;
  gap:14px !important;
}

/* Completely new card class, old card rules no longer affect layout */
.card.product-card-v80,
#productGrid .card.product-card-v80,
#popularGrid .card.product-card-v80,
#categoryPopularGrid .card.product-card-v80{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  padding:0 !important;
  overflow:hidden !important;
  border-radius:24px !important;
  background:#0a1322 !important;
  border:1px solid rgba(120,190,255,.22) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08) !important;
  transform:none !important;
  cursor:pointer !important;
}

.card.product-card-v80::before,
.card.product-card-v80::after{
  display:none !important;
  content:none !important;
}

.card.product-card-v80 *{
  box-sizing:border-box !important;
}

/* Separate photo area */
.card.product-card-v80 .pc80-photo{
  position:relative !important;
  width:100% !important;
  aspect-ratio:1 / 1.08 !important;
  min-height:0 !important;
  overflow:hidden !important;
  background:#111827 !important;
  cursor:pointer !important;
}

.card.product-card-v80 .pc80-photo img{
  position:static !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center !important;
  opacity:1 !important;
  filter:brightness(.96) contrast(1.03) saturate(1.03) !important;
  transform:none !important;
}

.card.product-card-v80 .pc80-photo::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:linear-gradient(180deg,rgba(5,9,18,.05) 0%,rgba(5,9,18,.08) 55%,rgba(5,9,18,.28) 100%) !important;
  pointer-events:none !important;
}

.card.product-card-v80 .pc80-badge-row{
  position:absolute !important;
  left:12px !important;
  right:12px !important;
  top:12px !important;
  z-index:2 !important;
  display:flex !important;
  justify-content:space-between !important;
  align-items:flex-start !important;
  gap:8px !important;
  pointer-events:none !important;
}

.card.product-card-v80 .pc80-brand,
.card.product-card-v80 .pc80-badges span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:24px !important;
  padding:0 9px !important;
  border-radius:999px !important;
  font-size:9px !important;
  line-height:1 !important;
  font-weight:900 !important;
  color:#fff !important;
  background:rgba(7,12,22,.68) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  box-shadow:0 8px 18px rgba(0,0,0,.18) !important;
  white-space:nowrap !important;
}

.card.product-card-v80 .pc80-badges{
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:flex-end !important;
  gap:6px !important;
}

.card.product-card-v80 .pc80-badges .is-stock{
  color:#7fffd0 !important;
  background:rgba(8,48,37,.72) !important;
  border-color:rgba(127,255,208,.28) !important;
}

.card.product-card-v80 .pc80-badges .is-order{
  color:#ffd79a !important;
  background:rgba(48,32,10,.72) !important;
  border-color:rgba(255,215,154,.24) !important;
}

/* Separate info/HUD area below image */
.card.product-card-v80 .pc80-info{
  display:flex !important;
  flex-direction:column !important;
  gap:10px !important;
  flex:1 !important;
  padding:15px !important;
  background:linear-gradient(180deg,#0c1626 0%,#08111f 100%) !important;
  border-top:1px solid rgba(120,195,255,.14) !important;
}

.card.product-card-v80 .pc80-title{
  display:block !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  text-align:left !important;
  background:transparent !important;
  color:inherit !important;
  cursor:pointer !important;
}

.card.product-card-v80 h3{
  position:static !important;
  margin:0 0 7px !important;
  padding:0 !important;
  min-height:0 !important;
  color:#fff !important;
  font-size:18px !important;
  line-height:1.12 !important;
  letter-spacing:-.03em !important;
  font-weight:950 !important;
  text-shadow:none !important;
}

.card.product-card-v80 p{
  position:static !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
  min-height:34px !important;
  margin:0 !important;
  padding:0 !important;
  color:#d6dfef !important;
  font-size:13px !important;
  line-height:1.34 !important;
  font-weight:700 !important;
  opacity:1 !important;
  text-shadow:none !important;
}

.card.product-card-v80 .pc80-chips{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:6px !important;
  min-height:28px !important;
}

.card.product-card-v80 .pc80-chips span{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:23px !important;
  padding:0 9px !important;
  border-radius:999px !important;
  color:#f3f7ff !important;
  background:rgba(255,255,255,.07) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  font-size:9.5px !important;
  line-height:1 !important;
  font-weight:850 !important;
  white-space:nowrap !important;
}

.card.product-card-v80 .pc80-bottom{
  margin-top:auto !important;
  display:grid !important;
  gap:10px !important;
}

.card.product-card-v80 .pc80-price{
  display:flex !important;
  align-items:flex-end !important;
  justify-content:space-between !important;
  gap:10px !important;
}

.card.product-card-v80 .pc80-price span{
  color:#9fb0c7 !important;
  font-size:11px !important;
  line-height:1 !important;
  font-weight:900 !important;
}

.card.product-card-v80 .pc80-price span.is-green{
  color:#78ffca !important;
}

.card.product-card-v80 .pc80-price b{
  color:#63f6c4 !important;
  font-size:19px !important;
  line-height:1 !important;
  font-weight:1000 !important;
  letter-spacing:-.03em !important;
  white-space:nowrap !important;
}

.card.product-card-v80 .pc80-actions{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;
}

.card.product-card-v80 .pc80-more,
.card.product-card-v80 .pc80-cart{
  width:100% !important;
  height:40px !important;
  min-height:40px !important;
  border-radius:13px !important;
  font-size:13px !important;
  line-height:1 !important;
  font-weight:900 !important;
  cursor:pointer !important;
  white-space:nowrap !important;
}

.card.product-card-v80 .pc80-more{
  color:#fff !important;
  background:rgba(255,255,255,.035) !important;
  border:1px solid rgba(160,185,220,.24) !important;
}

.card.product-card-v80 .pc80-cart{
  color:#fff !important;
  background:linear-gradient(135deg,#4e9eff,#736cff) !important;
  border:1px solid rgba(160,190,255,.24) !important;
  box-shadow:0 10px 22px rgba(70,120,255,.17) !important;
}

/* 2 cards */
body.grid-density-2 .card.product-card-v80 .pc80-photo{
  aspect-ratio:1 / .92 !important;
}

body.grid-density-2 .card.product-card-v80 h3{
  font-size:19px !important;
}

body.grid-density-2 .card.product-card-v80 p{
  font-size:13px !important;
}

/* 4 cards */
body.grid-density-4 .card.product-card-v80 .pc80-info{
  padding:13px !important;
  gap:8px !important;
}

body.grid-density-4 .card.product-card-v80 h3{
  font-size:16px !important;
}

body.grid-density-4 .card.product-card-v80 p{
  font-size:11.5px !important;
  min-height:31px !important;
}

body.grid-density-4 .card.product-card-v80 .pc80-chips span:nth-child(n+4){
  display:none !important;
}

body.grid-density-4 .card.product-card-v80 .pc80-price b{
  font-size:16px !important;
}

body.grid-density-4 .card.product-card-v80 .pc80-more,
body.grid-density-4 .card.product-card-v80 .pc80-cart{
  height:36px !important;
  min-height:36px !important;
  font-size:11px !important;
}

/* 6 cards */
body.grid-density-6 .card.product-card-v80{
  border-radius:18px !important;
}

body.grid-density-6 .card.product-card-v80 .pc80-photo{
  aspect-ratio:1 / 1.05 !important;
}

body.grid-density-6 .card.product-card-v80 .pc80-info{
  padding:10px !important;
  gap:6px !important;
}

body.grid-density-6 .card.product-card-v80 .pc80-brand,
body.grid-density-6 .card.product-card-v80 .pc80-badges span{
  min-height:18px !important;
  padding:0 6px !important;
  font-size:7px !important;
}

body.grid-density-6 .card.product-card-v80 h3{
  font-size:12px !important;
  line-height:1.08 !important;
}

body.grid-density-6 .card.product-card-v80 p{
  display:none !important;
}

body.grid-density-6 .card.product-card-v80 .pc80-chips span:nth-child(n+3){
  display:none !important;
}

body.grid-density-6 .card.product-card-v80 .pc80-chips span{
  min-height:18px !important;
  padding:0 6px !important;
  font-size:7px !important;
}

body.grid-density-6 .card.product-card-v80 .pc80-price{
  display:grid !important;
  gap:3px !important;
}

body.grid-density-6 .card.product-card-v80 .pc80-price span{
  font-size:8px !important;
}

body.grid-density-6 .card.product-card-v80 .pc80-price b{
  font-size:13px !important;
}

body.grid-density-6 .card.product-card-v80 .pc80-actions{
  grid-template-columns:1fr !important;
  gap:5px !important;
}

body.grid-density-6 .card.product-card-v80 .pc80-more,
body.grid-density-6 .card.product-card-v80 .pc80-cart{
  height:28px !important;
  min-height:28px !important;
  font-size:9px !important;
}

/* Smaller desktop/tablet */
@media(max-width:1180px){
  body.grid-density-2 #productGrid,
  body.grid-density-2 #popularGrid,
  body.grid-density-2 #categoryPopularGrid,
  body.grid-density-4 #productGrid,
  body.grid-density-4 #popularGrid,
  body.grid-density-4 #categoryPopularGrid{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }

  body.grid-density-6 #productGrid,
  body.grid-density-6 #popularGrid,
  body.grid-density-6 #categoryPopularGrid{
    grid-template-columns:repeat(4, minmax(0,1fr)) !important;
  }
}

/* Phones */
@media(max-width:700px){
  body.grid-density-2 #productGrid,
  body.grid-density-2 #popularGrid,
  body.grid-density-2 #categoryPopularGrid,
  body.grid-density-4 #productGrid,
  body.grid-density-4 #popularGrid,
  body.grid-density-4 #categoryPopularGrid,
  body.grid-density-6 #productGrid,
  body.grid-density-6 #popularGrid,
  body.grid-density-6 #categoryPopularGrid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:12px !important;
  }

  .card.product-card-v80 .pc80-photo{
    aspect-ratio:1 / .9 !important;
  }

  .card.product-card-v80 .pc80-info{
    padding:8px !important;
    gap:5px !important;
  }

  .card.product-card-v80 h3{
    font-size:12px !important;
    margin-bottom:3px !important;
  }

  .card.product-card-v80 p{
    display:-webkit-box !important;
    font-size:8px !important;
    min-height:18px !important;
  }

  .card.product-card-v80 .pc80-chips span:nth-child(n+3){
    display:none !important;
  }

  .card.product-card-v80 .pc80-price span{
    font-size:7px !important;
  }

  .card.product-card-v80 .pc80-price b{
    font-size:11px !important;
  }

  .card.product-card-v80 .pc80-actions{
    grid-template-columns:1fr 1fr !important;
    gap:5px !important;
  }

  .card.product-card-v80 .pc80-more,
  .card.product-card-v80 .pc80-cart{
    height:26px !important;
    min-height:26px !important;
    font-size:7px !important;
    border-radius:8px !important;
  }
}


/* ===== V81: restore normal scale and stop Popular from flying left ===== */

/* Important: previous fixed pixel columns made cards tiny and left empty space.
   Now grids fill available width again. */
#productGrid,
#popularGrid,
#categoryPopularGrid{
  width:100% !important;
  justify-content:stretch !important;
  align-items:start !important;
}

body.grid-density-2 #productGrid,
body.grid-density-2 #popularGrid,
body.grid-density-2 #categoryPopularGrid{
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  gap:22px !important;
}

body.grid-density-4 #productGrid,
body.grid-density-4 #popularGrid,
body.grid-density-4 #categoryPopularGrid{
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:18px !important;
}

body.grid-density-6 #productGrid,
body.grid-density-6 #popularGrid,
body.grid-density-6 #categoryPopularGrid{
  grid-template-columns:repeat(6, minmax(0, 1fr)) !important;
  gap:14px !important;
}

/* make category/product sections use the desktop width */
.category-popular,
.products-page,
.category-panel{
  width:100% !important;
  max-width:none !important;
}

/* V80 card scaling fix */
.card.product-card-v80,
#productGrid .card.product-card-v80,
#popularGrid .card.product-card-v80,
#categoryPopularGrid .card.product-card-v80{
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  height:auto !important;
  min-height:0 !important;
  transform:none !important;
}

/* 2 in row: large catalog cards, photo separate, no tiny left block */
body.grid-density-2 .card.product-card-v80 .pc80-photo{
  aspect-ratio: 16 / 9 !important;
}

body.grid-density-2 .card.product-card-v80 .pc80-info{
  padding:18px !important;
  gap:12px !important;
}

body.grid-density-2 .card.product-card-v80 h3{
  font-size:22px !important;
}

body.grid-density-2 .card.product-card-v80 p{
  font-size:14px !important;
  min-height:38px !important;
}

body.grid-density-2 .card.product-card-v80 .pc80-chips span{
  font-size:10px !important;
  min-height:24px !important;
}

body.grid-density-2 .card.product-card-v80 .pc80-price b{
  font-size:22px !important;
}

body.grid-density-2 .card.product-card-v80 .pc80-more,
body.grid-density-2 .card.product-card-v80 .pc80-cart{
  height:44px !important;
  min-height:44px !important;
  font-size:14px !important;
}

/* 4 in row: normal product-card scale */
body.grid-density-4 .card.product-card-v80 .pc80-photo{
  aspect-ratio: 1 / .78 !important;
}

body.grid-density-4 .card.product-card-v80 .pc80-info{
  padding:14px !important;
  gap:9px !important;
}

body.grid-density-4 .card.product-card-v80 h3{
  font-size:17px !important;
}

body.grid-density-4 .card.product-card-v80 p{
  font-size:12px !important;
  min-height:32px !important;
}

body.grid-density-4 .card.product-card-v80 .pc80-chips span:nth-child(n+4){
  display:none !important;
}

body.grid-density-4 .card.product-card-v80 .pc80-more,
body.grid-density-4 .card.product-card-v80 .pc80-cart{
  height:38px !important;
  min-height:38px !important;
  font-size:12px !important;
}

/* 6 in row: compact but still fills full row, not tiny */
body.grid-density-6 .card.product-card-v80 .pc80-photo{
  aspect-ratio: 1 / .88 !important;
}

body.grid-density-6 .card.product-card-v80 .pc80-info{
  padding:10px !important;
  gap:7px !important;
}

body.grid-density-6 .card.product-card-v80 h3{
  font-size:13px !important;
}

body.grid-density-6 .card.product-card-v80 p{
  display:none !important;
}

body.grid-density-6 .card.product-card-v80 .pc80-chips span:nth-child(n+3){
  display:none !important;
}

body.grid-density-6 .card.product-card-v80 .pc80-price{
  display:grid !important;
  gap:3px !important;
}

body.grid-density-6 .card.product-card-v80 .pc80-price b{
  font-size:14px !important;
}

body.grid-density-6 .card.product-card-v80 .pc80-actions{
  grid-template-columns:1fr !important;
  gap:6px !important;
}

body.grid-density-6 .card.product-card-v80 .pc80-more,
body.grid-density-6 .card.product-card-v80 .pc80-cart{
  height:30px !important;
  min-height:30px !important;
  font-size:9.5px !important;
}

/* adaptive breakpoints */
@media(max-width:1180px){
  body.grid-density-2 #productGrid,
  body.grid-density-2 #popularGrid,
  body.grid-density-2 #categoryPopularGrid,
  body.grid-density-4 #productGrid,
  body.grid-density-4 #popularGrid,
  body.grid-density-4 #categoryPopularGrid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }

  body.grid-density-6 #productGrid,
  body.grid-density-6 #popularGrid,
  body.grid-density-6 #categoryPopularGrid{
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  }
}

@media(max-width:700px){
  body.grid-density-2 #productGrid,
  body.grid-density-2 #popularGrid,
  body.grid-density-2 #categoryPopularGrid,
  body.grid-density-4 #productGrid,
  body.grid-density-4 #popularGrid,
  body.grid-density-4 #categoryPopularGrid,
  body.grid-density-6 #productGrid,
  body.grid-density-6 #popularGrid,
  body.grid-density-6 #categoryPopularGrid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:12px !important;
  }

  .card.product-card-v80 .pc80-photo,
  body.grid-density-2 .card.product-card-v80 .pc80-photo,
  body.grid-density-4 .card.product-card-v80 .pc80-photo,
  body.grid-density-6 .card.product-card-v80 .pc80-photo{
    aspect-ratio:1 / .88 !important;
  }

  .card.product-card-v80 .pc80-info,
  body.grid-density-2 .card.product-card-v80 .pc80-info,
  body.grid-density-4 .card.product-card-v80 .pc80-info,
  body.grid-density-6 .card.product-card-v80 .pc80-info{
    padding:8px !important;
    gap:5px !important;
  }
}
