:root{--bg:#e8eeed;--panel:#fff;--soft:#f2f6f5;--ink:#0c2123;--ink2:#41595a;--mute:#6e8584;--line:rgba(11,40,42,.12);--line2:rgba(11,40,42,.18);--acc:#f05d0e;--acc2:#d94f05;--acc-soft:#fff1e8;--teal:#0c857f;--ok:#14a05a;--r:20px;--fh:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;--fb:"DM Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-padding-top:76px}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 var(--fb);-webkit-font-smoothing:antialiased}
a{color:inherit}
img{max-width:100%;display:block}
button,input,select{font:inherit;color:inherit}
h1,h2,h3,h4{font-family:var(--fh);margin:0;letter-spacing:-.01em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:8px 12px;border-radius:8px;z-index:99}.skip:focus{left:8px}
.wrap{max-width:1280px;margin:0 auto;padding:14px 14px 22px}

/* header */
.top{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}
.top-in{max-width:1280px;margin:0 auto;height:62px;padding:0 14px;display:flex;align-items:center;gap:10px}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;flex:none}
.mark svg{display:block;filter:drop-shadow(0 2px 4px rgba(240,93,14,.25))}
.brand-txt{display:none;flex-direction:column;line-height:1}
.brand-txt b{font:800 20px/1 var(--fh);letter-spacing:-.02em}
.brand-txt em{font-style:normal;color:var(--acc)}
.brand-txt small{font-size:9.5px;font-weight:600;letter-spacing:.18em;color:var(--mute);margin-top:4px}
.search{flex:1;min-width:0;display:flex;align-items:center;gap:8px;height:42px;padding:0 14px;background:var(--soft);border:1px solid var(--line2);border-radius:999px;color:var(--mute);transition:border-color .15s,box-shadow .15s}
.search:focus-within{border-color:var(--acc);box-shadow:0 0 0 3px rgba(240,93,14,.15);background:#fff}
.search input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-size:15px;color:var(--ink)}
.search input::placeholder{color:var(--mute)}
.iconbtn{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:7px;height:42px;min-width:42px;border-radius:999px;border:1px solid var(--line2);background:var(--soft);color:var(--ink2);text-decoration:none;font-weight:600;font-size:14px}
.iconbtn.tg{background:var(--acc-soft);border-color:rgba(240,93,14,.45);color:var(--acc)}
.iconbtn.tg:hover{background:var(--acc);color:#fff}
.tg-lbl{display:none}

/* hero */
.hero{background:var(--bg)}
.hero-in{max-width:1280px;margin:0 auto;padding:22px 16px 18px;display:grid;gap:16px}
.hero h1{font-size:27px;font-weight:800;line-height:1.12}
.hero h1 span{color:var(--acc)}
.lead{margin:8px 0 0;color:var(--ink2);font-size:15.5px;max-width:520px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.stat{background:var(--soft);border:1px solid var(--line2);border-radius:13px;padding:10px 6px;text-align:center;display:flex;flex-direction:column;justify-content:center;min-height:68px}
.stat b{font:800 20px/1.15 var(--fh)}
.stat span{font-size:11.5px;color:var(--ink2);line-height:1.25;margin-top:2px}
.note{display:flex;gap:8px;align-items:flex-start;margin:0;font-size:12.5px;color:var(--ink2);line-height:1.55}
.note svg{flex:none;margin-top:2px;color:var(--mute)}
.note a{color:var(--acc);font-weight:600}
.stats-note{margin:-8px 0 0;font-size:11px;color:var(--mute);text-align:center}

/* category pills */
.cats{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.cats-in{max-width:1280px;margin:0 auto;display:flex;gap:8px;overflow-x:auto;padding:11px 14px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.cats-in::-webkit-scrollbar{display:none}
.pill{flex:none;display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 13px;border-radius:999px;border:1px solid var(--line2);background:var(--soft);cursor:pointer;font-weight:500;font-size:14px;white-space:nowrap;transition:background .15s,border-color .15s}
.pill:hover{border-color:var(--acc)}
.pill .n{font-size:11px;font-weight:600;background:#fff;border:1px solid var(--line);border-radius:7px;padding:1px 6px;color:var(--ink2)}
.pill.on{background:var(--acc);border-color:var(--acc);color:#fff;font-weight:700}
.pill.on .n{background:rgba(255,255,255,.22);border-color:transparent;color:#fff}

/* toolbar */
.bar{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;align-items:center;margin:4px 0 14px}
.bar-l,.bar-r{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.count{font-size:14px;color:var(--ink2)}.count b{color:var(--ink);font-weight:700}
.live{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 12px;border-radius:999px;background:#ddf3e8;border:1px solid rgba(20,160,90,.35);color:#0d6b3e;font-size:13px;font-weight:600}
.live i{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 0 rgba(20,160,90,.6);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 7px rgba(20,160,90,0)}100%{box-shadow:0 0 0 0 rgba(20,160,90,0)}}
.viewtog{display:inline-flex;border:1px solid var(--line2);border-radius:11px;overflow:hidden;background:#fff}
.viewtog button{border:0;background:transparent;width:38px;height:32px;display:grid;place-items:center;cursor:pointer;color:var(--ink2)}
.viewtog button.on{background:var(--acc-soft);color:var(--acc)}
.selectwrap{position:relative}
.selectwrap select{appearance:none;-webkit-appearance:none;height:38px;padding:0 34px 0 13px;border-radius:11px;border:1px solid var(--line2);background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6' fill='none' stroke='%2341595a' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 12px center;font-size:13.5px;cursor:pointer}
.sw{display:inline-flex;align-items:center;gap:9px;height:38px;padding:0 13px;border-radius:11px;border:1px solid var(--line2);background:#fff;font-size:13.5px;cursor:pointer;user-select:none}
.sw input{position:absolute;opacity:0;pointer-events:none}
.sw i{width:30px;height:17px;border-radius:99px;background:#c9d4d3;position:relative;transition:background .15s}
.sw i::after{content:"";position:absolute;left:2px;top:2px;width:13px;height:13px;border-radius:50%;background:#fff;transition:transform .15s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.sw input:checked+i{background:var(--acc)}.sw input:checked+i::after{transform:translateX(13px)}
.sw input:focus-visible+i{outline:2px solid var(--acc);outline-offset:2px}

/* deal grid + cards */
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:transform .15s,box-shadow .15s}
.card:hover{transform:translateY(-2px);box-shadow:0 10px 26px -14px rgba(12,33,35,.35)}
.thumb{position:relative;display:block;aspect-ratio:1/1;background:#fff;border-bottom:1px solid var(--line)}
.thumb img{width:100%;height:100%;object-fit:contain;padding:12px;mix-blend-mode:multiply}
.thumb .noimg{position:absolute;inset:0;display:grid;place-items:center;font-size:42px;background:var(--soft)}
.tag{position:absolute;font-size:10px;font-weight:600;border-radius:7px;padding:3px 7px;line-height:1.3;border:1px solid var(--line2);background:rgba(255,255,255,.9)}
.tag.cat{top:9px;right:9px;color:var(--teal);max-width:calc(100% - 70px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tag.off{top:9px;left:9px;background:var(--acc);border-color:var(--acc);color:#fff;font:800 12px/1.2 var(--fh);padding:4px 7px}
.tag.b{bottom:9px;left:9px;font-weight:700;letter-spacing:.04em}
.tag.b-loot{background:#1d1d1d;border-color:#1d1d1d;color:#ffd23f}
.tag.b-hot{background:#fff1e8;border-color:rgba(240,93,14,.45);color:var(--acc2)}
.tag.b-other{color:var(--ink2)}
.info-c{padding:11px 12px 12px;display:flex;flex-direction:column;flex:1}
.title{font-size:13.5px;font-weight:600;line-height:1.35;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.7em}
.title a{text-decoration:none}.title a:hover{color:var(--acc)}
.prices{display:flex;align-items:baseline;gap:7px;flex-wrap:wrap;margin-top:7px}
.price{font:800 21px/1 var(--fh);letter-spacing:-.02em}
.was{font-size:12px;color:var(--mute);text-decoration:line-through}
.save{display:inline-flex;align-items:center;gap:4px;margin-top:5px;font-size:11.5px;font-weight:700;color:#8a5a00;background:#fff6dc;border:1px solid #f2dc9b;border-radius:7px;padding:2px 7px;align-self:flex-start}
.save.none{color:var(--mute);background:none;border:0;padding:0;font-weight:500}
.meta{font-size:11.5px;color:var(--mute);margin-top:7px;display:flex;align-items:center;gap:5px}
.acts{display:flex;gap:7px;margin-top:auto;padding-top:11px}
.btn-deal{flex:1;display:inline-flex;align-items:center;justify-content:center;height:38px;border-radius:10px;background:var(--acc);color:#fff;text-decoration:none;font:800 14px/1 var(--fh);border:1px solid var(--acc);transition:background .15s}
.btn-deal:hover{background:var(--acc2)}
.btn-deal.inline{flex:none;padding:0 22px;height:44px;margin-top:6px}
.share{flex:none;width:38px;height:38px;border-radius:10px;border:1px solid var(--line2);background:var(--soft);display:grid;place-items:center;cursor:pointer;color:var(--ink2)}
.share:hover{border-color:var(--acc);color:var(--acc)}

/* list view */
.grid.list{grid-template-columns:minmax(0,1fr);gap:8px}
.grid.list .card{flex-direction:row;border-radius:16px}
.grid.list .thumb{width:112px;flex:none;border-bottom:0;border-right:1px solid var(--line)}
.grid.list .tag.cat,.grid.list .tag.b{display:none}
.grid.list .info-c{padding:10px 12px}
.grid.list .title{min-height:0}
.grid.list .acts{padding-top:8px}

/* telegram promo inside grid */
.promo{grid-column:1/-1;display:flex;flex-direction:column;gap:12px;align-items:flex-start;padding:18px;border-radius:var(--r);background:linear-gradient(135deg,#0c2123,#14403f);color:#fff;position:relative;overflow:hidden}
.promo::after{content:"";position:absolute;right:-40px;top:-40px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(240,93,14,.55),transparent 70%)}
.promo h3{font-size:20px;font-weight:800}.promo p{margin:4px 0 0;color:#bcd0cf;font-size:14px}
.promo .btn-deal{flex:none;padding:0 20px;position:relative;z-index:1}

.more-wrap{display:flex;justify-content:center;margin:20px 0 6px}
.btn-more{height:44px;padding:0 26px;border-radius:12px;border:1px solid var(--acc);background:#fff;color:var(--acc);font:800 14.5px/1 var(--fh);cursor:pointer}
.btn-more:hover{background:var(--acc);color:#fff}
.btn-ghost{height:40px;padding:0 18px;border-radius:11px;border:1px solid var(--line2);background:#fff;cursor:pointer;font-weight:600}
.empty{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:34px 20px;text-align:center;max-width:560px;margin:10px auto}
.empty-ico{font-size:40px}.empty h2{font-size:21px;margin:6px 0}.empty p{color:var(--ink2);margin:0 0 14px}

/* skeleton */
.sk{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.sk div{background:linear-gradient(90deg,#eef3f2 25%,#f7faf9 50%,#eef3f2 75%);background-size:200% 100%;animation:sh 1.2s infinite}
.sk .a{aspect-ratio:1/1}.sk .b{height:12px;margin:12px;border-radius:6px}.sk .c{height:20px;width:45%;margin:0 12px 14px;border-radius:6px}
@keyframes sh{to{background-position:-200% 0}}

/* info sections */
.info,.latest,.catcloud{padding-top:26px;padding-bottom:6px}
.info{border-top:1px solid var(--line);margin-top:24px}
.info h2,.latest h2,.catcloud h2{font-size:20px;font-weight:700;margin-bottom:12px}
.info-grid{display:grid;gap:10px}
.ic{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px}
.ic-ico{font-size:22px}.ic h3{font-size:15.5px;margin:8px 0 4px}.ic p{margin:0;font-size:13.5px;color:var(--ink2)}
.sub{margin:-8px 0 12px;font-size:13px;color:var(--mute)}
.latest-list{display:grid;grid-template-columns:minmax(0,1fr);column-gap:22px}
.li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);text-decoration:none;font-size:13.5px}
.li span{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.li:hover span{color:var(--acc)}
.li b{flex:none;font-weight:700;white-space:nowrap}.li b s{font-weight:400;color:var(--mute);font-size:12px;margin-left:5px}.li b em{font-style:normal;color:var(--acc);margin-left:6px}
.cloud{display:flex;flex-wrap:wrap;gap:8px}
.cloud .pill{background:#fff;height:34px;font-size:13.5px}

/* footer */
.foot{background:#f2f6f5;border-top:1px solid var(--line);margin-top:34px}
.foot-in{max-width:1280px;margin:0 auto;padding:28px 16px 10px;display:grid;grid-template-columns:1fr 1fr;gap:22px}
.foot-brand{grid-column:1/-1}
.brand.sm .brand-txt{display:flex}.brand.sm .brand-txt b{font-size:18px}
.foot-brand p{margin:8px 0 12px;font-size:13.5px;color:var(--ink2);max-width:300px}
.foot-tg{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 14px;border-radius:999px;background:#229ED9;color:#fff;text-decoration:none;font-weight:600;font-size:13.5px}
.foot-col h4{font:700 11.5px/1 var(--fb);letter-spacing:.12em;text-transform:uppercase;color:var(--ink2);margin-bottom:12px}
.foot-col nav{display:flex;flex-direction:column;gap:9px}
.foot-col a{text-decoration:none;font-size:13.5px;color:var(--ink)}.foot-col a:hover{color:var(--acc)}
.foot-legal{max-width:1280px;margin:0 auto;padding:14px 16px 28px;border-top:1px solid var(--line)}
.flinks{display:flex;flex-wrap:wrap;gap:6px 16px;margin-bottom:10px}
.flinks a{font-size:13px;color:var(--ink2);text-decoration:none}.flinks a:hover{color:var(--acc)}
.disc{margin:0;font-size:12px;color:var(--ink2);line-height:1.6}
.copy{margin:8px 0 0;font-size:12px;color:var(--mute)}
.toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);background:var(--ink);color:#fff;padding:10px 16px;border-radius:10px;font-size:14px;z-index:90;box-shadow:0 8px 24px rgba(0,0,0,.25)}

a:focus-visible,button:focus-visible,select:focus-visible{outline:2px solid var(--acc);outline-offset:2px}

@media (min-width:420px){.brand-txt{display:flex}}
@media (min-width:640px){
  .grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .hero h1{font-size:31px}
  .info-grid{grid-template-columns:repeat(3,1fr)}
  .promo{flex-direction:row;justify-content:space-between;align-items:center;padding:22px 26px}
  .tg-lbl{display:inline}.iconbtn.tg{padding:0 16px}
  .foot-in{grid-template-columns:1.4fr 1fr 1fr 1fr}.foot-brand{grid-column:auto}
  .grid.list .thumb{width:150px}
}
@media (min-width:900px){
  .wrap{padding:14px 16px 22px}
  .top-in{padding:0 18px;gap:14px}
  .hero-in{grid-template-columns:1.1fr 1fr;align-items:center;column-gap:40px;padding:26px 18px 18px}
  .hero h1{font-size:34px}
  .stats{gap:10px}.stat{min-height:74px}.stat b{font-size:22px}
  .note{grid-column:1}.stats-note{grid-column:2;grid-row:2;margin:0;text-align:right;align-self:start}
  .grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
  .latest-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid.list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:1200px){.grid{grid-template-columns:repeat(5,minmax(0,1fr))}.price{font-size:23px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}