
.user-chip{
  display:flex;align-items:center;gap:9px;
  padding:5px 11px 5px 6px;border-radius:var(--r-sm);
  background:var(--surface);border:1px solid var(--line);
  white-space:nowrap;
}
.user-chip:hover{border-color:var(--purple);}
.user-av{
  width:30px;height:30px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg,#4f46e5,#818cf8);
  display:grid;place-items:center;font-size:14px;
}
.user-name{font-size:12px;font-weight:700;line-height:1.2;display:block;}
.user-role{font-size:9.5px;color:var(--muted-2);display:block;}
.user-chip > svg{width:11px;height:11px;color:var(--muted-2);flex-shrink:0;}

.crumb{display:flex;align-items:center;gap:9px;padding:16px 0;font-size:12px;color:var(--muted-2);}
.crumb a{color:var(--muted);}
.crumb a:hover{color:var(--purple-3);}
.crumb svg{width:11px;height:11px;}

.cat-hero{
  position:relative;overflow:hidden;
  border-radius:var(--r-xl);
  border:1px solid rgba(168,85,247,.3);
  background:
    radial-gradient(620px 300px at 76% 50%,rgba(168,85,247,.42),transparent 68%),
    radial-gradient(420px 240px at 96% 30%,rgba(59,130,246,.26),transparent 66%),
    linear-gradient(115deg,#160d2e,#0d0819 62%);
  padding:38px 34px;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr);
  gap:26px;align-items:center;
}
.cat-hero-title{
  display:flex;align-items:center;gap:12px;
  font-size:clamp(26px,3.2vw,36px);font-weight:800;letter-spacing:-.035em;
}
.cat-hero-title .bolt{
  width:38px;height:38px;border-radius:11px;flex-shrink:0;
  background:var(--grad-btn);display:grid;place-items:center;color:#fff;
  box-shadow:0 6px 20px rgba(124,58,237,.45);
}
.cat-hero-title .bolt svg{width:20px;height:20px;}
.cat-hero p{font-size:13px;color:var(--muted);line-height:1.7;margin-top:14px;max-width:380px;}

