:root{
  --coal:#131126;
  --card:#1d1a3e;
  --card-2:#272254;
  --card-3:#322c66;
  --hair:#3a3570;
  --hair-2:#544c92;
  --bone:#f4f1ff;
  --mute:#b8b1d6;
  --sun:#f4a51e;
  --sun-2:#f6c84a;
  --sun-ink:#241a00;
  --sky:#2f5fc4;
  --teal:#67d0e8;
  --rose:#e35a14;
  --pro:#54c98f;
  --con:#e0655f;
  --round:10px;
  --wide:1120px;
  --pad:18px;
  --face:"Lucida Sans Unicode","Lucida Grande",sans-serif;
  --read:Tahoma,Geneva,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:hidden;max-width:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
body{margin:0;font:15.5px/1.62 var(--read);color:var(--bone);background:var(--coal);-webkit-font-smoothing:antialiased;overflow-x:hidden;max-width:100%}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{margin:0 0 15px;font-family:var(--face);font-weight:700;line-height:1.22;color:var(--bone);overflow-wrap:break-word}
h1{font-size:40px}
h2{font-size:28px}
h3{font-size:20px}
p{margin:0 0 14px;overflow-wrap:break-word}
ul,ol{margin:0 0 14px;padding-left:22px}
li{margin-bottom:7px}
:focus-visible{outline:2px solid var(--sun);outline-offset:2px}

.page{display:flex;flex-direction:column;min-height:100vh}
main{flex:1 0 auto}
.column{max-width:calc(var(--wide) + var(--pad)*2);margin:0 auto;padding:0 var(--pad) 40px}
.hit{cursor:pointer;-webkit-user-select:none;user-select:none}

@keyframes glow{
  0%,100%{transform:scale(1);box-shadow:0 5px 18px rgba(244,165,30,.26)}
  50%{transform:scale(1.045);box-shadow:0 0 26px rgba(244,165,30,.5)}
}
.act-btn--glow,.join-link,.write-btn{animation:glow 2.8s ease-in-out infinite;will-change:transform}
.act-btn--glow:hover,.join-link:hover,.write-btn:hover{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){.act-btn--glow,.join-link,.write-btn{animation:none}}

.act-btn{display:flex;align-items:center;justify-content:center;text-align:center;max-width:330px;width:100%;min-height:56px;margin:12px auto 0;padding:12px 24px;border-radius:var(--round);background:linear-gradient(180deg,var(--sun-2) 0%,var(--sun) 100%);color:var(--sun-ink);font-family:var(--face);font-size:18px;font-weight:700;transition:filter .2s,transform .1s}
.act-btn:hover{filter:brightness(1.06)}
.act-btn:active{transform:scale(.98)}

.topbar{position:sticky;top:0;z-index:60;background:var(--card);border-bottom:1px solid var(--hair)}
.topbar__in{max-width:calc(var(--wide) + var(--pad)*2);margin:0 auto;padding:0 var(--pad);height:64px;display:flex;align-items:center;gap:20px}
.logo-mark img{height:48px;width:auto}
.topbar .logo-mark{margin-right:auto}
.topnav__list{display:flex;gap:6px;list-style:none;margin:0;padding:0}
.topnav__list li{margin:0}
.topnav__list .hit{display:block;padding:9px 13px;border-radius:7px;font-size:14.5px;font-weight:700;color:var(--bone);background:var(--card-2);border:1px solid var(--hair)}
.topnav__list .hit:hover{background:var(--card-3);border-color:var(--hair-2)}
.topnav__cta{display:none}
.topbar__cta{display:flex;gap:10px}
.login-link,.join-link{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 18px;border-radius:7px;font-size:14px;font-weight:700;white-space:nowrap;font-family:var(--face)}
.login-link{background:var(--card-2);color:var(--sun-2);border:1px solid var(--sun)}
.login-link:hover{background:var(--card-3)}
.join-link{background:linear-gradient(180deg,var(--sun-2) 0%,var(--sun) 100%);color:var(--sun-ink)}
.nav-toggle{position:absolute;opacity:0;pointer-events:none}
.nav-burger{display:none;width:42px;height:42px;padding:9px;flex-direction:column;justify-content:space-between;cursor:pointer;border-radius:7px;background:var(--card-2);border:1px solid var(--hair)}
.nav-burger span{display:block;height:3px;border-radius:2px;background:var(--bone);transition:transform .25s,opacity .25s}

.lead{padding:26px 0 6px;text-align:center}
.lead__h1{margin-bottom:16px;color:var(--sun-2)}
.lead__banner{display:block;margin:0 auto 20px;border-radius:var(--round);overflow:hidden}
.lead__banner img{width:100%;height:auto}
.lead__intro{max-width:960px;margin:0 auto 16px;text-align:left;font-size:16px}
.lead__intro p{margin-bottom:0}

.scroller{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:separate;border-spacing:0;margin:0;border-radius:var(--round);overflow:hidden}
th,td{padding:12px 15px;border:1px solid var(--hair);text-align:center;vertical-align:middle;font-size:14.5px}
th{background:var(--card-3);font-weight:700}
td{background:var(--card)}
tr:nth-child(even) td{background:var(--card-2)}
td:first-child{font-weight:700;text-align:left}

.snapshot,.zone,.reels,.ratings,.verdict,.faqs{margin:0 0 24px;background:var(--card);border:1px solid var(--hair);border-radius:var(--round);padding:24px}
.snapshot{padding-top:20px}
.zone>*:last-child,.ratings>*:last-child{margin-bottom:0}
.zone h3{margin-top:22px;color:var(--sun-2)}
.zone p,.zone li{font-size:16px}
.snapshot__bar,.faqs__bar,.verdict__bar{display:flex;align-items:center;justify-content:center;min-height:58px;margin:0 0 20px;padding:12px 20px;border-radius:var(--round);background:linear-gradient(135deg,var(--sun-2) 0%,var(--sun) 100%);color:var(--sun-ink);text-align:center;font-size:23px}

.reels,.ratings,.foot{content-visibility:auto;contain-intrinsic-size:auto 700px}

.feature{margin:2px 0}
.feature img{width:100%;border-radius:var(--round)}

.reels h2{text-align:center;margin-bottom:20px}
.reels__nav{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;list-style:none;margin:0 0 22px;padding:0}
.reels__nav li{margin:0}
.reels__nav-item{display:flex;align-items:center;justify-content:center;height:46px;border-radius:7px;background:var(--card-2);border:1px solid var(--hair);color:var(--bone);font-size:15px;font-weight:700;font-family:var(--face);text-decoration:none}
.reels__nav-item:hover,.reels__nav-item.lit{background:var(--card-3);border-color:var(--sun)}
.view{display:none}
.view.lit{display:block}
.tile-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px 14px}
.tile{display:block;color:var(--bone);min-width:0}
.tile__pic{display:block;position:relative;border-radius:7px;overflow:hidden;background:var(--card-2);aspect-ratio:360/472}
.tile__pic img{width:100%;height:100%;object-fit:cover;transition:transform .25s}
.tile:hover .tile__pic img{transform:scale(1.05)}
.tile__cap{display:block;margin-top:8px;font-size:13.5px;font-weight:700;line-height:1.3;text-align:center}

