
:root{
  --bg:#f4f5f7;
  --ink:#111315;
  --muted:#747982;
  --card:#fff;
  --line:#e5e8ec;
  --lime:#b9ff38;
  --orange:#ff5a36;
  --purple:#dff3ff;
  --blue:#2563eb;
  --cyan:#20c7e8;
  --yellow:#ffd84d;
  --dark:#111315;
  --content:1440px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;
  overflow-x:hidden;
}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
button,input,select{font:inherit}
.wrap{
  width:min(var(--content),calc(100% - 32px));
  margin-inline:auto;
}

/* ================= HEADER ================= */
.siteTop{
  position:sticky;
  top:0;
  z-index:70;
  background:rgba(244,245,247,.95);
  backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(0,0,0,.06);
}
.nav{
  min-height:82px;
  display:grid;
  grid-template-columns:minmax(220px,320px) minmax(280px,1fr) auto;
  align-items:center;
  gap:18px;
}
.brand{
  height:72px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  overflow:visible;
  min-width:0;
}
.brand span{font-size:27px;font-weight:950;letter-spacing:-1.2px}
.brand b{font-size:27px;font-weight:950;background:var(--lime);padding:2px 7px;border-radius:8px;margin-left:3px}

/* FORCE the uploaded logo to be visibly larger */
.brand img{
  width:300px;
  height:68px;
  max-width:none;
  object-fit:contain;
  object-position:left center;
  transform-origin:left center;
}
.topSearch{position:relative;min-width:0}
.topSearch input{
  width:100%;
  height:46px;
  border:1px solid #dfe2e7;
  background:#fff;
  border-radius:999px;
  padding:0 52px 0 18px;
  outline:none;
}
.topSearch button{
  position:absolute;
  right:6px;
  top:5px;
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:#111;
  color:#fff;
  cursor:pointer;
}
.navLinks{display:flex;gap:3px;white-space:nowrap}
.navLinks a{
  font-weight:850;
  font-size:13px;
  padding:10px 12px;
  border-radius:999px;
}
.navLinks a:hover{background:#fff}

/* moving ticker */
.ticker{
  width:100%;
  overflow:hidden;
  border-top:1px solid rgba(0,0,0,.05);
  background:#fff;
}
.tickerTrack{
  display:flex;
  width:max-content;
  animation:tickerMove 48s linear infinite;
  will-change:transform;
}
.ticker:hover .tickerTrack{animation-play-state:paused}
.tickerItem{
  display:flex;
  align-items:center;
  gap:8px;
  padding:6px 16px 6px 7px;
  border-right:1px solid var(--line);
  white-space:nowrap;
  font-size:11px;
}
.tickerItem img{
  width:30px;
  height:30px;
  min-width:30px;
  max-width:30px;
  border-radius:7px;
  object-fit:cover;
  background:#eee;
}
.tickerItem span{
  max-width:180px;
  overflow:hidden;
  text-overflow:ellipsis;
}
.tickerItem b{font-size:11px}
@keyframes tickerMove{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}

/* ================= HERO ================= */
.hero{padding:18px 0 8px}
.heroGrid{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(290px,.45fr);
  gap:12px;
}
.heroMain{
  min-height:430px;
  background:var(--dark);
  border-radius:28px;
  padding:42px;
  position:relative;
  overflow:hidden;
  color:#fff;
}
.heroCopy{position:relative;z-index:3}
.kicker{
  display:inline-flex;
  border:1px solid rgba(255,255,255,.2);
  padding:7px 11px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
}
.hero h1{
  font-size:clamp(48px,6vw,88px);
  line-height:.86;
  letter-spacing:-5px;
  margin:24px 0 18px;
  max-width:850px;
}
.hero h1 em{font-style:normal;color:var(--lime)}
.hero p{
  max-width:650px;
  color:#bbc0c8;
  font-size:17px;
  line-height:1.5;
}
.actions{display:flex;gap:9px;margin-top:24px;flex-wrap:wrap}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  padding:13px 17px;
  border-radius:999px;
  font-weight:900;
  cursor:pointer;
  text-align:center;
}
.btnLime{background:var(--lime);color:#111}
.btnDark{background:#26292d;color:#fff}
.randomSoft{background:#fff;border:1px solid var(--line);color:#111}
.blob{
  position:absolute;width:360px;height:360px;
  border-radius:48% 52% 63% 37%;
  background:linear-gradient(135deg,var(--orange),#ffb038);
  right:-110px;top:-120px;transform:rotate(25deg)
}
.ring{
  position:absolute;width:250px;height:250px;
  border:38px solid var(--lime);border-radius:50%;
  right:100px;bottom:-165px
}
.heroSide{display:grid;grid-template-rows:1fr 1fr;gap:12px}
.featureBox{
  border-radius:28px;
  padding:24px;
  position:relative;
  overflow:hidden;
  min-height:205px;
}
.featureBox.primary{background:var(--lime)}
.featureBox.secondary{background:#dff3ff}
.featureBox small{font-weight:900;text-transform:uppercase;font-size:10px}
.featureBox h3{font-size:29px;line-height:.98;letter-spacing:-1.4px;margin:9px 0}
.featureBox p{font-size:13px;line-height:1.45;max-width:250px}
.featureIcon{position:absolute;right:7px;bottom:-28px;font-size:95px;transform:rotate(-8deg)}

.quickLinks{display:flex;gap:8px;padding:14px 0 2px;flex-wrap:wrap}
.chip{
  background:#fff;
  border:1px solid var(--line);
  padding:9px 13px;
  border-radius:999px;
  font-weight:800;
  font-size:13px;
}
.chip:hover{background:#111;color:#fff}

/* ================= PRODUCTS ================= */
.sectionHead{
  display:flex;
  justify-content:space-between;
  align-items:end;
  margin:28px 0 14px;
  gap:20px;
}
.sectionHead h2{font-size:32px;letter-spacing:-1.4px;margin:0}
.sectionHead p{color:var(--muted);margin:4px 0 0}
.sectionHead a{font-weight:900}
.productGrid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
  width:100%;
}
.productCard{
  background:#fff;
  border-radius:18px;
  overflow:hidden;
  border:1px solid var(--line);
  transition:.2s;
  min-width:0;
}
.productCard:hover{transform:translateY(-3px);box-shadow:0 15px 38px rgba(0,0,0,.07)}
.cardImage{
  display:block;
  aspect-ratio:1/1;
  background:#eceef1;
  overflow:hidden;
  position:relative;
}
.cardImage img{
  width:100%;
  height:100%;
  max-width:100%;
  object-fit:contain;
  background:#fff;
  transition:.3s;
}
.productCard:hover .cardImage img{transform:scale(1.02)}
.cardTag{
  position:absolute;left:9px;top:9px;
  background:rgba(255,255,255,.95);
  padding:6px 8px;border-radius:999px;
  font-size:10px;font-weight:950
}
.cardBody{padding:12px}
.cardCat{font-size:10px;color:var(--muted);font-weight:850;text-transform:uppercase}
.cardTitle{
  display:block;font-weight:780;font-size:14px;line-height:1.32;
  min-height:38px;margin:6px 0
}
.cardBottom{display:flex;justify-content:space-between;align-items:center;margin-top:10px}
.cardPrice{font-size:20px;font-weight:950;letter-spacing:-.5px}
.roundArrow{
  width:32px;height:32px;background:#111;color:#fff;border-radius:50%;
  display:grid;place-items:center;flex:0 0 auto
}
.bigStrip{
  margin:40px 0;
  background:var(--orange);
  border-radius:28px;
  padding:32px;
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:20px;
  color:#fff;
}
.bigStrip h2{font-size:38px;letter-spacing:-2px;line-height:1;margin:0 0 8px}
.bigStrip p{max-width:760px;margin:0;color:#ffe2db}
.bigStrip .btn{background:#fff;color:#111}

/* ================= COMMON PAGES ================= */
.pageHero{padding:38px 0 22px}
.pageHero h1{font-size:clamp(44px,6vw,70px);letter-spacing:-3.5px;line-height:.94;margin:10px 0}
.pageHero p{font-size:17px;color:var(--muted);max-width:760px;line-height:1.5}
.darkKicker{display:inline-block;background:#111;color:#fff;border-radius:999px;padding:7px 11px;font-size:11px;font-weight:900}
.controls{
  background:#fff;border:1px solid var(--line);border-radius:20px;
  padding:13px;display:flex;gap:9px;flex-wrap:wrap;margin-bottom:18px
}
.controls input,.controls select{
  border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:#fff;min-width:150px
}
.controls input{flex:1}
.discoverIntro{display:grid;grid-template-columns:1fr auto;align-items:center;gap:16px;margin-bottom:18px}
.counter{background:#111;color:#fff;padding:10px 14px;border-radius:999px;font-size:12px;font-weight:850}
.emptyState{background:#fff;border:1px solid var(--line);border-radius:22px;padding:38px;text-align:center;grid-column:1/-1}
.emptyState h3{font-size:26px;margin:0 0 7px}.emptyState p{color:var(--muted)}

/* ================= RANDOM / MEME MODE ================= */
.randomMode{
  height:100svh;
  overflow:hidden;
}
.randomMode .siteTop{
  position:relative;
  height:78px;
  overflow:hidden;
}
.randomMode .ticker{display:none}
.randomMode .nav{
  min-height:78px;
  height:78px;
  grid-template-columns:320px 1fr auto;
}
.randomMode .brand{height:70px}
.randomMode .brand img{
  width:300px;height:66px;transform:scale(1.2);transform-origin:left center
}
.randomPage{
  height:calc(100svh - 78px);
  padding:8px 0;
}
.randomStage{
  height:100%;
  display:grid;
  grid-template-rows:38px minmax(0,1fr);
  gap:6px;
}
.randomMiniNav{
  display:flex;
  gap:8px;
  justify-content:flex-end;
  align-items:center;
  font-size:12px;
  font-weight:850;
}
.randomMiniNav a{
  background:#fff;border:1px solid var(--line);
  padding:7px 11px;border-radius:999px
}
.randomProduct{
  min-height:0;
  height:100%;
  max-height:none;
  background:#fff;
  border:1px solid var(--line);
  border-radius:24px;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
  box-shadow:0 18px 55px rgba(17,19,21,.08);
}
.randomPhoto{
  position:relative;
  background:#f0f1f3;
  overflow:hidden;
  min-width:0;
}
.randomPhoto img{
  width:100%;
  height:100%;
  max-width:100%;
  object-fit:contain;
  background:#fff;
}
.randomInfo{
  padding:26px 28px 92px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  position:relative;
}
.randomInfo h1{
  font-size:clamp(30px,3vw,46px);
  line-height:1.02;
  letter-spacing:-2px;
  margin:8px 0 11px;
}
.randomPrice{font-size:34px;font-weight:950;letter-spacing:-1px}
.randomSummary{
  font-size:15px;
  line-height:1.48;
  color:var(--muted);
  margin:12px 0 0;
  max-width:620px;
  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.randomActions{
  position:absolute;
  left:28px;
  right:28px;
  bottom:22px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.randomPrimary{grid-column:1/-1}
.randomActions .btn{min-height:44px;padding:11px 12px;font-size:13px}
.randomSuggestions{display:none} /* no scroll distraction in meme mode */
.randomMode .footer{display:none}

/* ================= PRODUCT PAGE ================= */
.productPage{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(360px,1fr);
  gap:30px;
  padding:30px 0;
}
.productVisual{
  background:#fff;border-radius:26px;overflow:hidden;
  min-height:520px;max-height:680px
}
.productVisual img{width:100%;height:100%;object-fit:contain}
.productInfo{padding:12px 0}
.productInfo h1{font-size:44px;line-height:1.02;letter-spacing:-2.2px;margin:8px 0 15px}
.mainPrice{font-size:36px;font-weight:950}
.productSummary{font-size:16px;line-height:1.55;color:var(--muted);max-width:650px}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:18px 0}
.fact{background:#fff;border-radius:15px;border:1px solid var(--line);padding:14px}
.fact small{display:block;color:var(--muted)}.fact b{display:block;margin-top:4px}
.productActions{display:flex;gap:9px;flex-wrap:wrap}

/* ================= INFINITE FEED ================= */
.infiniteLoader{
  display:flex;align-items:center;justify-content:center;gap:11px;
  min-height:86px;color:var(--muted);font-weight:800;opacity:0;transition:.2s
}
.infiniteLoader.visible{opacity:1}
.loaderDot{
  width:13px;height:13px;border-radius:50%;background:var(--lime);
  box-shadow:20px 0 0 #111,-20px 0 0 var(--orange);
  animation:loaderPulse 1s infinite ease-in-out
}
@keyframes loaderPulse{0%,100%{transform:scale(.78);opacity:.55}50%{transform:scale(1);opacity:1}}
.discoverEnd{text-align:center;background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px 20px;margin:5px auto 25px;max-width:620px}
.discoverEnd strong{display:block}.discoverEnd span{display:block;color:var(--muted);font-size:13px;margin-top:3px}
#discoverSentinel{height:2px}
.feedCard{animation:feedIn .35s ease both}
@keyframes feedIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ================= FOOTER ================= */
.footer{background:#111315;color:#fff;margin-top:48px;padding:42px 0}
.footerGrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px}
.footer p,.footer a{display:block;color:#aeb3bc;font-size:13px;line-height:1.7;margin:0 0 5px}
.footer h4{margin-top:0}.footerBrand{font-size:24px;font-weight:950}.footerBrand span{color:var(--lime)}

/* ================= TABLET ================= */
@media(max-width:1150px){
  .nav{grid-template-columns:250px minmax(240px,1fr) auto}
  .brand img{width:240px;transform:scale(1.18)}
  .productGrid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .heroGrid{grid-template-columns:1fr}
  .heroSide{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .productPage{grid-template-columns:1fr}
}

/* ================= MOBILE ================= */
@media(max-width:800px){
  .wrap{width:calc(100% - 14px)}
  .siteTop{position:sticky}
  .nav{
    min-height:auto;
    padding:6px 0 8px;
    grid-template-columns:1fr auto;
    gap:6px 8px;
  }
  .brand{
    grid-column:1/2;
    height:58px;
    min-width:0;
  }
  .brand img{
    width:205px;
    height:56px;
    max-width:none;
    transform-origin:left center;
  }
  .topSearch{grid-column:1/-1;grid-row:2}
  .topSearch input{height:40px;font-size:13px}
  .topSearch button{top:2px}
  .navLinks{
    grid-column:2/3;
    display:flex;
    justify-content:flex-end;
    gap:0;
  }
  .navLinks a{font-size:10.5px;padding:7px 6px}

  .tickerItem{padding:4px 10px 4px 5px;font-size:10px}
  .tickerItem img{width:25px;height:25px}
  .tickerItem span{max-width:110px}

  .hero{padding-top:8px}
  .heroMain{padding:22px;min-height:335px;border-radius:22px}
  .hero h1{font-size:44px;letter-spacing:-3px;margin:18px 0 14px}
  .hero p{font-size:14px;line-height:1.42}
  .blob{width:250px;height:250px;right:-95px;top:-95px}
  .ring{width:180px;height:180px;border-width:28px;right:35px;bottom:-125px}
  .heroSide{grid-template-columns:1fr 1fr;gap:7px}
  .featureBox{min-height:150px;padding:15px;border-radius:18px}
  .featureBox h3{font-size:21px}.featureBox p{font-size:10.5px;max-width:140px}
  .featureIcon{font-size:65px}

  .quickLinks{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:6px;
    padding:9px 0 0;
  }
  .chip{
    text-align:center;
    padding:9px 6px;
    font-size:11px;
    border-radius:12px;
    white-space:normal;
  }

  .sectionHead{align-items:flex-start;flex-direction:column;margin:21px 0 10px}
  .sectionHead h2{font-size:27px}
  .sectionHead p{font-size:12px}
  .productGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .productCard{border-radius:13px}
  .cardBody{padding:8px}
  .cardTitle{font-size:12px;min-height:33px}
  .cardPrice{font-size:16px}
  .roundArrow{width:28px;height:28px}
  .cardTag{font-size:8.5px;padding:5px 6px}
  .bigStrip{grid-template-columns:1fr;padding:22px;border-radius:20px}
  .bigStrip h2{font-size:30px}

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

  /* Random mode - truly one-screen, no page scrolling */
  .randomMode{
    height:100svh;
    overflow:hidden;
  }
  .randomMode .siteTop{
    height:58px;
    overflow:hidden;
  }
  .randomMode .nav{
    height:58px;
    min-height:58px;
    padding:2px 0;
    display:flex;
    align-items:center;
  }
  .randomMode .brand{height:54px}
  .randomMode .brand img{
    width:205px;
    height:52px;
    transform-origin:left center;
  }
  .randomMode .topSearch,.randomMode .navLinks{display:none}
  .randomPage{
    height:calc(100svh - 58px);
    padding:5px 0;
  }
  .randomStage{
    height:100%;
    grid-template-rows:30px minmax(0,1fr);
    gap:4px;
  }
  .randomMiniNav{
    margin:0;
    justify-content:space-between;
    font-size:9.5px;
  }
  .randomMiniNav a{
    padding:5px 8px;
    border-radius:999px;
  }
  .randomProduct{
    height:100%;
    min-height:0;
    grid-template-columns:43% 57%;
    border-radius:15px;
  }
  .randomPhoto{
    min-height:0;
    height:100%;
  }
  .randomPhoto img{
    width:100%;
    height:100%;
    object-fit:contain;
  }
  .randomInfo{
    height:100%;
    padding:10px 9px 128px;
    justify-content:center;
    overflow:hidden;
  }
  .randomInfo h1{
    font-size:18px;
    line-height:1.02;
    letter-spacing:-.7px;
    margin:4px 0 5px;
    display:-webkit-box;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  .randomPrice{font-size:22px}
  .randomSummary{
    font-size:10px;
    line-height:1.3;
    margin:5px 0 0;
    -webkit-line-clamp:3;
  }
  .randomActions{
    left:9px;
    right:9px;
    bottom:9px;
    grid-template-columns:1fr;
    gap:5px;
  }
  .randomPrimary{grid-column:auto}
  .randomActions .btn{
    min-height:34px;
    padding:7px 6px;
    font-size:9.5px;
  }

  .productPage{grid-template-columns:1fr;gap:14px;padding:18px 0}
  .productVisual{min-height:0;max-height:none;aspect-ratio:1/1}
  .productInfo{padding:0}
  .productInfo h1{font-size:31px}
  .facts{grid-template-columns:1fr 1fr}
}

/* small phones */
@media(max-width:430px){
  .brand img{width:185px;transform:scale(1.2)}
  .hero h1{font-size:40px}
  .featureBox{min-height:142px;padding:13px}
  .featureBox h3{font-size:19px}
  .randomProduct{grid-template-columns:41% 59%}
  .randomInfo{padding:8px 7px 122px}
  .randomInfo h1{font-size:16.5px}
  .randomPrice{font-size:20px}
  .randomSummary{font-size:9.5px;-webkit-line-clamp:2}
  .randomActions{left:7px;right:7px;bottom:7px}
  .randomActions .btn{min-height:32px;font-size:9px}
}


/* ===== V4: PREMIUM BUMPER / CARDS ===== */
.ticker{
  width:min(var(--content),calc(100% - 32px));
  margin:12px auto 0;
  border:1px solid #d9dee7;
  border-radius:22px;
  background:#fff;
  box-shadow:0 10px 32px rgba(17,19,21,.06);
  overflow:hidden;
  position:relative;
}
.ticker::before,.ticker::after{
  content:"";
  position:absolute;
  z-index:4;
  top:0;bottom:0;
  width:52px;
  pointer-events:none;
}
.ticker::before{left:0;background:linear-gradient(90deg,#fff,rgba(255,255,255,0))}
.ticker::after{right:0;background:linear-gradient(270deg,#fff,rgba(255,255,255,0))}
.tickerTrack{min-height:82px;align-items:center}
.tickerItem{
  height:68px;
  margin:7px 4px;
  padding:6px 12px 6px 6px;
  gap:10px;
  border:1px solid #e8ebef;
  border-radius:14px;
  background:#f8fafc;
  min-width:220px;
  max-width:260px;
}
.tickerItem img{
  width:56px!important;height:56px!important;
  min-width:56px!important;max-width:56px!important;
  border-radius:10px!important;
  object-fit:cover!important;
}
.tickerItem span{
  font-size:12px;font-weight:750;line-height:1.18;
  max-width:125px;white-space:normal;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.tickerItem b{font-size:13px;white-space:nowrap;color:#2563eb}

/* colorful modern cards */
.productGrid{gap:14px}
.productCard{
  border:1px solid rgba(17,19,21,.08);
  border-radius:22px;
  box-shadow:0 8px 26px rgba(17,19,21,.055);
  background:linear-gradient(180deg,#fff 0%,#fff 72%,#f8fafc 100%);
}
.productCard:nth-child(6n+1){box-shadow:0 8px 28px rgba(37,99,235,.10)}
.productCard:nth-child(6n+2){box-shadow:0 8px 28px rgba(255,138,48,.10)}
.productCard:nth-child(6n+3){box-shadow:0 8px 28px rgba(32,199,232,.11)}
.productCard:nth-child(6n+4){box-shadow:0 8px 28px rgba(185,255,56,.13)}
.productCard:nth-child(6n+5){box-shadow:0 8px 28px rgba(255,216,77,.12)}
.productCard:hover{
  transform:translateY(-5px);
  box-shadow:0 18px 42px rgba(17,19,21,.13);
  border-color:rgba(37,99,235,.22);
}
.cardImage{background:#f3f6fa}
.cardBody{padding:14px 14px 13px}
.cardCat{
  display:inline-flex;
  padding:5px 8px;
  border-radius:999px;
  background:#e8f0ff;
  color:#1748a5;
  font-size:9px;
  letter-spacing:.2px;
}
.productCard:nth-child(6n+2) .cardCat{background:#fff0e3;color:#a94700}
.productCard:nth-child(6n+3) .cardCat{background:#e2f9fd;color:#08758a}
.productCard:nth-child(6n+4) .cardCat{background:#efffd2;color:#527900}
.productCard:nth-child(6n+5) .cardCat{background:#fff7ce;color:#8b6900}
.cardTitle{font-size:14px;font-weight:850}
.cardPrice{color:#2563eb}
.roundArrow{
  background:#111315;
  transition:.18s;
}
.productCard:hover .roundArrow{background:#2563eb;transform:translateX(2px)}

/* replace ugly pink-ish accent box */
.featureBox.secondary{
  background:linear-gradient(135deg,#dff3ff 0%,#bdeaff 100%);
  border:1px solid #9eddf8;
}
.featureBox.primary{
  background:linear-gradient(135deg,#c8ff55 0%,#aef22b 100%);
}

/* browse/search panel more polished */
.controls{
  border:1px solid #dfe4eb;
  box-shadow:0 8px 30px rgba(17,19,21,.05);
  padding:10px;
}
.controls input,.controls select{background:#f8fafc}
.controls .btn,.controls button[type=submit]{background:#2563eb!important;color:#fff!important}

/* category/quick chips get color, but remain clean */
.quickLinks .chip:nth-child(6n+1){background:#e8f0ff;border-color:#cfddff}
.quickLinks .chip:nth-child(6n+2){background:#efffd8;border-color:#daf6ad}
.quickLinks .chip:nth-child(6n+3){background:#fff0e3;border-color:#ffdbc0}
.quickLinks .chip:nth-child(6n+4){background:#e4f9fd;border-color:#c6eff7}
.quickLinks .chip:nth-child(6n+5){background:#fff7d6;border-color:#f5e6a0}
.quickLinks .chip:nth-child(6n+6){background:#f1f4f8;border-color:#dfe4eb}
.quickLinks .chip:hover{background:#111315;color:#fff;border-color:#111315}

@media(max-width:800px){
  .ticker{
    width:calc(100% - 14px);
    margin-top:6px;
    border-radius:15px;
  }
  .tickerTrack{min-height:66px}
  .tickerItem{
    min-width:180px;max-width:205px;height:56px;margin:5px 3px;padding:4px 8px 4px 4px;
  }
  .tickerItem img{
    width:46px!important;height:46px!important;
    min-width:46px!important;max-width:46px!important;
  }
  .tickerItem span{font-size:10px;max-width:100px}
  .tickerItem b{font-size:11px}
  .ticker::before,.ticker::after{width:24px}
  .productGrid{gap:9px}
  .productCard{border-radius:16px}
  .cardBody{padding:9px}
}


/* ===== V5 POLISH ===== */

/* Remove browser's ugly blue mobile tap flash */
a, button, input, select {
  -webkit-tap-highlight-color: transparent;
}
a:focus, button:focus {
  outline: none;
}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible {
  outline: 3px solid rgba(37,99,235,.25);
  outline-offset: 2px;
}

/* Rounded uploaded logo, no need to edit JPG */
.brand img{
  border-radius:16px !important;
  overflow:hidden;
  background:#fff;
}

/* Navigation buttons: defined hit area and deliberate press state */
.navLinks a,
.randomMiniNav a{
  transition:background .14s ease, color .14s ease, transform .08s ease, box-shadow .14s ease;
}
.navLinks a:hover,
.randomMiniNav a:hover{
  background:#e9edf2;
}
.navLinks a:active,
.randomMiniNav a:active{
  background:#d8dde5;
  transform:scale(.97);
  box-shadow:inset 0 0 0 1px rgba(17,19,21,.06);
}

/* Slightly darker page so cards separate visually */
body{
  background:#eceff3;
}

/* stronger modern card separation */
.productCard{
  background:#f9fbfd;
  border:1.5px solid #cfd6df;
  box-shadow:0 10px 26px rgba(17,19,21,.07);
}
.productCard:nth-child(6n+1){border-color:#bfcef8}
.productCard:nth-child(6n+2){border-color:#f3c7aa}
.productCard:nth-child(6n+3){border-color:#b9e7ef}
.productCard:nth-child(6n+4){border-color:#d6eda7}
.productCard:nth-child(6n+5){border-color:#eadb91}
.productCard:nth-child(6n+6){border-color:#cfd6df}

.cardBody{
  background:linear-gradient(180deg,#ffffff 0%,#f6f8fb 100%);
}

/* Every product image uses the same visual viewport */
.cardImage{
  aspect-ratio:1/1 !important;
  height:auto !important;
  background:linear-gradient(135deg,#eef2f6,#f8fafc);
  display:grid;
  place-items:center;
}
.cardImage img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center !important;
}

/* badges always sit on image */
.cardTag{
  z-index:3;
  top:10px;
  left:10px;
  max-width:calc(100% - 20px);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* Random mode image viewport: fixed and clean */
.randomPhoto{
  background:linear-gradient(135deg,#eef2f6,#f8fafc);
  display:grid;
  place-items:center;
}
.randomPhoto img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  object-position:center !important;
}
.randomPhoto .cardTag{
  top:14px;
  left:14px;
}

/* Random action layout:
   BIG "next" on left; smaller information / Allegro stack on right */
.randomActions{
  grid-template-columns:1.15fr .85fr !important;
  grid-template-rows:1fr 1fr !important;
  gap:8px !important;
}
.randomActions .randomNext{
  grid-column:1;
  grid-row:1 / span 2;
  min-height:96px !important;
  font-size:16px !important;
  background:#111315;
  color:#fff;
}
.randomActions .randomPrimary{
  grid-column:2 !important;
  grid-row:1;
  min-height:44px !important;
  background:var(--lime);
  color:#111;
}
.randomActions .randomSoft{
  grid-column:2;
  grid-row:2;
  min-height:44px !important;
}
.randomActions .btn:active{
  transform:scale(.985);
}

/* product page buttons also separated */
.productActions{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  grid-template-rows:1fr 1fr;
  gap:8px;
}
.productActions .btnDark{
  grid-column:1;
  grid-row:1 / span 2;
  min-height:96px;
}
.productActions .btnLime{
  grid-column:2;
  grid-row:1;
}
.productActions .randomSoft{
  grid-column:2;
  grid-row:2;
}

/* More deliberate loading/pacing block */
.infiniteLoader{
  min-height:140px;
  opacity:1;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.infiniteLoader::after{
  content:"Chwila — układamy kolejną porcję";
  font-size:12px;
  color:var(--muted);
  font-weight:700;
}
.loaderDot{
  width:16px;
  height:16px;
}

/* Mobile */
@media(max-width:800px){
  body{background:#e9edf2}

  .brand img{
    border-radius:13px !important;
  }

  .navLinks a{
    background:#f7f8fa;
    border:1px solid #dde2e8;
    border-radius:10px;
    min-width:44px;
    text-align:center;
  }
  .navLinks a:active{
    background:#dfe4ea;
  }

  .productCard{
    border-width:1.3px;
  }

  .cardImage{
    aspect-ratio:1/1 !important;
  }

  /* random mode: everything still fits, but buttons are safer */
  .randomActions{
    grid-template-columns:1fr 1fr !important;
    grid-template-rows:auto auto !important;
  }
  .randomActions .randomNext{
    grid-column:1 !important;
    grid-row:1 / span 2 !important;
    min-height:78px !important;
    font-size:12px !important;
  }
  .randomActions .randomPrimary{
    grid-column:2 !important;
    grid-row:1 !important;
    min-height:36px !important;
  }
  .randomActions .randomSoft{
    grid-column:2 !important;
    grid-row:2 !important;
    min-height:36px !important;
  }

  .productActions{
    grid-template-columns:1fr 1fr;
  }
  .productActions .btnDark{
    grid-column:1;
    grid-row:1 / span 2;
    min-height:82px;
  }

  .infiniteLoader{
    min-height:120px;
  }
}


/* ===== V6: LOGO 1619x972 + robust discovery loader ===== */

/*
  logo.jpg ma proporcje ok. 1.665:1.
  Nie wciskamy go już w szeroki prostokąt.
  Sterujemy wysokością i pozwalamy przeglądarce zachować naturalne proporcje.
*/
.brand{
  width:max-content !important;
  min-width:0 !important;
  height:auto !important;
  padding:4px !important;
  border-radius:18px;
  transition:background .14s ease, transform .08s ease;
}
.brand:hover{background:rgba(17,19,21,.045)}
.brand:active{
  background:rgba(17,19,21,.09);
  transform:scale(.985);
}
.brand img{
  display:block !important;
  height:76px !important;
  width:auto !important;
  max-height:76px !important;
  max-width:127px !important; /* 76 * 1619/972 ≈ 126.6 */
  aspect-ratio:1619/972;
  object-fit:contain !important;
  border-radius:15px !important;
  transform:none !important;
}

/* Keep header balanced around the real logo dimensions */
.nav{
  grid-template-columns:150px minmax(280px,1fr) auto !important;
  min-height:92px !important;
}

/* Loader is visible only while a batch is actually being prepared */
.infiniteLoader{
  display:none !important;
}
.infiniteLoader.visible{
  display:flex !important;
}

/* Mobile logo keeps same proportions and compact tap target */
@media(max-width:800px){
  .nav{
    grid-template-columns:118px minmax(0,1fr) !important;
    min-height:auto !important;
  }
  .brand{
    padding:3px !important;
    border-radius:14px;
  }
  .brand img{
    height:58px !important;
    width:auto !important;
    max-height:58px !important;
    max-width:97px !important; /* 58 * 1.665 */
    border-radius:12px !important;
  }

  .randomMode .nav{
    display:flex !important;
    min-height:62px !important;
    height:62px !important;
  }
  .randomMode .brand img{
    height:54px !important;
    width:auto !important;
    max-height:54px !important;
    max-width:90px !important;
  }
}
