
:root{
  /* фирменное: тёмно-зелёная шапка «радара», тёплая бумага вместо холодного серого */
  --ink:#10261f; --ink2:#1c3a30; --radar:#3ddc97;
  --bg:#f7f6f2; --panel:#ffffff; --panel2:#f1f0ea;
  --line:#e6e4dc; --line2:#d3d0c5; --edge:#868b84;
  --tx:#1c211e; --tx-hi:#0e1411; --mut:#646a64;
  --acc:#0a7458; --buy:#0a7458; --buy-h:#075c46;
  --radius:6px;
}
*{box-sizing:border-box}
body{margin:0;font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  background:var(--bg);color:var(--tx);min-height:100vh;display:flex;flex-direction:column}
main{flex:1 0 auto;width:100%}
a{color:var(--acc);text-decoration:none}
a:hover{text-decoration:underline}
img{display:block}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
button{font:inherit;color:inherit}
h1{font-size:26px;line-height:1.2;font-weight:700;margin:.2em 0 .3em;color:var(--tx-hi)}
h2{font-size:19px;line-height:1.3;font-weight:700;margin:1.7em 0 .6em;color:var(--tx-hi)}
h3{font-size:16px;margin:0 0 .4em}
/* шапка */
.top{background:var(--ink);position:sticky;top:0;z-index:10}
.top :focus-visible{outline-color:var(--radar)}
.top .sres :focus-visible{outline-color:var(--acc)}
.top-in{max-width:1280px;margin:0 auto;padding:0 24px;min-height:60px;display:flex;align-items:center;gap:22px}
.logo{display:inline-flex;align-items:center;gap:7px;color:#fff;font-size:20px;letter-spacing:-.01em}
.logo:hover{text-decoration:none}
.logo .mark{color:var(--radar)}
.logo b{font-weight:800}
.search{flex:1;max-width:480px;position:relative;display:flex;align-items:center;color:var(--mut)}
.search svg{position:absolute;left:11px;pointer-events:none}
.search input{width:100%;height:38px;padding:0 12px 0 34px;border:1px solid transparent;border-radius:var(--radius);
  background:#fff;color:var(--tx);font-size:15px}
.search input:focus{border-color:var(--radar)}
.sres{position:absolute;left:0;right:0;top:calc(100% + 4px);background:var(--panel);border:1px solid var(--line2);
  border-radius:var(--radius);box-shadow:0 6px 20px rgba(15,20,30,.12);z-index:20;overflow:hidden}
.srow{display:grid;grid-template-columns:1fr auto;gap:0 12px;padding:8px 12px;color:var(--tx);border-bottom:1px solid var(--line)}
.srow:last-child{border-bottom:0}
.srow:hover,.srow.on{background:var(--panel2);text-decoration:none}
.srow .sn{font-weight:600;font-size:14.5px}
.srow .sg{grid-row:2;font-size:12.5px;color:var(--mut)}
.srow .sp{grid-row:1/3;grid-column:2;align-self:center;font-weight:700;color:var(--tx-hi);font-size:14px;white-space:nowrap}
.sempty{padding:10px 12px;color:var(--mut);font-size:14px}
.mainnav{display:flex;gap:2px;margin-left:auto}
.mainnav a{padding:19px 10px;color:#d9e4df;font-size:14.5px;font-weight:500}
.mainnav a:hover{color:#fff;text-decoration:none}
.mainnav a[aria-current]{color:#fff;box-shadow:inset 0 -3px 0 var(--radar)}
.menubtn{display:none;margin-left:auto;background:none;border:0;padding:8px;cursor:pointer;color:#fff}
main{max-width:1280px;margin:0 auto;padding:18px 24px 48px}
.crumbs{color:var(--mut);font-size:13.5px;margin:2px 0 10px}
.crumbs a{color:var(--mut)}
.shead{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 14px;margin:0 0 12px}
.shead h1,.shead h2{margin:0}
.shead a{margin-left:auto;font-size:14px}
.sumline{color:var(--mut);font-size:14px;margin:2px 0 0}
.note{max-width:68ch;margin:0 0 16px;color:var(--tx)}
.empty{color:var(--mut);padding:20px 0}
section.aihome{margin-bottom:34px}
.homehead{margin-bottom:20px}
.homehead h1{margin:0}
.more-links{margin-left:auto;display:inline-flex;gap:14px;font-size:14px}
.shead .more-links a{margin-left:0}
section.keyshome{scroll-margin-top:76px}
/* карточки сервисов (нейросети, PlayStation, Xbox) */
.sgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.sgrid.wide{grid-template-columns:repeat(auto-fit,minmax(280px,380px))}
.scard{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:1px;padding:13px 15px;background:var(--panel);
  border:1px solid var(--line);border-radius:var(--radius);color:var(--tx)}
.scard:hover{text-decoration:none;border-color:var(--acc)}
.scard:hover .s-n{color:var(--acc)}
.s-l{position:absolute;top:13px;right:13px;width:32px;height:32px;border-radius:7px;object-fit:contain}
.s-n{font-weight:700;font-size:17px;color:var(--tx-hi);padding-right:40px}
.logoed{display:flex;align-items:center;gap:11px}
.h-l{width:34px;height:34px;border-radius:7px;object-fit:contain;flex:none}
.s-d{font-size:13px;color:var(--mut);min-height:1.5em;padding-right:40px}
.s-p{font-size:16px;font-weight:700;color:var(--tx-hi);margin-top:9px;font-variant-numeric:tabular-nums}
.s-c{font-size:12.5px;color:var(--mut)}
.aigroup{margin-bottom:26px}
.aigroup h2{margin:0 0 10px;font-size:15px;color:var(--mut);font-weight:600}
/* категории */
.catbar{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 12px}
.catbar button{padding:6px 12px;border-radius:var(--radius);border:1px solid var(--line);
  background:var(--panel);cursor:pointer;font-size:14px}
.catbar button:hover{border-color:var(--line2)}
.catbar button.on{background:var(--tx-hi);border-color:var(--tx-hi);color:#fff}
/* плитки игр */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:20px 14px}
.tcard{display:flex;flex-direction:column;color:var(--tx)}
.tcard:hover{text-decoration:none}
.tcard:hover .g{color:var(--acc)}
.tcard .ph{position:relative;aspect-ratio:2/3;background:#e6e9ed;border-radius:var(--radius);overflow:hidden}
.tcard .ph img{width:100%;height:100%;object-fit:cover}
.pill-new{position:absolute;left:6px;top:6px;padding:1px 6px;border-radius:4px;background:#fff;
  color:var(--tx);font-size:11.5px;font-weight:600}
.tcard .b{padding:7px 1px 0;display:flex;flex-direction:column}
.tcard .g{font-size:14px;font-weight:600;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;
  -webkit-box-orient:vertical;overflow:hidden}
.tcard .p{font-size:15px;font-weight:700;color:var(--tx-hi);margin-top:3px}
.tcard .c{font-size:12.5px;color:var(--mut)}
.lgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(185px,1fr));gap:16px 14px}
.ltcard{display:flex;flex-direction:column;color:var(--tx)}
.ltcard:hover{text-decoration:none}
.ltcard:hover .g{color:var(--acc)}
.ltcard .lph{aspect-ratio:460/215;border-radius:var(--radius);overflow:hidden;background:#e6e9ed}
.ltcard .lph img{width:100%;height:100%;object-fit:cover}
.ltcard .lb{padding:6px 1px 0;display:flex;justify-content:space-between;gap:10px;font-size:14px}
.ltcard .g{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ltcard .p{font-weight:700;color:var(--tx-hi);white-space:nowrap}
/* шапка товара */
.phead{display:grid;grid-template-columns:minmax(0,440px) minmax(0,1fr);gap:24px;align-items:start;margin-bottom:4px}
.phead.noart{grid-template-columns:minmax(0,1fr)}
.pinfo{min-width:0}
.phead .art{border-radius:var(--radius);overflow:hidden;aspect-ratio:460/215;background:#e6e9ed}
.phead .art img{width:100%;height:100%;object-fit:cover}
.pinfo h1{margin-top:0}
.picks{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:10px;margin-top:14px;max-width:820px}
.pick{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;
  display:flex;flex-direction:column}
.pk-l{font-size:12.5px;color:var(--mut);font-weight:600}
.pk-n{font-size:15px;font-weight:600;margin:3px 0 0;line-height:1.35}
.pk-s{font-size:13px;color:var(--mut);margin-top:6px}
.pk-b{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:10px}
.pk-p{font-size:21px;font-weight:700;color:var(--tx-hi);font-variant-numeric:tabular-nums}
/* метки лота */
.chips-s{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.chip{font-size:12px;line-height:1.5;padding:0 6px;border-radius:4px;background:var(--panel2);
  border:1px solid var(--line);color:var(--tx);white-space:nowrap}
.chip.warn{background:#fdecea;border-color:#f6c9c4;color:#b42318}
.chip.ok{background:#e4f5ee;border-color:#c5e8d8;color:#075c46}
.chip.ed{font-weight:600}
/* фильтры и сортировка */
.ofilters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 4px}
.seg{display:inline-flex;border:1px solid var(--line2);border-radius:var(--radius);overflow:hidden;background:var(--panel)}
.seg button{border:0;border-right:1px solid var(--line);background:none;padding:6px 12px;font-size:13.5px;cursor:pointer}
.seg button:last-child{border-right:0}
.seg button:hover{background:var(--panel2)}
.seg button.on{background:var(--tx-hi);color:#fff}
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0 8px;flex-wrap:wrap}
.toolbar .cnt{color:var(--mut);font-size:14px}
.sortsel{display:inline-flex;align-items:center;gap:8px;color:var(--mut);font-size:14px}
.sortsel select{background:var(--panel);color:var(--tx);border:1px solid var(--edge);
  border-radius:var(--radius);padding:5px 8px;font:inherit;cursor:pointer}
/* таблица лотов */
table.offers{width:100%;border-collapse:separate;border-spacing:0;background:var(--panel);
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.offers th{font-size:12.5px;font-weight:600;color:var(--mut);text-align:left;padding:8px 12px;
  background:var(--panel2);border-bottom:1px solid var(--line)}
.offers td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
.offers tr:last-child td{border-bottom:0}
.offers tbody tr:hover{background:#fafbfc}
.offers .nm .on{display:block;font-size:14.5px;line-height:1.35}
.offers .sv{width:200px}
.offers .sn{display:block;font-size:14px;font-weight:500}
.offers .sr{display:block;font-size:12.5px;color:var(--mut);white-space:nowrap}
.offers .pr{white-space:nowrap;font-weight:700;font-size:16px;color:var(--tx-hi);text-align:right;
  font-variant-numeric:tabular-nums}
.offers .bt{width:1%;text-align:right}
.offers th:nth-child(3){text-align:right}
.pbox{display:inline-flex;flex-direction:column;align-items:flex-end;line-height:1.15}
.pbox .dbadge{font-size:12px;color:#1f7a3a;font-weight:600}
.pbox .old{color:var(--mut);text-decoration:line-through;font-size:12px;font-weight:400}
a.buy,.cta{display:inline-block;padding:8px 16px;border-radius:var(--radius);background:var(--buy);
  color:#fff;font-weight:600;font-size:14px;white-space:nowrap}
a.buy:hover,.cta:hover{background:var(--buy-h);text-decoration:none}
.buyw{display:inline-flex;flex-direction:column;align-items:center;gap:2px}
.via{font-size:12px;color:var(--mut);white-space:nowrap}
.showmore{display:block;margin:14px auto 0;padding:8px 20px;border-radius:var(--radius);cursor:pointer;
  background:var(--panel);border:1px solid var(--line2);font-weight:600;font-size:14px}
.showmore:hover{border-color:var(--mut)}
/* тарифы нейросетей */
.tartable{width:100%;max-width:900px;border-collapse:separate;border-spacing:0;background:var(--panel);
  border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;font-size:14.5px;
  font-variant-numeric:tabular-nums}
.tartable th{font-size:12.5px;font-weight:600;color:var(--mut);text-align:left;padding:8px 12px;
  background:var(--panel2);border-bottom:1px solid var(--line)}
.tartable td{padding:9px 12px;border-bottom:1px solid var(--line);white-space:nowrap}
.tartable tr:last-child td{border-bottom:0}
.tartable .tn{font-weight:600;white-space:normal}
.tartable .tc{color:var(--mut)}
.pm{display:block;font-size:12px;font-weight:400;color:var(--mut)}
.pk-p .pm{font-size:12.5px}
.tartable .pm{display:inline;margin-left:4px}
.fine{font-size:13px;color:var(--mut);max-width:75ch;margin:6px 0 0}
.ways,.steps{max-width:68ch;padding-left:20px}
.ways li,.steps li{margin:.55em 0;line-height:1.6}
/* тексты */
.tips ul{margin:0;padding-left:20px;max-width:68ch}
.tips li{margin:.45em 0;line-height:1.6}
.faq{max-width:820px}
.faq details{border-bottom:1px solid var(--line);padding:11px 0}
.faq details:first-of-type{border-top:1px solid var(--line)}
summary{list-style:none;display:flex;justify-content:space-between;gap:16px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--mut);font-weight:400;font-size:18px;line-height:1.2}
details[open]>summary::after{content:"−"}
.faq summary{cursor:pointer;font-weight:600}
.faq details p{color:var(--tx);margin:.5em 0 0;line-height:1.6;max-width:68ch}
.faq ul{padding-left:20px}.faq li{margin:.35em 0}
.prose{max-width:68ch;font-size:16px;line-height:1.65}
.prose li{margin:.45em 0}
.about p{max-width:68ch;line-height:1.65}
.ameta{display:flex;flex-wrap:wrap;gap:4px 20px;margin:0 0 10px;color:var(--mut);font-size:14px}
.ameta b{color:var(--tx);font-weight:600}
details.reqs{margin-top:22px;max-width:980px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:11px 0}
details.reqs>summary{font-weight:600;cursor:pointer}
.reqs .rgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.reqs .rcol{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);
  padding:12px 14px;font-size:13.5px;color:var(--mut)}
.reqs .rcol h3{color:var(--tx);font-size:15px}
.reqs .rcol ul{margin:0;padding-left:16px}
.reqs .rcol strong{color:var(--tx)}
.more{margin-top:34px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chips a{padding:6px 12px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);
  font-size:14px;color:var(--tx)}
.chips a:hover{border-color:var(--line2);text-decoration:none;color:var(--acc)}
/* калькулятор */
.calc{display:grid;grid-template-columns:1fr 1fr;gap:12px;max-width:820px}
.calc .box{padding:14px 16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.calc label{display:block;margin:10px 0 0;color:var(--mut);font-size:13.5px}
.calc input{width:100%;height:38px;padding:0 10px;border:1px solid var(--edge);border-radius:var(--radius);
  background:#fff;color:var(--tx);font-size:16px;margin-top:3px}
.calc input:focus{border-color:var(--acc)}
.calc .res{font-size:16px;margin:14px 0 0}
.calc .res b{color:var(--tx-hi);font-size:22px}
.calc .sub{color:var(--mut);font-size:13.5px;margin:4px 0 0}
/* 404 */
.notfound{text-align:center;padding:56px 16px}
.notfound .code{font-size:72px;font-weight:700;line-height:1;color:var(--line2)}
.notfound .cta{margin-top:16px}
/* уведомление о cookie */
.cookie{position:fixed;left:16px;right:16px;bottom:16px;z-index:30;max-width:620px;margin:0 auto;display:flex;
  flex-wrap:wrap;align-items:center;gap:10px 12px;padding:12px 14px;background:var(--ink);color:#fff;
  border-radius:var(--radius);font-size:14px}
.cookie[hidden]{display:none}
.cookie span{flex:1 1 280px}
.cookie a{color:var(--radar)}
.cookie button{border:0;border-radius:var(--radius);padding:6px 12px;cursor:pointer;font-size:14px}
.cookie-ok{background:var(--radar);color:var(--ink);font-weight:600}
.cookie-no{background:transparent;color:#d9e4df}
/* подвал */
footer{background:var(--panel);border-top:1px solid var(--line);color:var(--mut);font-size:14px;margin-top:48px}
.fcols{max-width:1280px;margin:0 auto;padding:28px 24px 8px;display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;gap:24px}
.fcols h4{color:var(--tx);font-size:14px;margin:0 0 8px}
.fcols a{display:block;color:var(--mut);padding:3px 0}
.fcols a:hover{color:var(--acc)}
.fabout .logo{font-size:17px;margin-bottom:8px;color:var(--tx-hi)}
.fabout .logo .mark{color:var(--acc)}
.fabout p{margin:0;max-width:360px;line-height:1.55}
.fbottom{max-width:1280px;margin:0 auto;padding:14px 24px 24px;font-size:13px;border-top:1px solid var(--line)}
/* телефон и планшет */
@media(max-width:900px){
  .top-in{flex-wrap:wrap;gap:10px 12px;padding:8px 16px}
  .menubtn{display:block}
  .search{order:3;flex-basis:100%;max-width:none}
  .mainnav{display:none;order:4;flex:0 0 calc(100% + 32px);flex-direction:column;margin:0 -16px -8px;border-top:1px solid var(--ink2)}
  .mainnav a:last-child{border-bottom:0}
  .top.open .mainnav{display:flex}
  .mainnav a{padding:12px 16px;border-bottom:1px solid var(--ink2);font-size:16px}
  .mainnav a[aria-current]{box-shadow:inset 3px 0 0 var(--radar)}
  .phead{grid-template-columns:minmax(0,1fr);gap:14px}
  section.keyshome{scroll-margin-top:124px}
}
@media(max-width:720px){
  main{padding:12px 16px 40px}
  h1{font-size:22px}
  /* палец: 44px на всё нажимаемое, 16px в полях — иначе iOS увеличивает страницу при фокусе */
  .search input{height:44px;font-size:16px}
  .calc input{height:44px}
  section.keyshome{scroll-margin-top:130px}
  a.buy,.cta{display:inline-flex;align-items:center;justify-content:center;min-height:44px}
  .chips a{display:inline-flex;align-items:center;min-height:44px}
  .catbar button,.seg button,.showmore,.cookie button{min-height:44px}
  .sortsel select{min-height:44px;font-size:16px}
  .catbar{flex-wrap:nowrap;overflow-x:auto;margin:4px -16px 12px;padding:0 16px;scrollbar-width:none}
  .catbar::-webkit-scrollbar{display:none}
  .catbar button{flex:0 0 auto}
  .grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:16px 10px}
  .sgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ofilters{flex-direction:column;align-items:flex-start}
  .seg{max-width:100%;overflow-x:auto}
  .seg button{white-space:nowrap}
  table.offers,.offers tbody{display:block}
  .offers thead{display:none}
  .offers tr{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:6px 10px;
    padding:10px 12px;border-bottom:1px solid var(--line)}
  .offers tr:last-child{border-bottom:0}
  .offers td{padding:0;border:0}
  .offers .nm{grid-column:1/-1}
  .offers .sv{width:auto;min-width:0}
  .offers .sr{white-space:normal}
  .calc,.reqs .rgrid{grid-template-columns:1fr}
  .tartable,.tartable tbody{display:block}
  .tartable thead{display:none}
  .tartable tr{display:grid;grid-template-columns:1fr 1fr;gap:4px 12px;padding:10px 12px;border-bottom:1px solid var(--line)}
  .tartable tr:last-child{border-bottom:0}
  .tartable td{padding:0;border:0;white-space:normal}
  .tartable .tn{grid-column:1/-1;font-size:15.5px}
  .tartable td[data-l]::before{content:attr(data-l);display:block;font-size:12px;color:var(--mut)}
  .tartable .pm{display:block;margin:0}
  .fcols{grid-template-columns:1fr 1fr}
  .fabout{grid-column:1/-1}
}
@media(max-width:420px){.sgrid{grid-template-columns:minmax(0,1fr)}}