.brands{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.brand-cell{display:block;color:var(--bone);min-width:0}
.brand-cell__pic{display:block;border-radius:7px;overflow:hidden;aspect-ratio:200/80;background:#f3f2ef}
.brand-cell__pic img{width:100%;height:100%;object-fit:contain}
.brand-cell__cap{display:block;margin-top:7px;font-size:12.5px;font-weight:700;text-align:center;color:var(--mute)}

.verdict__cols{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.verdict__col{padding:22px;border-radius:var(--round);background:var(--card-2);border:1px solid var(--hair)}
.verdict__col h3{margin-bottom:12px;color:var(--sun-2)}
.verdict__col ul{margin:0;padding:0;list-style:none}
.verdict__col li{position:relative;padding-left:26px;margin-bottom:9px}
.verdict__col li::before{content:"";position:absolute;left:0;top:8px;width:10px;height:10px;border-radius:50%}
.verdict__col--plus li::before{background:var(--pro)}
.verdict__col--minus li::before{background:var(--con)}

.ratings__head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;margin-bottom:16px;border-radius:var(--round);background:var(--card-2);border:1px solid var(--hair)}
.ratings__score{display:flex;align-items:center;gap:12px}
.ratings__score>span:first-child{font-size:27px;font-weight:700;font-family:var(--face)}
.ratings__score small{color:var(--mute);font-size:13px}
.stars2{display:inline-flex;gap:2px}
.stars2 svg{width:18px;height:18px;fill:var(--sun-2)}
.write-btn{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 22px;border-radius:7px;background:linear-gradient(180deg,var(--sun-2) 0%,var(--sun) 100%);color:var(--sun-ink);font-weight:700;font-size:14px;font-family:var(--face);white-space:nowrap}
.ratings__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}
.review{padding:18px;border-radius:var(--round);background:var(--card-2);border:1px solid var(--hair)}
.review__head{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.review__ava{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--sun-2),var(--sun));font-weight:700;font-size:18px;color:var(--sun-ink);font-family:var(--face)}
.review__meta span{display:block;font-weight:700}
.review__meta small{color:var(--mute);font-size:12px}
.review__stars{margin-bottom:8px}
.review__body p{margin:0;font-size:14px}