.cat-search{
  display:flex;align-items:center;gap:10px;margin-top:22px;max-width:400px;
  background:rgba(8,6,15,.6);border:1px solid var(--line);
  border-radius:var(--r-sm);padding:11px 14px;
}
.cat-search:focus-within{border-color:var(--purple);}
.cat-search input{flex:1;min-width:0;background:none;border:none;outline:none;color:#fff;font-size:13px;}
.cat-search input::placeholder{color:var(--muted-2);}
.cat-search button{width:16px;height:16px;flex-shrink:0;display:grid;place-items:center;color:var(--muted-2);}
.cat-search button:hover{color:#fff;}
.cat-search svg{width:15px;height:15px;}

.chips{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin-top:16px;}
.chips .cl{font-size:11.5px;color:var(--muted-2);margin-right:2px;}
.chip{
  padding:5px 12px;border-radius:20px;
  background:var(--surface);border:1px solid var(--line);
  font-size:11px;color:var(--muted);
}
.chip:hover{border-color:var(--purple);color:#fff;}

.hero-art{
  position:relative;min-height:210px;
  display:grid;place-items:center;
}
.hero-art-box{
  width:100%;max-width:340px;height:190px;border-radius:var(--r-lg);
  background:linear-gradient(150deg,rgba(139,92,246,.28),rgba(59,130,246,.14));
  border:1px solid rgba(168,85,247,.35);
  display:grid;place-items:center;gap:8px;
  box-shadow:0 16px 50px rgba(124,58,237,.35);
}
.hero-art-box span{font-size:52px;line-height:1;}
.hero-art-box b{font-size:12px;font-weight:700;letter-spacing:.16em;color:#cdc2e8;text-transform:uppercase;}
.gem{position:absolute;font-size:22px;animation:gem-float 5s ease-in-out infinite;}
.gem-1{top:6%;left:6%;}
.gem-2{bottom:12%;left:14%;animation-delay:.8s;}
.gem-3{top:14%;right:8%;animation-delay:1.6s;}
.gem-4{bottom:8%;right:16%;animation-delay:2.2s;}
@keyframes gem-float{0%,100%{translate:0 0;}50%{translate:0 -10px;}}

.sec{padding:28px 0 0;}
.sec-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px;}
.sec-title{font-size:18px;font-weight:700;letter-spacing:-.02em;}
.sec-link{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--purple-3);}
.sec-link:hover{gap:10px;}
.sec-link svg{width:12px;height:12px;transition:.2s;}

.rail{position:relative;}
.rail-track{
  display:grid;grid-auto-flow:column;
  gap:12px;overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;padding:3px 0;
}
.rail-track::-webkit-scrollbar{display:none;}
.rail-btn{
  position:absolute;top:50%;transform:translateY(-50%);z-index:6;
  width:30px;height:30px;border-radius:50%;
  background:var(--surface-2);border:1px solid var(--line);
  display:grid;place-items:center;color:var(--muted);transition:.18s;
}
.rail-btn:hover{background:var(--purple-2);color:#fff;border-color:var(--purple);}
.rail-btn svg{width:12px;height:12px;}
.rail-prev{left:-13px;}
.rail-next{right:-13px;}

.games-track{grid-auto-columns:calc((100% - 7*12px)/8);}
.gcard{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden;display:block;transition:.2s;
}
.gcard:hover{border-color:var(--purple);transform:translateY(-4px);}
.gcard-art{
  height:118px;display:grid;place-items:center;position:relative;
  font-size:15px;font-weight:800;letter-spacing:.03em;color:#fff;
  text-align:center;padding:0 8px;text-shadow:0 2px 10px rgba(0,0,0,.6);
}
.gcard-body{padding:10px 11px 12px;}
.gcard-top{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.gcard-name{
  font-size:11.5px;font-weight:600;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.gcard-top svg{width:11px;height:11px;color:var(--muted-2);flex-shrink:0;}
.gcard-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;margin-top:9px;}
.gcard-from{font-size:9px;color:var(--muted-2);display:block;}
.gcard-price{font-size:13px;font-weight:800;letter-spacing:-.02em;display:block;}
.gcard-btn{
  padding:6px 13px;border-radius:7px;flex-shrink:0;
  background:var(--grad-btn);color:#fff;font-size:10.5px;font-weight:700;
}
.gcard-btn:hover{transform:translateY(-1px);}

.art-ff{background:linear-gradient(150deg,#7c2d12,#f97316);}
.art-pubg{background:linear-gradient(150deg,#1c1917,#a16207);}
.art-ml{background:linear-gradient(150deg,#1e1b4b,#7c3aed);}
.art-roblox{background:linear-gradient(150deg,#3f3f46,#a1a1aa);}
.art-val{background:linear-gradient(150deg,#7f1d1d,#ef4444);}
.art-cod{background:linear-gradient(150deg,#78350f,#f59e0b);}
.art-efb{background:linear-gradient(150deg,#064e3b,#0d9488);}
.art-gen{background:linear-gradient(150deg,#1e3a8a,#60a5fa);}
.art-hok{background:linear-gradient(150deg,#831843,#db2777);}
.art-apex{background:linear-gradient(150deg,#450a0a,#dc2626);}
.art-fc{background:linear-gradient(150deg,#14532d,#22c55e);}
.art-rag{background:linear-gradient(150deg,#4c1d95,#c084fc);}
.art-clash{background:linear-gradient(150deg,#78350f,#fbbf24);}
.art-brawl{background:linear-gradient(150deg,#7c2d12,#facc15);}

.trend-track{grid-auto-columns:calc((100% - 5*12px)/6);}
.tcard{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden;display:block;transition:.2s;
}
.tcard:hover{border-color:var(--purple);transform:translateY(-4px);}
.tcard-art{
  height:86px;display:grid;place-items:center;position:relative;
  font-size:15px;font-weight:800;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.6);
}
.tcard-hot{
  position:absolute;top:7px;right:7px;
  font-size:11px;line-height:1;
}
.tcard-body{padding:9px 10px 11px;text-align:center;}
.tcard-name{
  font-size:10.5px;font-weight:600;display:block;line-height:1.4;
}
.tcard-from{font-size:9.5px;color:var(--muted-2);display:block;margin-top:4px;}

.flash-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;}
.flash-timer{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--muted-2);}
.flash-timer b{
  background:var(--surface-3);color:#fff;font-size:12px;font-weight:700;
  padding:4px 8px;border-radius:6px;min-width:28px;text-align:center;display:inline-block;
}
.flash-main{
  background:var(--surface-2);border:1px solid rgba(168,85,247,.3);
  border-radius:var(--r);padding:15px;
  display:flex;gap:14px;align-items:center;margin-bottom:12px;
}
.flash-logo{
  width:64px;height:64px;border-radius:12px;flex-shrink:0;
  background:linear-gradient(150deg,#78350f,#f59e0b);
  display:grid;place-items:center;font-size:15px;font-weight:800;color:#fff;
}
.flash-info{flex:1;min-width:0;}
.flash-name{font-size:13.5px;font-weight:700;display:block;}
.flash-name em{font-style:normal;color:#4ade80;}
.flash-sub{font-size:10.5px;color:var(--muted-2);display:block;margin-top:2px;}
.flash-price{display:flex;align-items:center;gap:8px;margin-top:9px;flex-wrap:wrap;}
.flash-price b{font-size:17px;font-weight:800;letter-spacing:-.03em;}
.flash-price del{font-size:11px;color:var(--muted-2);}
.flash-off{
  background:rgba(239,68,68,.16);color:#f87171;border:1px solid rgba(239,68,68,.32);
  font-size:9.5px;font-weight:700;padding:2px 7px;border-radius:5px;
}
.flash-btn{
  padding:9px 18px;border-radius:var(--r-sm);flex-shrink:0;
  background:var(--grad-btn);color:#fff;font-size:12px;font-weight:600;white-space:nowrap;
  box-shadow:0 4px 16px rgba(124,58,237,.35);
}
.flash-btn:hover{transform:translateY(-1px);}

.flash-row{
  display:flex;align-items:center;gap:11px;
  padding:9px 0;border-bottom:1px solid var(--line-soft);
}
.flash-row:last-of-type{border-bottom:none;}
.flash-row-logo{
  width:34px;height:34px;border-radius:9px;flex-shrink:0;
  display:grid;place-items:center;font-size:11px;font-weight:800;color:#fff;
}
.flash-row-name{
  flex:1;min-width:0;font-size:11.5px;font-weight:600;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.flash-row-price{font-size:12px;font-weight:700;white-space:nowrap;}
.flash-row-price del{font-size:10px;color:var(--muted-2);font-weight:500;margin-left:5px;}

.region-track{grid-auto-columns:calc((100% - 5*12px)/6);}
.rcard{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);padding:18px 8px;text-align:center;display:block;transition:.2s;
}
.rcard:hover{border-color:var(--purple);transform:translateY(-4px);}
.rflag{font-size:30px;line-height:1;display:block;margin-bottom:10px;}
.rname{font-size:11.5px;font-weight:600;display:block;}
.rsub{font-size:9.5px;color:var(--muted-2);display:block;margin-top:2px;}

.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px 12px;}
.why-cell{text-align:center;}
.why-cell .wi{
  width:42px;height:42px;border-radius:12px;margin:0 auto 10px;
  background:rgba(139,92,246,.14);border:1px solid rgba(139,92,246,.3);
  display:grid;place-items:center;color:var(--purple-3);
}
.why-cell .wi svg{width:18px;height:18px;}
.why-cell h4{font-size:11.5px;margin-bottom:4px;}
.why-cell p{font-size:10px;color:var(--muted-2);line-height:1.5;}

.seller-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;}
.scard{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);padding:15px;display:block;transition:.2s;
}
.scard:hover{border-color:var(--purple);transform:translateY(-4px);}
.scard-top{display:flex;align-items:center;gap:11px;}
.scard-av{
  width:38px;height:38px;border-radius:50%;flex-shrink:0;
  display:grid;place-items:center;font-size:15px;font-weight:800;color:#fff;
}
.scard-name{font-size:12.5px;font-weight:700;display:block;}
.scard-meta{display:flex;align-items:center;gap:8px;margin-top:4px;flex-wrap:wrap;}
.verified{
  display:inline-flex;align-items:center;gap:4px;
  background:rgba(59,130,246,.14);color:#93c5fd;border:1px solid rgba(59,130,246,.3);
  font-size:9px;font-weight:700;padding:2px 7px;border-radius:20px;white-space:nowrap;
}
.verified svg{width:9px;height:9px;}
.scard-rate{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;}
.scard-rate svg{width:11px;height:11px;color:var(--amber);}
.scard-stats{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:13px 0;}
.scard-pos{font-size:12px;font-weight:700;color:#4ade80;}
.scard-sales{font-size:11px;color:var(--muted-2);}
.scard-btn{
  display:block;width:100%;text-align:center;padding:9px;border-radius:var(--r-sm);
  background:var(--surface-2);border:1px solid var(--line);
  font-size:11.5px;font-weight:600;color:var(--muted);
}
.scard-btn:hover{color:#fff;border-color:var(--purple);}

.new-track{grid-auto-columns:calc((100% - 5*12px)/6);}
.ncard-art{
  height:104px;display:grid;place-items:center;position:relative;
  font-size:13px;font-weight:800;color:#fff;text-align:center;padding:0 8px;
  text-shadow:0 2px 10px rgba(0,0,0,.6);
}
.ncard-new{
  position:absolute;top:7px;left:7px;
  background:var(--grad-btn);color:#fff;
  font-size:8px;font-weight:800;letter-spacing:.06em;
  padding:2px 7px;border-radius:20px;
}

.cat-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:20px;align-items:start;}
.cat-col{display:flex;flex-direction:column;gap:20px;min-width:0;}
.panel-box{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:17px;
}
.panel-box .sec-title{font-size:15px;}
.panel-box > .sec-title{display:block;margin-bottom:15px;}
.panel-box.center-title > .sec-title{text-align:center;}

@media (max-width:1200px){
  .games-track{grid-auto-columns:calc((100% - 5*12px)/6);}
  .cat-grid{grid-template-columns:1fr;}
  .why-grid{grid-template-columns:repeat(6,1fr);}
}
@media (max-width:1000px){
  .seller-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .games-track{grid-auto-columns:calc((100% - 4*12px)/5);}
  .trend-track,.region-track,.new-track{grid-auto-columns:calc((100% - 3*12px)/4);}
  .why-grid{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:820px){
  .cat-hero{grid-template-columns:1fr;padding:28px 22px;}
  .hero-art{min-height:170px;order:-1;}
  .games-track{grid-auto-columns:calc((100% - 2*12px)/3);}
  .trend-track,.region-track,.new-track{grid-auto-columns:calc((100% - 2*12px)/3);}
}
@media (max-width:600px){
  .games-track,.trend-track,.region-track,.new-track{grid-auto-columns:calc((100% - 12px)/2);}
  .seller-grid{grid-template-columns:1fr;}
  .why-grid{grid-template-columns:repeat(2,1fr);}
  .rail-prev{left:-8px;}
  .rail-next{right:-8px;}
  .flash-main{flex-direction:column;align-items:flex-start;}
  .flash-btn{width:100%;text-align:center;}
  .user-name,.user-role{display:none;}
}

.gcard-body,.tcard-body{display:block;}
.gcard-top,.gcard-foot{display:flex;}
.gcard-btn{display:inline-block;text-align:center;}
.flash-off{font-style:normal;display:inline-block;}
.flash-name em{font-style:normal;}
.tcard-hot{font-style:normal;}
.ncard-new{font-style:normal;}
.user-name,.user-role{display:block;}

.sub-hero{
  position:relative;overflow:hidden;
  border-radius:var(--r-xl);
  border:1px solid rgba(168,85,247,.3);
  background:
    radial-gradient(560px 320px at 74% 48%,rgba(168,85,247,.45),transparent 66%),
    radial-gradient(420px 260px at 96% 20%,rgba(59,130,246,.24),transparent 64%),
    linear-gradient(115deg,#150c2c,#0c0718 60%);
  padding:40px 34px;
  display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:26px;align-items:center;
}
.sub-title{font-size:clamp(30px,3.6vw,42px);line-height:1.12;font-weight:800;letter-spacing:-.035em;}
.sub-title em{font-style:normal;display:block;color:#a855f7;}
.sub-hero > div > p{font-size:13px;color:var(--muted);line-height:1.7;margin-top:14px;max-width:330px;}

.badge-row{
  display:flex;flex-wrap:wrap;gap:10px;margin-top:20px;
  padding:10px 12px;border-radius:var(--r-sm);
  background:rgba(8,6,15,.5);border:1px solid var(--line);
  width:fit-content;
}
.badge-pill{display:flex;align-items:center;gap:7px;font-size:10.5px;color:var(--muted);white-space:nowrap;}
.badge-pill svg{width:13px;height:13px;color:var(--purple-3);flex-shrink:0;}

.sub-art{position:relative;min-height:250px;display:grid;place-items:center;}
.sub-core{
  width:104px;height:104px;border-radius:22px;
  background:linear-gradient(150deg,#a855f7,#7c3aed);
  display:grid;place-items:center;color:#fff;
  box-shadow:0 0 70px rgba(168,85,247,.7);
  animation:core-pulse 4s ease-in-out infinite;
}
.sub-core svg{width:44px;height:44px;}
@keyframes core-pulse{0%,100%{box-shadow:0 0 60px rgba(168,85,247,.55);}50%{box-shadow:0 0 90px rgba(168,85,247,.85);}}
.fly{
  position:absolute;width:74px;height:56px;border-radius:11px;
  background:linear-gradient(160deg,#1b1233,#120b25);
  border:1px solid rgba(168,85,247,.32);
  display:grid;place-items:center;
  font-size:9px;font-weight:800;text-align:center;line-height:1.25;padding:0 5px;
  box-shadow:0 8px 26px rgba(0,0,0,.5);
  animation:gem-float 6s ease-in-out infinite;
}
.fly-1{top:2%;left:4%;animation-delay:0s;}
.fly-2{top:6%;left:32%;animation-delay:.5s;}
.fly-3{top:2%;right:26%;animation-delay:1s;}
.fly-4{top:12%;right:2%;animation-delay:1.5s;}
.fly-5{bottom:14%;left:0;animation-delay:2s;}
.fly-6{bottom:4%;left:26%;animation-delay:2.5s;}
.fly-7{bottom:20%;right:22%;animation-delay:3s;}
.fly-8{bottom:6%;right:2%;animation-delay:3.5s;}

.pbox{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:20px;
}

.brand-track{grid-auto-columns:calc((100% - 11*10px)/12);gap:10px;}
.bcard{
  background:var(--surface-2);border:1px solid var(--line);
  border-radius:var(--r);padding:14px 6px;text-align:center;display:block;transition:.2s;
}
.bcard:hover{border-color:var(--purple);transform:translateY(-4px);}
.bcard-logo{width:40px;height:40px;margin:0 auto 9px;}
.bcard-name{
  font-size:10px;font-weight:600;display:block;line-height:1.35;
}
.bcard-from{font-size:9px;color:var(--muted-2);display:block;margin-top:4px;}

.feat-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:13px;}
.fcard{
  background:var(--surface-2);border:1px solid var(--line);
  border-radius:var(--r);padding:16px 14px;display:block;transition:.2s;
}
.fcard:hover{border-color:var(--purple);transform:translateY(-4px);}
.fcard-logo{width:52px;height:52px;margin:0 auto 14px;}
.fcard-name{font-size:13px;font-weight:700;display:block;margin-bottom:10px;}
.fcard-feats{margin-bottom:11px;}
.fcard-feat{
  display:flex;align-items:flex-start;gap:7px;
  font-size:10px;color:var(--muted);margin-bottom:5px;line-height:1.4;
}
.fcard-feat svg{width:11px;height:11px;color:#4ade80;flex-shrink:0;margin-top:2px;}
.fcard-rate{display:flex;align-items:center;gap:5px;font-size:10px;color:var(--muted-2);margin-bottom:8px;}
.fcard-rate svg{width:11px;height:11px;color:var(--amber);flex-shrink:0;}
.fcard-rate b{font-size:10.5px;font-weight:700;color:var(--text);}
.fcard-price{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:12px;}
.fcard-price b{font-size:16px;font-weight:800;letter-spacing:-.03em;}
.fcard-price del{font-size:10.5px;color:var(--muted-2);}
.off-tag{
  background:var(--red);color:#fff;
  font-size:9px;font-weight:700;padding:2px 6px;border-radius:5px;
  font-style:normal;display:inline-block;
}
.fcard-btn{
  display:block;width:100%;text-align:center;padding:9px;border-radius:var(--r-sm);
  background:var(--grad-btn);color:#fff;font-size:11.5px;font-weight:600;
}
.fcard-btn:hover{transform:translateY(-1px);}

.ctrack{grid-auto-columns:calc((100% - 7*12px)/8);}
.ccard{
  background:var(--surface-2);border:1px solid var(--line);
  border-radius:var(--r);padding:20px 8px;text-align:center;display:block;transition:.2s;
}
.ccard:hover{border-color:var(--purple);transform:translateY(-4px);}
.ccard-ico{
  width:34px;height:34px;margin:0 auto 12px;display:grid;place-items:center;
}
.ccard-ico svg{width:24px;height:24px;}
.ccard-name{font-size:11.5px;font-weight:600;display:block;}
.ccard-sub{font-size:9.5px;color:var(--muted-2);display:block;margin-top:3px;}

.fd-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
.fd-card{
  position:relative;
  background:var(--surface-2);border:1px solid var(--line);
  border-radius:var(--r);padding:16px 12px;text-align:center;display:block;transition:.2s;
}
.fd-card:hover{border-color:var(--purple);transform:translateY(-4px);}
.fd-off{
  position:absolute;top:9px;left:9px;
  background:var(--red);color:#fff;
  font-size:9px;font-weight:700;padding:2px 7px;border-radius:5px;
}
.fd-logo{width:44px;height:44px;margin:14px auto 12px;}
.fd-name{font-size:11.5px;font-weight:600;display:block;}
.fd-plan{font-size:9.5px;color:var(--muted-2);display:block;margin-top:2px;}
.fd-price{display:flex;align-items:center;justify-content:center;gap:7px;margin:10px 0 12px;}
.fd-price b{font-size:15px;font-weight:800;letter-spacing:-.03em;}
.fd-price del{font-size:10px;color:var(--muted-2);}
.fd-btn{
  display:block;width:100%;text-align:center;padding:8px;border-radius:var(--r-sm);
  background:var(--grad-btn);color:#fff;font-size:11px;font-weight:600;
}
.fd-btn:hover{transform:translateY(-1px);}

.ts-row{
  display:flex;align-items:center;gap:12px;
  background:var(--surface-2);border:1px solid var(--line);
  border-radius:var(--r);padding:12px 14px;margin-bottom:11px;
}
.ts-row:last-child{margin-bottom:0;}
.ts-av{
  width:36px;height:36px;border-radius:50%;flex-shrink:0;
  display:grid;place-items:center;font-size:14px;font-weight:800;color:#fff;
}
.ts-info{flex:1;min-width:0;}
.ts-name{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.ts-name b{font-size:12.5px;font-weight:700;}
.ts-stars{color:var(--amber);font-size:11px;letter-spacing:1px;flex-shrink:0;}
.ts-pos{font-size:11.5px;font-weight:700;color:#4ade80;white-space:nowrap;flex-shrink:0;}
.ts-sales{font-size:11px;color:var(--muted-2);white-space:nowrap;flex-shrink:0;}
.ts-btn{
  padding:7px 15px;border-radius:var(--r-sm);flex-shrink:0;
  background:var(--surface-3);border:1px solid var(--line);
  font-size:11px;font-weight:600;color:var(--muted);white-space:nowrap;
}
.ts-btn:hover{color:#fff;border-color:var(--purple);}

.why-wide{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;}

.row-2a{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:20px;align-items:start;}
.row-2b{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:20px;align-items:start;}

.lm-canva{background:linear-gradient(135deg,#00c4cc,#7d2ae8);}
.lm-adobe{background:#ec1c24;}
.lm-ms{background:#1f1f1f;}
.lm-office{background:#d83b01;}

@media (max-width:1300px){
  .feat-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  .brand-track{grid-auto-columns:calc((100% - 7*10px)/8);}
}
@media (max-width:1100px){
  .row-2a,.row-2b{grid-template-columns:1fr;}
  .why-wide{grid-template-columns:repeat(3,minmax(0,1fr));}
  .ctrack{grid-auto-columns:calc((100% - 4*12px)/5);}
}
@media (max-width:820px){
  .sub-hero{grid-template-columns:1fr;padding:28px 22px;}
  .sub-art{min-height:220px;order:-1;}
  .feat-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .brand-track{grid-auto-columns:calc((100% - 4*10px)/5);}
  .ctrack{grid-auto-columns:calc((100% - 2*12px)/3);}
  .fd-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .ts-row{flex-wrap:wrap;}
}
@media (max-width:600px){
  .brand-track{grid-auto-columns:calc((100% - 2*10px)/3);}
  .ctrack{grid-auto-columns:calc((100% - 12px)/2);}
  .why-wide{grid-template-columns:repeat(2,minmax(0,1fr));}
  .badge-row{width:100%;}
  .fly{width:60px;height:46px;font-size:8px;}
  .sub-core{width:82px;height:82px;}
}
@media (max-width:440px){
  .feat-grid{grid-template-columns:1fr;}
  .fd-grid{grid-template-columns:1fr;}
}

.fcard-feats{display:block;}
.fcard-rate,.fcard-price{display:flex;}
.fd-off{font-style:normal;}
.bcard-logo,.fcard-logo,.fd-logo{display:grid;place-items:center;}
.ts-name{display:flex;}

.steps-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;}
.step{
  position:relative;
  background:var(--surface-2);border:1px solid var(--line);
  border-radius:var(--r);padding:20px 16px;
}
.step-no{
  width:30px;height:30px;border-radius:9px;margin-bottom:12px;
  background:var(--grad-btn);color:#fff;
  display:grid;place-items:center;
  font-size:12px;font-weight:800;
  box-shadow:0 4px 14px rgba(124,58,237,.35);
}
.step h4{font-size:12.5px;margin-bottom:6px;}
.step p{font-size:11px;color:var(--muted-2);line-height:1.6;}
.step-line{
  position:absolute;top:34px;right:-8px;width:16px;height:2px;
  background:var(--line);
}
.step:last-child .step-line{display:none;}

.rev-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;}
.rev{
  background:var(--surface-2);border:1px solid var(--line);
  border-radius:var(--r);padding:17px;
  display:flex;flex-direction:column;
}
.rev-stars{color:var(--amber);font-size:11px;letter-spacing:1px;margin-bottom:10px;}
.rev-text{font-size:11.5px;color:var(--muted);line-height:1.7;flex:1;}
.rev-user{display:flex;align-items:center;gap:9px;margin-top:14px;}
.rev-av{
  width:30px;height:30px;border-radius:50%;flex-shrink:0;
  display:grid;place-items:center;font-size:12px;font-weight:700;color:#fff;
}
.rev-name{font-size:11.5px;font-weight:600;display:block;}
.rev-item{font-size:9.5px;color:var(--muted-2);display:block;}

.tstrip{
  background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-lg);
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
}
.tstrip-item{display:flex;align-items:center;gap:13px;padding:20px 22px;}
.tstrip-item + .tstrip-item{border-left:1px solid var(--line-soft);}
.tstrip-ico{
  width:38px;height:38px;border-radius:11px;flex-shrink:0;
  background:rgba(139,92,246,.14);border:1px solid rgba(139,92,246,.3);
  display:grid;place-items:center;color:var(--purple-3);
}
.tstrip-ico svg{width:17px;height:17px;}
.tstrip-item h4{font-size:12.5px;}
.tstrip-item p{font-size:11px;color:var(--muted-2);margin-top:2px;}
.tstrip.is-5{grid-template-columns:repeat(5,minmax(0,1fr));}
.tstrip-item > div{min-width:0;}

@media (max-width:1000px){
  .steps-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .step-line{display:none;}
  .rev-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .tstrip, .tstrip.is-5{grid-template-columns:repeat(2,minmax(0,1fr));}
  .tstrip-item{padding:16px 16px;}
  .tstrip-item:nth-child(odd){border-left:none;}
  .tstrip-item:nth-child(n+3){border-top:1px solid var(--line-soft);}
}
@media (max-width:600px){
  .steps-grid,.rev-grid,.tstrip,.tstrip.is-5{grid-template-columns:1fr;}
  .tstrip-item + .tstrip-item{border-left:none;border-top:1px solid var(--line-soft);}
}

.lm-amazon{background:#232f3e;color:#ff9900;}
.lm-razer{background:#0d0d0d;color:#44d62c;}
.lm-ebay{background:#f5f5f5;color:#e53238;}
.lm-walmart{background:#0071ce;}
.lm-visa{background:#1a1f71;}
.lm-ubisoft{background:#0b0b0b;}
.lm-ea{background:#ff4747;}
.lm-battlenet{background:#00aeff;}
.lm-gog{background:#8a2be2;}
.lm-rockstar{background:#fcaf17;color:#111;}
.lm-nintendo{background:#e60012;}
.lm-riot{background:#d13639;}
.lm-autodesk{background:#0696d7;}
.lm-jetbrains{background:linear-gradient(135deg,#fe315d,#f97a12);}
.lm-norton{background:#ffe01b;color:#111;}
.lm-mcafee{background:#c01818;}
.lm-nord{background:#4687ff;}
.lm-express{background:#da3940;}
.lm-kaspersky{background:#0a0a0a;color:#00a88e;}
.lm-parallels{background:#c8202f;}
.lm-perplexity{background:#20808d;}
.lm-runway{background:#111;}
.lm-eleven{background:#0b0b0b;}
.lm-notion{background:#f7f7f5;color:#111;}
.lm-jasper{background:#ff7a59;}
.lm-grammarly{background:#15c39a;}
.lm-avg{background:#1f7bff;}
.lm-corel{background:#0c8a3e;}

.hero-lite{
  position:relative;overflow:hidden;
  border-radius:var(--r-xl);
  border:1px solid rgba(168,85,247,.3);
  background:
    radial-gradient(560px 300px at 76% 50%,rgba(168,85,247,.42),transparent 66%),
    radial-gradient(400px 240px at 96% 24%,rgba(59,130,246,.22),transparent 64%),
    linear-gradient(115deg,#150c2c,#0c0718 60%);
  padding:30px 30px;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:24px;align-items:center;
}
.hero-lite h1{font-size:clamp(26px,3.4vw,38px);font-weight:800;letter-spacing:-.035em;line-height:1.1;}
.hero-lite > div > p{font-size:12.5px;color:var(--muted);margin-top:10px;}
.hero-lite .badge-row{margin-top:16px;}

.lite-art{position:relative;min-height:150px;display:grid;place-items:center;}
.lite-core{
  width:100%;max-width:300px;height:132px;border-radius:var(--r-lg);
  background:linear-gradient(150deg,rgba(139,92,246,.3),rgba(59,130,246,.14));
  border:1px solid rgba(168,85,247,.35);
  display:grid;place-items:center;gap:7px;
  box-shadow:0 14px 44px rgba(124,58,237,.35);
}
.lite-core span{font-size:42px;line-height:1;}
.lite-core b{font-size:10.5px;font-weight:700;letter-spacing:.16em;color:#cdc2e8;text-transform:uppercase;}
.mini{position:absolute;font-size:17px;animation:gem-float 5.5s ease-in-out infinite;}
.mini-1{top:4%;left:4%;}
.mini-2{bottom:10%;left:12%;animation-delay:.9s;}
.mini-3{top:8%;right:6%;animation-delay:1.7s;}
.mini-4{bottom:6%;right:14%;animation-delay:2.4s;}

.dcount{display:flex;gap:9px;flex-wrap:wrap;}
.dbox{
  min-width:54px;padding:9px 10px;border-radius:var(--r-sm);text-align:center;
  background:rgba(8,6,15,.55);border:1px solid var(--line);
}
.dbox b{font-size:18px;font-weight:800;letter-spacing:-.03em;display:block;}
.dbox span{font-size:9px;color:var(--muted-2);display:block;margin-top:2px;}
.dcount-label{font-size:11px;color:var(--muted-2);display:block;margin-bottom:8px;}

.grid-6{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;}
.grid-6.is-5{grid-template-columns:repeat(5,minmax(0,1fr));}

.grid-7{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:12px;}

.vcard{
  position:relative;
  background:var(--surface-2);border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden;display:block;transition:.2s;
}
.vcard:hover{border-color:var(--purple);transform:translateY(-4px);}
.vcard-art{
  height:118px;display:grid;place-items:center;position:relative;
  font-size:13px;font-weight:800;color:#fff;text-align:center;padding:0 10px;
  line-height:1.25;text-shadow:0 2px 10px rgba(0,0,0,.6);
}
.vcard-art.tall{height:142px;}
.vcard-off{
  position:absolute;top:8px;left:8px;z-index:2;
  background:var(--red);color:#fff;font-style:normal;
  font-size:9px;font-weight:700;padding:2px 7px;border-radius:5px;
}
.vcard-off.right{left:auto;right:8px;}
.vcard-pad{padding:18px 10px 0;}
.vcard-logo{width:46px;height:46px;margin:0 auto;display:grid;place-items:center;}
.vcard-body{padding:12px;text-align:center;}
.vcard-name{font-size:11.5px;font-weight:600;display:block;line-height:1.4;}
.vcard-sub{font-size:9.5px;color:var(--muted-2);display:block;margin-top:3px;}
.vcard-rate{
  display:flex;align-items:center;justify-content:center;gap:5px;
  font-size:9.5px;color:var(--muted-2);margin-top:8px;
}
.vcard-rate svg{width:11px;height:11px;color:var(--amber);flex-shrink:0;}
.vcard-rate b{font-size:10.5px;font-weight:700;color:var(--text);}
.vcard-price{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;margin-top:9px;}
.vcard-price b{font-size:14px;font-weight:800;letter-spacing:-.03em;}
.vcard-price del{font-size:10px;color:var(--muted-2);}
.vcard-from{font-size:11px;color:var(--muted);display:block;margin-top:8px;}
.vcard-from b{font-size:12.5px;font-weight:800;color:var(--text);}
.vcard-btn{
  display:block;margin-top:11px;padding:8px;border-radius:var(--r-sm);
  background:var(--grad-btn);color:#fff;
  font-size:11px;font-weight:600;text-align:center;
}
.vcard-btn:hover{transform:translateY(-1px);}

.wlist .wl-row{
  display:flex;gap:11px;padding:11px 0;border-bottom:1px solid var(--line-soft);
}
.wlist .wl-row:last-child{border-bottom:none;}
.wl-ico{
  width:32px;height:32px;border-radius:9px;flex-shrink:0;
  background:rgba(139,92,246,.14);border:1px solid rgba(139,92,246,.3);
  display:grid;place-items:center;color:var(--purple-3);
}
.wl-ico svg{width:15px;height:15px;}
.wl-row h5{font-size:11.5px;font-weight:700;margin-bottom:3px;}
.wl-row p{font-size:10px;color:var(--muted-2);line-height:1.5;}

.pillbar{
  display:flex;align-items:center;justify-content:space-between;
  gap:14px;flex-wrap:wrap;margin-bottom:18px;
}
.pills{display:flex;gap:8px;flex-wrap:wrap;}
.pill{
  padding:8px 16px;border-radius:20px;
  background:var(--surface);border:1px solid var(--line);
  font-size:12px;font-weight:600;color:var(--muted);white-space:nowrap;
}
.pill:hover{color:#fff;border-color:var(--purple);}
.pill.is-active{background:var(--grad-btn);color:#fff;border-color:transparent;box-shadow:0 4px 14px rgba(124,58,237,.35);}
.sortby{
  display:flex;align-items:center;gap:8px;
  font-size:12px;color:var(--muted-2);white-space:nowrap;
}
.sortby select{
  padding:7px 28px 7px 11px;border-radius:var(--r-sm);
  background:var(--surface);border:1px solid var(--line);color:var(--text);
  font-size:12px;font-weight:600;appearance:none;-webkit-appearance:none;
  cursor:pointer;outline:none;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236f6690' stroke-width='2.6' stroke-linecap='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 10px center;background-size:11px;
}
.sortby select option{background:var(--surface-2);}

.art-a{background:linear-gradient(150deg,#422006,#a16207);}
.art-b{background:linear-gradient(150deg,#0c4a6e,#0ea5e9);}
.art-c{background:linear-gradient(150deg,#14532d,#65a30d);}
.art-d{background:linear-gradient(150deg,#450a0a,#b91c1c);}
.art-e{background:linear-gradient(150deg,#1e1b4b,#4f46e5);}
.art-f{background:linear-gradient(150deg,#3b0764,#9333ea);}
.art-g{background:linear-gradient(150deg,#431407,#ea580c);}
.art-h{background:linear-gradient(150deg,#082f49,#0369a1);}
.art-i{background:linear-gradient(150deg,#500724,#be185d);}
.art-j{background:linear-gradient(150deg,#1c1917,#57534e);}
.art-k{background:linear-gradient(150deg,#134e4a,#0d9488);}
.art-l{background:linear-gradient(150deg,#4c0519,#e11d48);}

@media (max-width:1300px){
  .grid-6,.grid-7,.grid-6.is-5{grid-template-columns:repeat(4,minmax(0,1fr));}
}
@media (max-width:900px){
  .hero-lite{grid-template-columns:1fr;padding:24px 20px;}
  .lite-art{order:-1;min-height:130px;}
  .grid-6,.grid-7,.grid-6.is-5{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media (max-width:600px){
  .grid-6,.grid-7,.grid-6.is-5{grid-template-columns:repeat(2,minmax(0,1fr));}
  .pillbar{flex-direction:column;align-items:stretch;}
  .dbox{min-width:0;flex:1;}
}