.faqs__item{padding:18px 20px;margin-bottom:11px;border-radius:var(--round);background:var(--card-2);border:1px solid var(--hair)}
.faqs__item:last-child{margin-bottom:0}
.faqs__item h3{font-size:17.5px;margin-bottom:8px;color:var(--sun-2)}
.faqs__item p{margin:0;font-size:15px}

.freshness{margin:0 0 20px}
.freshness__box{display:flex;align-items:center;gap:12px;padding:15px 20px;border-radius:var(--round);background:var(--card);border:1px solid var(--hair);font-size:14.5px;color:var(--mute)}
.freshness__dot{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;flex:none;border-radius:50%;border:2px solid var(--sun);color:var(--sun-2);font-size:15px}

.foot{background:var(--card);border-top:1px solid var(--hair)}
.foot__grid{max-width:calc(var(--wide) + var(--pad)*2);margin:0 auto;padding:38px var(--pad) 22px;display:flex;justify-content:space-between;gap:40px}
.foot__brand{flex:1 1 0;min-width:0;max-width:460px}
.foot__brand .logo-mark img{height:54px;margin-bottom:14px}
.foot__about{font-size:13.5px;color:var(--mute);margin-bottom:16px}
.foot__social{display:flex;gap:10px}
.soc{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;background:var(--card-2);border:1px solid var(--hair)}
.soc svg{width:20px;height:20px;fill:var(--sun-2)}
.soc:hover{background:var(--card-3)}
.foot__nav{display:flex;gap:54px}
.fcol__cap{font-family:var(--face);font-weight:700;font-size:15px;margin-bottom:12px;color:var(--bone)}
.fcol__list{list-style:none;margin:0;padding:0}
.fcol__list li{margin-bottom:8px}
.fcol__list .hit{font-size:13.5px;color:var(--mute)}
.fcol__list .hit:hover{color:var(--sun-2);text-decoration:underline}
.foot__pay{max-width:calc(var(--wide) + var(--pad)*2);margin:0 auto;padding:22px var(--pad);display:flex;flex-wrap:wrap;justify-content:center;gap:12px;border-top:1px solid var(--hair)}
.paymark img{height:38px;width:auto;border-radius:6px}
.foot__seals{max-width:calc(var(--wide) + var(--pad)*2);margin:0 auto;padding:20px var(--pad);display:grid;grid-template-columns:repeat(4,auto);justify-content:center;align-items:center;gap:16px;border-top:1px solid var(--hair)}
.trust{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 16px;border-radius:8px;background:var(--card-2);border:1px solid var(--hair-2);color:var(--mute);font-size:13px;font-weight:700;text-decoration:none;font-family:var(--face)}
.trust:hover{color:var(--sun-2)}
.trust-age{border-color:var(--rose);color:var(--rose)}
.foot__legal{border-top:1px solid var(--hair)}
.legal{max-width:calc(var(--wide) + var(--pad)*2);margin:0 auto;padding:18px var(--pad);font-size:12px;line-height:1.65;color:var(--mute)}
.legal p{margin:0 0 8px}

.scrolltop{position:fixed;right:18px;bottom:18px;width:46px;height:46px;border-radius:50%;border:1px solid var(--sun);background:var(--card-2);color:var(--sun-2);font-size:20px;cursor:pointer;opacity:0;pointer-events:none;transition:opacity .25s;z-index:70}
.scrolltop.lit{opacity:1;pointer-events:auto}
.scrolltop:hover{background:var(--card-3)}

@media (max-width:1100px){
  .tile-grid{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:1000px){
  .topbar__in{gap:12px}
  .topnav__list .hit{padding:9px 10px;font-size:14px}
  .brands{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:860px){
  .nav-burger{display:flex;order:3}
  .topbar__cta{order:2;margin-left:auto}
  .topbar .logo-mark{margin-right:0}
  .topnav{display:none;position:absolute;left:0;right:0;top:64px;padding:12px var(--pad) 18px;background:var(--card);border-bottom:1px solid var(--hair)}
  .nav-toggle:checked ~ .topnav{display:block}
  .nav-toggle:checked ~ .nav-burger span:nth-child(1){transform:translateY(9px) rotate(45deg)}
  .nav-toggle:checked ~ .nav-burger span:nth-child(2){opacity:0}
  .nav-toggle:checked ~ .nav-burger span:nth-child(3){transform:translateY(-9px) rotate(-45deg)}
  .topnav__list{flex-direction:column;gap:6px}
  .topnav__cta{display:flex;gap:10px;margin-top:14px}
  .topnav__cta .login-link,.topnav__cta .join-link{flex:1}
  .tile-grid{grid-template-columns:repeat(3,1fr)}
  .ratings__grid{grid-template-columns:repeat(2,1fr)}
  .foot__grid{flex-direction:column;gap:26px}
  .foot__nav{gap:40px}
}
@media (max-width:767px){
  h1{font-size:29px}h2{font-size:22px}h3{font-size:17.5px}
  .snapshot,.zone,.reels,.ratings,.verdict,.faqs{padding:18px}
  .zone p,.zone li,.lead__intro{font-size:15.5px}
  th,td{padding:10px 9px;font-size:13px}
  .snapshot__bar,.faqs__bar,.verdict__bar{font-size:18px;min-height:52px}
  .reels__nav{grid-template-columns:repeat(2,1fr);gap:8px}
  .tile-grid{grid-template-columns:repeat(2,1fr);gap:12px 10px}
  .brands{grid-template-columns:repeat(2,1fr)}
  .verdict__cols{grid-template-columns:1fr}
  .ratings__head{flex-direction:column;align-items:flex-start}
  .write-btn{width:100%}
  .ratings__grid{grid-template-columns:1fr}
  .foot__seals{grid-template-columns:repeat(2,auto)}
}
@media (max-width:480px){
  .topbar__in{gap:8px}
  .topbar__cta{gap:6px}
  .login-link,.join-link{height:36px;padding:0 11px;font-size:13px}
  .logo-mark img{height:34px}
  .tile-grid{grid-template-columns:repeat(2,1fr)}
  .nav-burger{width:38px;padding:8px}
}