/* Витрина /steam/ (hub_page.py). Подключается поверх game.css только на витрине. */
/* ── витрина /steam/: шапка с коллажем обложек ── */
.hb-hero{background:#0E1015}
.hb-col{position:absolute;inset:-20px -40px;display:grid;grid-template-columns:repeat(6,1fr);gap:10px;transform:rotate(-4deg) scale(1.08);opacity:.5;pointer-events:none}
.hb-col img{width:100%;aspect-ratio:460/215;object-fit:cover;border-radius:10px;display:block}
.hb-hero::after{background:linear-gradient(90deg,#14161C 0%,rgba(20,22,28,.93) 38%,rgba(20,22,28,.55) 100%),linear-gradient(0deg,rgba(20,22,28,.9) 0%,transparent 55%);opacity:1}
.hb-hero .h2-in,.hb-hero .h2-strip{position:relative;z-index:1}
.hb-hero .h2-strip{background:rgba(10,11,15,.6)}
.hb-hero h1{font-size:clamp(34px,4.4vw,52px)}
@media(max-width:700px){.hb-col{grid-template-columns:repeat(3,1fr)}}

.hb-find{background:rgba(20,22,28,.55);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.hb-q{display:flex;align-items:center;gap:10px;height:50px;padding:0 6px 0 14px;border-radius:12px;background:#fff;color:#6B7280}
.hb-q input{flex:1;min-width:0;height:100%;border:0;outline:0;background:transparent;font:inherit;font-size:15px;color:#12141A}
.kit .gm .hb-q button{flex:none;height:38px;padding:0 16px;border:0;border-radius:9px;background:var(--ac);color:#fff;font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.hb-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.kit .gm .hb-chips a{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 11px;border-radius:9px;background:rgba(255,255,255,.1);
  color:#fff;font-size:13px;font-weight:500;text-decoration:none;border:1px solid rgba(255,255,255,.12)}
.kit .gm .hb-chips a:hover{background:rgba(255,255,255,.18)}
.hb-chips em{font-style:normal;font-family:var(--mono);font-size:11.5px;color:rgba(255,255,255,.6)}
.hb-hint{margin:12px 0 0;font-size:12.5px;color:rgba(255,255,255,.55)}

/* ── топ по онлайну ── */
.hb-top{display:grid}
.kit .gm a.hb-tr{display:grid;grid-template-columns:22px 64px minmax(0,1fr) 110px 86px 64px;align-items:center;gap:12px;padding:7px 0;text-decoration:none;color:inherit;border-radius:8px}
.kit .gm a.hb-tr:hover .nm b{color:var(--ac)}
.hb-tr .rk,.hb-sr .rk{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--dim);text-align:right}
.hb-tr img,.hb-sr img{width:64px;height:30px;object-fit:cover;border-radius:4px;display:block}
.hb-tr .nm,.hb-sr .nm{min-width:0}
.hb-tr .nm b,.hb-sr .nm b{display:block;font-size:14px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hb-tr .nm em,.hb-sr .nm em{display:block;font-style:normal;font-size:12px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hb-sp{width:110px;height:28px;display:block;overflow:visible}
.hb-sp polyline{fill:none;stroke-width:1.8;stroke-linejoin:round}
.hb-sp.is-up polyline{stroke:#2E9E5B}.hb-sp.is-down polyline{stroke:#D9574A}
.hb-tr .pl{font-family:var(--mono);font-size:14px;font-weight:600;color:var(--ink);text-align:right;font-variant-numeric:tabular-nums}
.hb-ch{font-family:var(--mono);font-size:12.5px;text-align:right;color:var(--dim)}
.hb-ch.is-up{color:#2E9E5B}.hb-ch.is-down{color:#D9574A}
@media(max-width:700px){.kit .gm a.hb-tr{grid-template-columns:18px 48px minmax(0,1fr) auto;row-gap:2px}.hb-tr img{width:48px;height:22px}
  .hb-sp{display:none}.hb-tr .ch,.hb-ch{grid-column:4}.hb-tr .pl{grid-column:4;grid-row:1}.hb-ch{grid-row:2;grid-column:3/5}}

/* ── скидки ── */
.hb-deals{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 16px}
.kit .gm a.hb-deal{display:flex;flex-direction:column;min-width:0;text-decoration:none;color:inherit}
.hb-deal .im,.hb-card .im{position:relative;display:block;aspect-ratio:460/215;border-radius:9px;overflow:hidden;background:var(--line2)}
.hb-deal img,.hb-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s}
.kit .gm a.hb-deal:hover img,.kit .gm a.hb-card:hover img{transform:scale(1.05)}
.hb-deal .im i,.hb-card .im i{position:absolute;left:8px;top:8px;padding:3px 8px;border-radius:7px;background:#4C8A1E;color:#EAF7C9;font-style:normal;font-size:13px;font-weight:700}
.hb-deal b{margin-top:8px;font-size:13.5px;font-weight:600;line-height:1.3;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit .gm a.hb-deal:hover b{color:var(--ac)}
.hb-deal .pr{display:flex;align-items:baseline;gap:8px;margin-top:3px;font-family:var(--mono);font-size:14px;font-weight:700;color:var(--ink)}
.hb-deal .pr s{font-size:12px;font-weight:400;color:var(--dim)}
.hb-deal .rv,.hb-card .rv{display:inline-flex;align-items:center;gap:5px;margin-top:4px;font-family:var(--mono);font-size:12.5px;color:var(--ink2)}
@media(max-width:1080px){.hb-deals{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.hb-deals{grid-template-columns:repeat(2,minmax(0,1fr))}}

.hb-count{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:12px;background:var(--ac2)}
.hb-count b{font-size:40px;line-height:1;font-weight:700;color:var(--ac);letter-spacing:-.03em}
.hb-count span{font-size:14px;font-weight:600;color:var(--ink);line-height:1.3}
.hb-count em{display:block;font-style:normal;font-weight:400;font-size:12.5px;color:var(--mut)}
.hb-evs{display:grid;gap:10px;margin-top:14px}
.hb-ev{display:grid;grid-template-columns:48px minmax(0,1fr);gap:12px;align-items:center}
.hb-ev .dt{display:grid;place-items:center;width:48px;height:50px;border-radius:10px;color:#fff;font-size:11px;line-height:1.1;text-transform:uppercase}
.hb-ev .dt b{font-size:19px;font-weight:700}
.hb-ev.is-sale .dt{background:var(--ac)}.hb-ev.is-fest .dt{background:#D98A2B}.hb-ev.is-demo .dt{background:#7C5CD6}
.hb-ev .tx b{display:block;font-size:14px;font-weight:600;color:var(--ink);line-height:1.3}
.hb-ev .tx em{display:block;font-style:normal;font-size:12.5px;color:var(--mut)}

/* ── лидеры продаж ── */
.hb-sales{display:grid}
.kit .gm a.hb-sr{display:grid;grid-template-columns:28px 64px minmax(0,1fr) 52px;gap:12px;align-items:center;padding:7px 0;text-decoration:none;color:inherit}
.kit .gm a.hb-sr:hover .nm b{color:var(--ac)}
.hb-sr .rk{font-size:17px;color:var(--ink)}
.hb-mv{font-family:var(--mono);font-size:13px;font-weight:600;text-align:right;color:var(--dim)}
.hb-mv.is-up{color:#2E9E5B}.hb-mv.is-down{color:#D9574A}
.hb-best .v{display:inline-flex;align-items:center;gap:5px}
.hb-best>div{grid-template-columns:minmax(0,13em) minmax(40px,1fr) auto}

/* ── новинки ── */
.hb-rel{margin-top:8px;font-size:12px;color:var(--ac);font-weight:600}
.gm-dg .hb-rel+b{margin-top:2px}

/* ── подборки и разделы ── */
.hb-sets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 16px}
.kit .gm a.hb-set{display:flex;flex-direction:column;min-width:0;text-decoration:none;color:inherit}
.hb-set .cv{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:3px;aspect-ratio:3/1.05;border-radius:10px;overflow:hidden;background:var(--line2)}
.hb-set .cv img{width:100%;height:100%;object-fit:cover;display:block}
.hb-set b{margin-top:9px;font-size:14px;font-weight:600;color:var(--ink);line-height:1.3}
.kit .gm a.hb-set:hover b{color:var(--ac)}
.hb-set em{margin-top:2px;font-style:normal;font-size:12.5px;color:var(--mut)}
.hb-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.kit .gm a.hb-tile{display:grid;grid-template-columns:42px minmax(0,1fr);grid-template-rows:auto auto;column-gap:12px;align-items:center;padding:14px;border-radius:12px;background:var(--page);text-decoration:none;color:inherit}
.hb-tile .ic{grid-row:1/3;display:grid;place-items:center;width:42px;height:42px;border-radius:11px;background:var(--ac2);color:var(--ac)}
.hb-tile b{font-size:14px;font-weight:600;color:var(--ink)}
.kit .gm a.hb-tile:hover b{color:var(--ac)}
.hb-tile em{font-style:normal;font-size:12.5px;color:var(--mut)}
@media(max-width:1080px){.hb-sets,.hb-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.hb-sets,.hb-tiles{grid-template-columns:1fr}}

/* ── каталог ── */
.hb-filter{display:grid;grid-template-columns:minmax(220px,1.4fr) minmax(150px,.7fr) auto minmax(150px,.7fr);gap:10px;align-items:end;margin-bottom:20px}
.hb-q--light{height:46px;background:var(--page);box-shadow:inset 0 0 0 1px var(--line)}
.hb-sel{display:grid;gap:4px;font-size:12px;color:var(--dim)}
.hb-sel select{height:46px;padding:0 12px;border:0;border-radius:12px;background:var(--page);box-shadow:inset 0 0 0 1px var(--line);font:inherit;font-size:14px;color:var(--ink)}
.hb-seg{display:flex;gap:3px;height:46px;padding:4px;border-radius:12px;background:var(--page);box-shadow:inset 0 0 0 1px var(--line)}
.kit .gm .hb-seg button{border:0;border-radius:9px;padding:0 12px;background:transparent;font:inherit;font-size:13.5px;color:var(--mut);cursor:pointer;white-space:nowrap}
.kit .gm .hb-seg button[aria-pressed="true"]{background:#fff;color:var(--ink);font-weight:600;box-shadow:0 1px 3px rgba(18,20,26,.12)}
@media(max-width:1080px){.hb-filter{grid-template-columns:1fr 1fr}.hb-seg{grid-column:1/-1;overflow-x:auto}}
@media(max-width:560px){.hb-filter{grid-template-columns:1fr}}
.hb-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 16px}
.kit .gm a.hb-card{position:relative;display:flex;flex-direction:column;min-width:0;text-decoration:none;color:inherit}
.hb-card b{margin-top:9px;font-size:14.5px;font-weight:600;line-height:1.3;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit .gm a.hb-card:hover b{color:var(--ac)}
.hb-card>em{font-style:normal;font-size:12px;color:var(--dim);margin-top:1px}
.hb-card .rv small{font-family:inherit;font-size:12px;color:var(--dim);margin-left:4px}
.hb-card .ft{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-top:6px}
.hb-card .pr{font-size:14px;font-weight:700;color:var(--ink)}
.hb-card .on{font-family:var(--mono);font-size:12.5px;color:var(--mut)}
.kit .gm .hb-card .pw-views--card{position:absolute;top:8px;right:8px;padding:3px 7px;border-radius:999px;background:rgba(20,22,28,.72);color:#fff;font-size:11.5px}
@media(max-width:1080px){.hb-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.hb-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}}
.hb-pager{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:26px}
.hb-pager a,.hb-pager span{display:grid;place-items:center;min-width:40px;height:40px;padding:0 12px;border-radius:10px;font-size:14px;color:var(--ink2);text-decoration:none}
.kit .gm .hb-pager a{background:var(--page);color:var(--ink2)}
.kit .gm .hb-pager a:hover{background:var(--ac2);color:var(--ac)}
.hb-pager span[aria-current]{background:var(--ink);color:#fff;font-weight:600}
.kit .gm .hb-pager a.nx{margin-left:auto;font-weight:600}

/* ── приложение: отличия от макета ── */
.hb-hero.is-lite .h2-in{padding-bottom:34px}
.hb-hero.is-lite h1{font-size:clamp(28px,3.6vw,42px)}
.hb-col img{background:#1d2029}
.hb-tr .ph,.hb-sr .ph{display:block;width:64px;height:30px;border-radius:4px;background:var(--line2)}
.hb-card .im .ph,.hb-deal .im .ph,.gm-dg .im .ph{display:grid;place-items:center;height:100%;font-size:34px;font-weight:700;color:var(--dim)}
span.hb-sp{display:block}
.kit .gm .hb-seg a{display:flex;align-items:center;border-radius:9px;padding:0 12px;background:transparent;font-size:13.5px;color:var(--mut);text-decoration:none;white-space:nowrap}
.kit .gm .hb-seg a:hover{color:var(--ink)}
.kit .gm .hb-seg a[aria-current]{background:#fff;color:var(--ink);font-weight:600;box-shadow:0 1px 3px rgba(18,20,26,.12)}
.hb-grid[aria-busy]{opacity:.55;transition:opacity .15s}
.hb-empty{grid-column:1/-1;margin:8px 0;font-size:15px;color:var(--ink2)}
.hb-pager:empty{display:none}
.hb-pager .gap{min-width:24px;padding:0;color:var(--dim)}
.kit .gm .hb-pager a.pv{font-weight:600}
.kit .gm .hb-go{height:46px;padding:0 18px;border:0;border-radius:12px;background:var(--ac);color:#fff;font:inherit;font-size:14px;font-weight:600}
@media(max-width:560px){.hb-pager .gap,.hb-pager a[data-page]:not(.pv):not(.nx){display:none}}
.hb-card>em{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hb-card .rv{flex-wrap:wrap;row-gap:0}
.hb-card .rv small{white-space:nowrap}
.hb-card .ft>span{white-space:nowrap}
@media(max-width:700px){
  .hb-card .ft{flex-direction:column;align-items:flex-start;gap:1px}
  .hb-card .rv small{flex-basis:100%;margin-left:0}
}
@media(max-width:560px){.hb-sets{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 12px}.hb-set b{font-size:13.5px}}

/* ── страница цен /steam/prices/ (prices_page.py) ── */
.pp-dls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px}
.kit .gm a.pp-dl,.kit .gm a.pp-ex{display:grid;grid-template-columns:64px minmax(0,1fr) auto 50px;gap:12px;align-items:center;padding:7px 0;text-decoration:none;color:inherit}
.pp-dl img,.pp-ex img{width:64px;height:30px;object-fit:cover;border-radius:4px;display:block}
.pp-dl .ph,.pp-ex .ph{display:block;width:64px;height:30px;border-radius:4px;background:var(--line2)}
.pp-dl .nm,.pp-ex .nm,.pp-row .nm{min-width:0}
.pp-dl .nm b,.pp-ex .nm b,.pp-row .nm b{display:block;font-size:14px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit .gm a.pp-dl:hover .nm b,.kit .gm a.pp-ex:hover .nm b,.kit .gm a.pp-row:hover .nm b{color:var(--ac)}
.pp-dl .nm em,.pp-ex .nm em,.pp-row .nm em{display:flex;align-items:center;gap:4px;font-style:normal;font-size:12px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pp-dl .pc,.pp-row .pc{display:flex;flex-direction:column;align-items:flex-end;font-family:var(--mono);line-height:1.25}
.pp-dl .pc s,.pp-row .pc s{font-size:12px;color:var(--dim)}
.pp-dl .pc b,.pp-row .pc b{font-size:14.5px;font-weight:700;color:var(--ink);white-space:nowrap}
.pp-dl>i,.pp-row .ds i{justify-self:end;padding:3px 7px;border-radius:7px;background:#4C8A1E;color:#EAF7C9;font-style:normal;font-size:13px;font-weight:700;white-space:nowrap}
.pp-cc .n{display:flex;align-items:center;gap:8px}
.pp-cc .gm-fl,.pp-ex .gm-fl{flex:none;border-radius:2px;box-shadow:0 0 0 1px rgba(18,20,26,.08)}
.kit .gm a.pp-ex{grid-template-columns:64px minmax(0,1fr) 96px 96px}
.pp-ex .lo,.pp-ex .hi{display:inline-flex;align-items:center;justify-content:flex-end;gap:6px;font-family:var(--mono);font-size:13px;font-weight:600;white-space:nowrap}
.pp-ex .lo{color:#2E9E5B}.pp-ex .hi{color:var(--bad)}
.pp-exh{display:grid;grid-template-columns:64px minmax(0,1fr) 96px 96px;gap:12px;margin-bottom:2px;font-size:12px;color:var(--dim)}
.pp-exh span:first-child{grid-column:1/3}
.pp-exh span:not(:first-child){text-align:right}
.pp-filter{grid-template-columns:minmax(220px,1.4fr) repeat(3,minmax(130px,.6fr))}
.pp-filter .hb-seg{grid-column:1/-1;justify-self:start}
.kit .gm a.pp-row{display:grid;grid-template-columns:30px 88px minmax(0,1fr) 150px 110px 58px 112px;gap:14px;align-items:center;margin:0 -10px;padding:8px 10px;border-radius:10px;text-decoration:none;color:inherit}
.kit .gm a.pp-row:hover{background:var(--page)}
.pp-row .rk{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--dim);text-align:right}
.pp-row img,.pp-row .ph{width:88px;height:41px;object-fit:cover;border-radius:5px;display:block;background:var(--line2)}
.pp-row .ph{display:grid;place-items:center;font-weight:700;color:var(--dim)}
.pp-row .rv{display:inline-flex;align-items:center;gap:5px;font-family:var(--mono);font-size:13px;color:var(--ink2);white-space:nowrap}
.pp-row .rv small,.pp-row .on small{font-size:12px;color:var(--dim)}
.pp-row .on{font-family:var(--mono);font-size:13px;color:var(--ink2);text-align:right;white-space:nowrap}
.pp-row .on small{display:block;font-family:inherit}
.pp-row .ds{text-align:right}
.pp-list[aria-busy]{opacity:.55;transition:opacity .15s}
@media(max-width:1080px){.pp-filter{grid-template-columns:1fr 1fr}.kit .gm a.pp-row{grid-template-columns:26px 72px minmax(0,1fr) 130px 56px 104px}.pp-row .on{display:none}.pp-row img,.pp-row .ph{width:72px;height:34px}}
@media(max-width:900px){.pp-dls{grid-template-columns:1fr}}
@media(max-width:700px){
  .kit .gm a.pp-row{grid-template-columns:60px minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:10px;row-gap:2px;margin:0 -6px;padding:8px 6px}
  .pp-row .rk{display:none}
  .pp-row img,.pp-row .ph{grid-row:1/3;width:60px;height:28px}
  .pp-row .nm{grid-column:2;grid-row:1}.pp-row .pc{grid-column:3;grid-row:1}
  .pp-row .rv{grid-column:2;grid-row:2;font-size:12px}.pp-row .ds{grid-column:3;grid-row:2}
  .pp-row .ds i{font-size:12px;padding:2px 6px}
  .pp-row .pc s{display:none}
  .pp-row .nm em{display:none}
  .kit .gm a.pp-dl{grid-template-columns:48px minmax(0,1fr) auto 46px;gap:10px}.pp-dl img,.pp-dl .ph{width:48px;height:22px}
  .kit .gm a.pp-ex,.pp-exh{grid-template-columns:minmax(0,1fr) auto auto;gap:10px}
  .pp-ex img,.pp-ex .ph{display:none}.pp-exh span:first-child{grid-column:1}
  .pp-ex .lo,.pp-ex .hi{font-size:12px;gap:4px}
  .pp-hist+.hist-x span{white-space:normal;overflow:visible;font-size:10.5px;line-height:1.25}
}
@media(max-width:560px){.pp-filter{grid-template-columns:1fr}.pp-filter .hb-seg{justify-self:stretch}}

.pp-cheap .pr{font-family:var(--mono);font-weight:700;color:var(--ink)}

/* ── топ по онлайну /steam/top/ (top_page.py) ── */
.tp-hist{gap:3px;height:190px}
.tp-hist b{font-size:11.5px;white-space:nowrap}
.tp-hx{gap:3px}
.tp-hx span{overflow:visible;font-size:11px}
.tp-strip .in>div b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.tp-lg{height:16px}
.tp-lgl{grid-template-columns:1fr;gap:7px}
.tp-lgl b{font-weight:500;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.tp-mv>i{background:#E3F2E8;color:#1F7A45}
.tp-mv>i.is-down{background:#FBE9E7;color:#B8412F}
.kit .gm a.tp-mv{grid-template-columns:64px minmax(0,1fr) auto 64px}
.tp-mv>i{justify-self:end;text-align:center;min-width:56px}
.kit .gm a.tp-row{display:grid;grid-template-columns:30px 88px minmax(0,1fr) 120px 128px 150px 100px;gap:14px;align-items:center;margin:0 -10px;padding:8px 10px;border-radius:10px;text-decoration:none;color:inherit}
.kit .gm a.tp-row:hover{background:var(--page)}
.tp-row .rk{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--dim);text-align:right}
.tp-row img,.tp-row .ph{width:88px;height:41px;object-fit:cover;border-radius:5px;display:block;background:var(--line2)}
.tp-row .ph{display:grid;place-items:center;font-weight:700;color:var(--dim)}
.tp-row .nm{min-width:0}
.tp-row .nm b{display:block;font-size:14px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit .gm a.tp-row:hover .nm b{color:var(--ac)}
.tp-row .nm em{display:block;font-style:normal;font-size:12px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tp-row .sp{display:flex;flex-direction:column;gap:2px}
.tp-row .sp .hb-sp{width:120px;height:26px}
.tp-row small{font-size:11.5px;color:var(--dim);white-space:nowrap}
.tp-row .pl{display:flex;flex-direction:column;align-items:flex-end;font-family:var(--mono)}
.tp-row .pl b{font-size:15px;font-weight:700;color:var(--ink)}
.tp-row .pl small.is-up{color:#2E9E5B}.tp-row .pl small.is-down{color:#D9574A}
.tp-row .rv{display:inline-flex;align-items:center;gap:5px;font-family:var(--mono);font-size:13px;color:var(--ink2);white-space:nowrap}
.tp-row .pc{text-align:right;font-size:13.5px;font-weight:600;color:var(--ink);white-space:nowrap}
.tp-filter{grid-template-columns:minmax(220px,1.4fr) auto minmax(150px,.6fr) minmax(150px,.6fr)}
@media(max-width:1080px){.tp-filter{grid-template-columns:1fr 1fr}.tp-filter .hb-seg{grid-column:1/-1;justify-self:start}
  .kit .gm a.tp-row{grid-template-columns:26px 72px minmax(0,1fr) 128px 140px}.tp-row .sp,.tp-row .pc{display:none}.tp-row img,.tp-row .ph{width:72px;height:34px}}
@media(max-width:700px){
  .kit .gm a.tp-row{grid-template-columns:60px minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:10px;row-gap:2px;margin:0 -6px;padding:8px 6px}
  .tp-row .rk{display:none}
  .tp-row img,.tp-row .ph{grid-row:1/3;width:60px;height:28px}
  .tp-row .nm{grid-column:2;grid-row:1}.tp-row .pl{grid-column:3;grid-row:1/3}
  .tp-row .rv{grid-column:2;grid-row:2;font-size:12px}
  .tp-row .nm em{display:none}
  .tp-hist b{font-size:10px}
  .kit .gm a.tp-mv{grid-template-columns:48px minmax(0,1fr) auto 58px;gap:10px}
}
@media(max-width:560px){.tp-filter{grid-template-columns:1fr}.tp-filter .hb-seg{justify-self:stretch}}
.tp-hist div:first-child b{align-self:flex-start}
.tp-hist div:last-child b{align-self:flex-end}

/* ── лучшие по отзывам /steam/reviews/ (reviews_page.py) ── */
.rw-big b{display:inline-flex;align-items:center;gap:14px}
.kit .gm .rw-big b .gm-smile{flex:none;width:54px;height:54px}
.rw-card .rv strong{font-size:15px;font-weight:700;color:var(--ink)}
.rw-card>em{margin-top:1px;font-style:normal;font-size:12px;color:var(--dim)}
.rw-sc .n{display:flex;align-items:center;gap:7px}
.rw-sc .n .gm-smile{flex:none}
.rw-rl>i{justify-self:end;min-width:56px;text-align:center;background:#E3F2E8;color:#1F7A45}
.rw-rl>i.is-down{background:#FBE9E7;color:#B8412F}
.kit .gm a.rw-rl{grid-template-columns:64px minmax(0,1fr) auto 64px}
.kit .gm a.rw-row{display:grid;grid-template-columns:30px 88px minmax(0,1fr) 250px 90px 96px 96px;gap:14px;align-items:center;margin:0 -10px;padding:8px 10px;border-radius:10px;text-decoration:none;color:inherit}
.kit .gm a.rw-row:hover{background:var(--page)}
.rw-row .rk{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--dim);text-align:right}
.rw-row img,.rw-row .ph{width:88px;height:41px;object-fit:cover;border-radius:5px;display:block;background:var(--line2)}
.rw-row .ph{display:grid;place-items:center;font-weight:700;color:var(--dim)}
.rw-row .nm{min-width:0}
.rw-row .nm b{display:block;font-size:14px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit .gm a.rw-row:hover .nm b{color:var(--ac)}
.rw-row .nm em{display:block;font-style:normal;font-size:12px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rw-row small{font-size:11.5px;color:var(--dim);white-space:nowrap}
.rw-row .mt{display:flex;flex-direction:column;gap:5px;min-width:0}
.rw-row .bar{position:relative;height:6px;border-radius:4px;background:var(--line2);overflow:hidden}
.rw-row .bar i{position:absolute;inset:0 auto 0 0;border-radius:4px;background:var(--ac);opacity:.42}
.rw-row .lb{display:flex;align-items:center;gap:6px;min-width:0}
.rw-row .lb b{font-family:var(--mono);font-size:14px;font-weight:700;color:var(--ink)}
.rw-row .lb small{overflow:hidden;text-overflow:ellipsis;font-size:12px}
.rw-row .lb small.is-high{color:#2E7D4F}.rw-row .lb small.is-mid{color:#A8741A}.rw-row .lb small.is-low{color:#B8412F}
.rw-row .ct,.rw-row .on{display:flex;flex-direction:column;align-items:flex-end;font-family:var(--mono);font-size:13.5px;color:var(--ink);white-space:nowrap}
.rw-row .ct small,.rw-row .on small{font-family:inherit}
.rw-row .pc{text-align:right;font-size:13.5px;font-weight:600;color:var(--ink);white-space:nowrap}
@media(max-width:1080px){.kit .gm a.rw-row{grid-template-columns:26px 72px minmax(0,1fr) 210px 80px}.rw-row .on,.rw-row .pc{display:none}.rw-row img,.rw-row .ph{width:72px;height:34px}}
@media(max-width:700px){
  .kit .gm a.rw-row{grid-template-columns:60px minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:10px;row-gap:3px;margin:0 -6px;padding:8px 6px}
  .rw-row .rk{display:none}
  .rw-row img,.rw-row .ph{grid-row:1/3;width:60px;height:28px}
  .rw-row .nm{grid-column:2/4;grid-row:1}.rw-row .nm em{display:none}
  .rw-row .mt{grid-column:2;grid-row:2}.rw-row .bar{display:none}
  .rw-row .ct{grid-column:3;grid-row:2;flex-direction:row;gap:4px;align-items:baseline;font-size:12px}
  .kit .gm a.rw-rl{grid-template-columns:48px minmax(0,1fr) auto 56px;gap:10px}
  .rw-big b{gap:10px}.kit .gm .rw-big b .gm-smile{width:38px;height:38px}
  .rw-row .lb small{display:none}
}

/* ── лидеры продаж /steam/bestsellers/ (sales_page.py) ── */
.bs-big b{font-size:clamp(48px,6vw,72px)}
.bs-big span strong{display:block;font-size:20px;font-weight:700;color:#fff;margin-bottom:2px}
.bs-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.kit .gm a.bs-card{display:flex;flex-direction:column;min-width:0;text-decoration:none;color:inherit}
.bs-card .im{position:relative;display:block;aspect-ratio:460/215;border-radius:10px;overflow:hidden;background:var(--line2)}
.bs-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s}
.kit .gm a.bs-card:hover img{transform:scale(1.05)}
.bs-card .im i{position:absolute;left:8px;top:8px;padding:4px 10px;border-radius:8px;background:rgba(20,22,28,.82);color:#fff;font-style:normal;font-family:var(--mono);font-size:15px;font-weight:700}
.bs-card b{margin-top:9px;font-size:15px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit .gm a.bs-card:hover b{color:var(--ac)}
.bs-card .pr{margin-top:2px;font-size:13px;color:var(--ink2)}
.bs-card .rv{display:inline-flex;align-items:center;gap:5px;margin-top:4px;font-family:var(--mono);font-size:12.5px;color:var(--ink2);min-height:18px}
.bs-card em{margin-top:4px;font-style:normal;font-size:12.5px;color:var(--ac);font-weight:600}
.bs-mv{justify-self:end;min-width:52px;padding:3px 7px;border-radius:7px;background:var(--line2);color:var(--mut);font-style:normal;font-family:var(--mono);font-size:12.5px;font-weight:700;text-align:center;white-space:nowrap}
.bs-mv.is-up{background:#E3F2E8;color:#1F7A45}.bs-mv.is-down{background:#FBE9E7;color:#B8412F}.bs-mv.is-new{background:var(--ac2);color:var(--ac)}
.kit .gm a.bs-rl{grid-template-columns:64px minmax(0,1fr) auto 62px}
.bs-pos{flex-direction:row!important;align-items:center!important;gap:10px}
.bs-pos .hb-sp{width:70px;height:22px}
.bs-pos b{min-width:34px;text-align:right}
.bs-filter{grid-template-columns:minmax(220px,1.4fr) auto minmax(150px,.6fr)}
.kit .gm a.bs-row{display:grid;grid-template-columns:62px 88px minmax(0,1fr) 140px 100px 58px 112px;gap:14px;align-items:center;margin:0 -10px;padding:8px 10px;border-radius:10px;text-decoration:none;color:inherit}
.kit .gm a.bs-row:hover{background:var(--page)}
.bs-row .rk{display:flex;flex-direction:column;align-items:center;gap:3px}
.bs-row .rk>b{font-family:var(--mono);font-size:17px;font-weight:700;color:var(--ink)}
.bs-row .rk .bs-mv{min-width:0;padding:1px 6px;font-size:11px}
.bs-row img,.bs-row .ph{width:88px;height:41px;object-fit:cover;border-radius:5px;display:block;background:var(--line2)}
.bs-row .ph{display:grid;place-items:center;font-weight:700;color:var(--dim)}
.bs-row .nm{min-width:0}
.bs-row .nm b{display:block;font-size:14px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit .gm a.bs-row:hover .nm b{color:var(--ac)}
.bs-row .nm em{display:block;font-style:normal;font-size:12px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bs-row small{font-size:11.5px;color:var(--dim);white-space:nowrap}
.bs-row .rv{display:inline-flex;align-items:center;gap:5px;font-family:var(--mono);font-size:13px;color:var(--ink2);white-space:nowrap}
.bs-row .on{display:flex;flex-direction:column;align-items:flex-end;font-family:var(--mono);font-size:13px;color:var(--ink2);white-space:nowrap}
.bs-row .on small{font-family:inherit}
.bs-row .ds{text-align:right}
.bs-row .ds i{padding:3px 7px;border-radius:7px;background:#4C8A1E;color:#EAF7C9;font-style:normal;font-size:13px;font-weight:700;white-space:nowrap}
.bs-row .pc{display:flex;flex-direction:column;align-items:flex-end;font-family:var(--mono);line-height:1.25}
.bs-row .pc s{font-size:12px;color:var(--dim)}
.bs-row .pc b{font-size:14px;font-weight:700;color:var(--ink);white-space:nowrap}
@media(max-width:1080px){.bs-filter{grid-template-columns:1fr 1fr}.bs-filter .hb-seg{grid-column:1/-1;justify-self:start}
  .kit .gm a.bs-row{grid-template-columns:54px 72px minmax(0,1fr) 130px 58px 104px}.bs-row .on{display:none}.bs-row img,.bs-row .ph{width:72px;height:34px}}
@media(max-width:700px){
  .bs-cards{grid-template-columns:1fr 1fr}.bs-cards .bs-card:first-child{grid-column:1/-1}
  .kit .gm a.bs-row{grid-template-columns:44px 56px minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:10px;row-gap:2px;margin:0 -6px;padding:8px 6px}
  .bs-row .rk{grid-row:1/3}
  .bs-row img,.bs-row .ph{grid-row:1/3;width:56px;height:26px}
  .bs-row .nm{grid-column:3;grid-row:1}.bs-row .pc{grid-column:4;grid-row:1}
  .bs-row .rv{grid-column:3;grid-row:2;font-size:12px}.bs-row .ds{grid-column:4;grid-row:2}
  .bs-row .nm em,.bs-row .pc s{display:none}
  .bs-row .ds i{font-size:12px;padding:2px 6px}
  .kit .gm a.bs-rl{grid-template-columns:48px minmax(0,1fr) auto 54px;gap:10px}.bs-pos .hb-sp{display:none}
  .bs-big span strong{font-size:17px}
}
@media(max-width:560px){.bs-filter{grid-template-columns:1fr}.bs-filter .hb-seg{justify-self:stretch}}

/* ── бесплатные игры /steam/free/ (free_page.py) ── */
.kit .gm a.fr-ol{grid-template-columns:20px 64px minmax(0,1fr) auto 84px}
.fr-ol .rk{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--dim);text-align:right}
.fr-rt{justify-self:end;display:inline-flex;align-items:center;justify-content:center;gap:4px;min-width:74px;padding:3px 7px;border-radius:7px;background:var(--line2);color:var(--ink2);font-style:normal;font-family:var(--mono);font-size:12px;font-weight:700;white-space:nowrap}
.fr-rt .gm-smile{width:14px;height:14px}
.kit .gm a.rw-row.fr-row{grid-template-columns:30px 88px minmax(0,1fr) 250px 90px 110px}
@media(max-width:1080px){.kit .gm a.rw-row.fr-row{grid-template-columns:26px 72px minmax(0,1fr) 210px 80px 90px}.fr-row .on{display:flex}}
@media(max-width:700px){.kit .gm a.rw-row.fr-row{grid-template-columns:60px minmax(0,1fr) auto}.fr-row .on{display:none}.kit .gm a.fr-ol{grid-template-columns:48px minmax(0,1fr) auto 70px;gap:10px}.fr-ol .rk{display:none}.fr-ol img,.fr-ol .ph{width:48px;height:22px}
  .fr-hist b{font-size:9.5px}}
.pp-dl>i.fr-rt{background:var(--line2);color:var(--ink2)}

/* ── хаб подборок /steam/collections/ (collections_page.py) ── */
.cl-sets{grid-template-columns:repeat(3,minmax(0,1fr))}
.cl-cal{display:grid;grid-template-columns:repeat(3,1fr);gap:3px}
.cl-dt{display:grid;place-items:center;align-content:center;color:#fff;font-size:12px;text-transform:uppercase;line-height:1.1;background:var(--ac)}
.cl-dt b{font-size:26px;font-weight:700}
.cl-dt.is-fest{background:#D98A2B}.cl-dt.is-demo{background:#7C5CD6}
.cl-rows .v .s.is-up{color:#2E9E5B}.cl-rows .v .s.is-down{color:#D9574A}
.kit .gm .cl-rows a.n{color:var(--ink2);text-decoration:none}
.kit .gm .cl-rows a.n:hover{color:var(--ac)}
.cl-best>div{grid-template-columns:minmax(0,12em) minmax(0,1fr) auto}
.kit .gm .cl-best a.g{min-width:0;font-size:13.5px;font-weight:600;color:var(--ink);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit .gm .cl-best a.g:hover{color:var(--ac)}
.cl-best .v{display:inline-flex;align-items:center;gap:5px}
.cl-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 18px}
.cl-card{min-width:0;display:flex;flex-direction:column}
.cl-card .cv{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;aspect-ratio:3/1.05;border-radius:10px;overflow:hidden;background:var(--line2)}
.cl-card .cv img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s}
.cl-card .cv:hover img{transform:scale(1.04)}
.kit .gm .cl-card h3{margin:11px 0 0;font-size:16px;font-weight:600;line-height:1.3}
.kit .gm .cl-card h3 a{color:var(--ink);text-decoration:none}
.kit .gm .cl-card h3 a:hover{color:var(--ac)}
.cl-facts{margin:3px 0 0;font-size:12.5px;color:var(--mut)}
.cl-lead{margin:6px 0 0;font-size:13px;color:var(--ink2)}
.kit .gm .cl-lead a{color:var(--ink);font-weight:600;text-decoration:none}
.kit .gm .cl-lead a:hover{color:var(--ac)}
.cl-links{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.kit .gm .cl-links a{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border-radius:8px;background:var(--page);color:var(--ink2);font-size:12.5px;font-weight:500;text-decoration:none;white-space:nowrap}
.kit .gm .cl-links a:hover{background:var(--ac2);color:var(--ac)}
.cl-links em{font-style:normal;font-family:var(--mono);font-size:11.5px;color:var(--dim)}
.cl-grs{display:grid}
.cl-gr{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) auto;gap:18px;align-items:center;padding:12px 0}
.cl-gr .nm b{display:block;font-size:15px;font-weight:600}
.kit .gm .cl-gr .nm b a{color:var(--ink);text-decoration:none}
.kit .gm .cl-gr .nm b a:hover{color:var(--ac)}
.cl-gr em{display:block;font-style:normal;font-size:12px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cl-gr .pl{display:grid;grid-template-columns:minmax(40px,1fr) auto;column-gap:10px;align-items:center;min-width:0}
.cl-gr .pl .t{height:9px;border-radius:5px;background:var(--line2);position:relative}
.cl-gr .pl .t i{position:absolute;inset:0 auto 0 0;border-radius:5px;background:var(--ac);opacity:.42}
.cl-gr .pl .v{font-family:var(--mono);font-size:13px;color:var(--ink);white-space:nowrap}
.cl-gr .pl em{grid-column:1/-1;margin-top:3px}
.cl-gr .cl-links{margin-top:0;justify-content:flex-end}
@media(max-width:1080px){.cl-cards,.cl-sets{grid-template-columns:repeat(2,minmax(0,1fr))}.cl-gr{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.cl-gr .cl-links{grid-column:1/-1;justify-content:flex-start}}
@media(max-width:700px){.cl-cards{grid-template-columns:1fr}.cl-sets{grid-template-columns:repeat(2,minmax(0,1fr))}.cl-gr{grid-template-columns:1fr;gap:8px}.cl-best>div{grid-template-columns:minmax(0,1fr) auto;row-gap:1px}.cl-best .n{grid-column:1/-1;font-size:12px;color:var(--dim)}.cl-card .cv{aspect-ratio:3/.8}}

/* ── коллекционные карточки /steam/cards/ (cards_page.py) ── */
.cd-col{grid-template-columns:repeat(8,1fr)}
.cd-col img{aspect-ratio:224/261}
.kit .gm a.cd-rl{grid-template-columns:36px minmax(0,1fr) auto}
.cd-rl .th img{width:36px;height:42px;object-fit:cover;border-radius:4px;display:block}
.cd-sets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 16px}
.kit .gm a.cd-set{display:flex;flex-direction:column;min-width:0;text-decoration:none;color:inherit}
.cd-set .cv{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:10px;border-radius:12px;background:var(--page)}
.cd-set .cv img{width:100%;aspect-ratio:224/261;object-fit:cover;border-radius:6px;display:block;box-shadow:0 2px 6px rgba(18,20,26,.15);transition:transform .2s}
.kit .gm a.cd-set:hover .cv img{transform:translateY(-3px)}
.cd-set b{margin-top:9px;font-size:14px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit .gm a.cd-set:hover b{color:var(--ac)}
.cd-set em{font-style:normal;font-size:12px;color:var(--dim)}
.cd-set .pr{margin-top:3px;font-family:var(--mono);font-size:12.5px;color:var(--ink2)}
.cd-all{margin-top:18px}
.cd-all .body{padding-top:10px}
.cd-filter{grid-template-columns:minmax(240px,1fr) auto}
.cd-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:22px 14px}
.kit .gm a.cd-tile{display:flex;flex-direction:column;min-width:0;text-decoration:none;color:inherit}
.cd-tile .im{display:block;border-radius:10px;overflow:hidden;background:var(--line2)}
.cd-tile .im img{width:100%;height:auto;aspect-ratio:224/261;object-fit:cover;display:block;transition:transform .2s}
.kit .gm a.cd-tile:hover .im img{transform:scale(1.04)}
.cd-tile.is-foil .im{box-shadow:0 0 0 2px #C9A64B}
.cd-tile .ed{margin-top:8px;font-style:normal;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--dim)}
.cd-tile.is-foil .ed{color:#A8741A}
.cd-tile b{margin-top:1px;font-size:13.5px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit .gm a.cd-tile:hover b{color:var(--ac)}
.cd-tile .gm{font-size:12px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cd-tile .pr{margin-top:3px;font-family:var(--mono);font-size:13px;font-weight:700;color:var(--ink)}
#hbGrid[aria-busy] .cd-grid{opacity:.55}
@media(max-width:1080px){.cd-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.cd-sets{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.cd-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}.cd-filter{grid-template-columns:1fr}.cd-col{grid-template-columns:repeat(4,1fr)}}

/* ── страницы подборок /steam/collections/<slug>/ (collection_page.py) ── */
.kit .gm .cl-crit a[aria-current]{background:#fff;color:#12141A;border-color:#fff}
.kit .gm .cl-crit a[aria-current] em{color:#6B7280}
.cl-filter.cl-f1{grid-template-columns:minmax(240px,1fr) minmax(170px,.4fr) auto}
.cl-filter.cl-f2{grid-template-columns:minmax(220px,1.3fr) repeat(2,minmax(150px,.6fr)) auto}
.cl-filter.cl-f3{grid-template-columns:minmax(220px,1.4fr) repeat(3,minmax(130px,.6fr))}
.cl-filter .hb-seg{justify-self:start}
.cl-filter.cl-f3 .hb-seg{grid-column:1/-1}
@media(max-width:1080px){.cl-filter.cl-f1,.cl-filter.cl-f2,.cl-filter.cl-f3{grid-template-columns:1fr 1fr}.cl-filter .hb-seg{grid-column:1/-1}}
@media(max-width:560px){.cl-filter.cl-f1,.cl-filter.cl-f2,.cl-filter.cl-f3{grid-template-columns:1fr}.cl-filter .hb-seg{justify-self:stretch}}

/* ── карточка и набор /steam/cards/<key>/, /steam/cards/game/<aid>/ (card_page.py) ── */
.cp-hero .h2-row{align-items:center}
.cp-art{display:flex;flex-direction:column;align-items:center;gap:16px;max-width:320px;justify-self:end}
.cp-art .im{display:block;width:224px;border-radius:14px;overflow:hidden;box-shadow:0 18px 40px rgba(0,0,0,.45);transition:transform .2s}
.cp-art .im:hover{transform:translateY(-3px) rotate(-1deg)}
.cp-art .im.is-foil{box-shadow:0 0 0 2px #C9A64B,0 18px 40px rgba(0,0,0,.45)}
.cp-art .im img{width:100%;height:auto;aspect-ratio:224/261;object-fit:cover;display:block}
.cp-btns{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.kit .gm .cp-btns a.gm-b{height:38px;padding:0 14px;font-size:13.5px}
.cp-set{max-width:360px;justify-self:end}
.cp-fan{display:flex;justify-content:center;margin:4px 0 14px}
.cp-fan img{width:78px;height:auto;aspect-ratio:224/261;object-fit:cover;border-radius:8px;box-shadow:0 8px 20px rgba(0,0,0,.4)}
.cp-fan img:nth-child(1){transform:rotate(-9deg) translate(14px,6px)}
.cp-fan img:nth-child(2){position:relative;z-index:1}
.cp-fan img:nth-child(3){transform:rotate(9deg) translate(-14px,6px)}
.cp-line{display:flex;justify-content:space-between;gap:12px;margin:0;padding:8px 0;border-top:1px solid rgba(255,255,255,.12);font-size:13.5px;color:rgba(255,255,255,.7)}
.cp-line b{font-family:var(--mono);color:#fff;white-space:nowrap}
.cp-set .cp-btns{margin-top:12px;justify-content:flex-start}
.cp-book .n{font-family:var(--mono);font-size:13px;color:var(--ink)}
.cp-csv{margin-top:14px}
@media(max-width:700px){.cp-art,.cp-set{justify-self:stretch;max-width:none}.cp-art .im{width:180px}}

/* ── календарь распродаж /steam/sales-calendar/ (calendar_page.py) ── */
.dsh.gm{--brand:var(--ac);--brand-bg:var(--ac2);--border:var(--line);--muted:var(--mut)}
.cl-panel{max-width:380px;justify-self:end}
.kit .gm a.cl-now{display:grid;grid-template-columns:92px minmax(0,1fr);gap:12px;align-items:center;padding:8px 0;border-top:1px solid rgba(255,255,255,.12);color:#fff;text-decoration:none}
.cl-now img{width:92px;height:43px;object-fit:cover;border-radius:6px;display:block}
.cl-now b{display:block;font-size:14px;font-weight:600;line-height:1.3}
.cl-now em{display:block;font-style:normal;font-size:12.5px;color:rgba(255,255,255,.65)}
.kit .gm a.cl-now:hover b{text-decoration:underline}
.cl-panel .cp-btns{margin-top:12px;justify-content:flex-start}
.cl-evs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 18px}
.cl-ev{display:flex;flex-direction:column;min-width:0}
.cl-ev .im{position:relative;display:block;aspect-ratio:460/215;border-radius:10px;overflow:hidden;background:var(--line2)}
.cl-ev .im img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s}
.cl-ev .im:hover img{transform:scale(1.04)}
.cl-ev .im i{position:absolute;left:8px;top:8px;padding:3px 8px;border-radius:7px;background:var(--ac);color:#fff;font-style:normal;font-size:12px;font-weight:700}
.cl-ev.is-fest .im i{background:#D98A2B}.cl-ev.is-demo .im i{background:#7C5CD6}
.cl-ev .st{margin-top:10px;font-size:12px;font-weight:600;color:var(--ac)}
.cl-ev b{margin-top:2px;font-size:15.5px;font-weight:600;line-height:1.3;color:var(--ink)}
.cl-ev .dt{margin-top:2px;font-size:13px;color:var(--ink2)}
.cl-ev p{margin:6px 0 0;font-size:13px;line-height:1.5;color:var(--mut)}
.cl-ev .ft{display:flex;align-items:center;gap:12px;margin-top:10px;font-size:13px}
.kit .gm .cl-ev .ft>a{color:var(--ac);font-weight:600;text-decoration:none}
.cl-ev .ft .ad-cal{margin-left:auto}
.cl-int{display:inline-flex;align-items:flex-end;gap:2px;height:14px}
.cl-int i{width:4px;border-radius:1px;background:var(--line)}
.cl-int i:nth-child(1){height:5px}.cl-int i:nth-child(2){height:7px}.cl-int i:nth-child(3){height:9px}.cl-int i:nth-child(4){height:11px}.cl-int i:nth-child(5){height:14px}
.cl-int i.on{background:var(--ac)}
.kit .gm .cal-wrap{border:0;padding:0;margin:0;background:none;box-shadow:none;border-radius:0}
.cl-calbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.cl-calbar .sc-calendar-key{margin:0;padding:0;border:0}
.cl-sales .v .s{display:block;font-family:inherit;font-size:11.5px}
.cl-sales>div{grid-template-columns:minmax(0,13em) minmax(40px,1fr) auto}
.cl-dur{border-top-color:var(--line);color:var(--ink2)}
.cl-dur b{color:var(--ink)}
.cl-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}
.cl-list{display:grid}
.cl-row{display:grid;grid-template-columns:52px minmax(0,1fr) 150px 36px auto;gap:14px;align-items:center;padding:10px 0;border-top:1px solid var(--line2)}
.cl-row:first-child{border-top:0}
.cl-row .dt{display:grid;place-items:center;width:52px;height:52px;border-radius:10px;background:var(--ac);color:#fff;font-size:11px;line-height:1.1;text-transform:uppercase}
.cl-row .dt b{font-size:19px;font-weight:700}
.cl-row.is-fest .dt{background:#D98A2B}.cl-row.is-demo .dt{background:#7C5CD6}
.cl-row.is-past .dt{filter:grayscale(.4) opacity(.6)}
.cl-row.is-past .nm b{color:var(--mut)}
.kit .gm .cl-row a.nm{min-width:0;text-decoration:none;color:inherit}
.cl-row .nm b{display:block;font-size:14.5px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit .gm .cl-row a.nm:hover b{color:var(--ac)}
.cl-row .nm em{display:block;font-style:normal;font-size:12.5px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cl-row .st{font-size:12.5px;color:var(--ink2);text-align:right}
.cl-row .ac{display:flex;gap:8px;justify-content:flex-end}
.kit .gm .cl-row .ac>a{display:inline-flex;align-items:center;height:30px;padding:0 10px;border-radius:8px;background:var(--page);color:var(--ink2);font-size:12.5px;font-weight:500;text-decoration:none;white-space:nowrap}
.kit .gm .cl-row .ac>a:hover{background:var(--ac2);color:var(--ac)}
@media(max-width:1080px){.cl-evs{grid-template-columns:repeat(2,minmax(0,1fr))}.cl-row{grid-template-columns:52px minmax(0,1fr) auto}.cl-row .st,.cl-row .cl-int{display:none}}
@media(max-width:700px){.cl-evs{grid-template-columns:1fr}.cl-panel{max-width:none;justify-self:stretch}.cl-row{grid-template-columns:44px minmax(0,1fr)}.cl-row .dt{width:44px;height:44px}.cl-row .ac{grid-column:2;justify-content:flex-start}.cl-sales>div{grid-template-columns:1fr;row-gap:2px}.cl-sales .t{display:none}.cl-sales .v{white-space:normal}.cl-sales .n{white-space:normal}}

/* ⚠️ Окно события: в calendar.css центрирование, цвета дат и кегли привязаны к .steam-main старой страницы.
   Без них на новой странице окно вставало в левый верхний угол. */
.gm .sc-dialog{position:fixed;inset:0;margin:auto}
.kit .gm a.sc-date-event{color:var(--sc-ink)}
.kit .gm a.sc-day.sc-today,.kit .gm a.sc-day.sc-today span{color:#fff}
.kit .gm .sc-month h3{font-size:16px;line-height:1.25;margin:0;letter-spacing:-.02em}
.kit .gm .sc-event-card h3{line-height:1.25;margin:0 0 12px;letter-spacing:-.03em}
@media(max-width:700px){.kit .gm .sc-month h3{font-size:20px}}

/* ── «В календарь» и подписка на даты (calendar_page.add_menu / subscribe_menu) ── */
.ad-cal{position:relative;display:inline-block}
.kit .gm .ad-cal>summary{list-style:none;cursor:pointer;white-space:nowrap;user-select:none}
.ad-cal>summary::-webkit-details-marker{display:none}
.ad-cal>summary::after{content:'';display:inline-block;width:6px;height:6px;margin-left:7px;border:solid currentColor;border-width:0 1.6px 1.6px 0;transform:translateY(-3px) rotate(45deg);opacity:.7}
.ad-cal[open]>summary::after{transform:translateY(1px) rotate(-135deg)}
.ad-menu{position:absolute;z-index:40;top:calc(100% + 6px);left:0;width:260px;max-width:calc(100vw - 32px);padding:6px;border-radius:12px;background:#fff;
  box-shadow:0 14px 36px rgba(18,20,26,.22),0 0 0 1px rgba(18,20,26,.07);text-align:left;cursor:auto}
.ad-right .ad-menu{left:auto;right:0}
.ad-up .ad-menu{top:auto;bottom:calc(100% + 6px);left:0;right:0;width:auto}
.kit .gm .ad-menu a,.kit .gm .ad-menu button{display:block;width:100%;margin:0;padding:9px 10px;border:0;border-radius:8px;background:none;color:#12141A;
  font:inherit;font-size:13.5px;font-weight:600;line-height:1.3;text-align:left;text-decoration:none;cursor:pointer;white-space:normal;height:auto}
.kit .gm .ad-menu a:hover,.kit .gm .ad-menu button:hover,.kit .gm .ad-menu a:focus-visible,.kit .gm .ad-menu button:focus-visible{background:#F4F5F8;color:var(--ac)}
.ad-menu em{display:block;margin-top:1px;font-style:normal;font-size:12px;font-weight:400;color:#6B7280}
.ad-menu p{margin:4px 10px 6px;font-size:12.5px;line-height:1.45;color:#6B7280}
.kit .gm .ad-hero>summary{display:inline-flex;align-items:center;height:38px;padding:0 14px;border-radius:10px;background:#fff;color:#12141A;font-size:13.5px;font-weight:600}
.kit .gm .ad-link>summary{font-size:13px;font-weight:500;color:var(--mut)}
.kit .gm .ad-link>summary:hover{color:var(--ac)}
.kit .gm .ad-pill>summary{display:inline-flex;align-items:center;height:30px;padding:0 10px;border-radius:8px;background:var(--page);color:var(--ink2);font-size:12.5px;font-weight:500}
.kit .gm .ad-pill>summary:hover,.kit .gm .ad-pill[open]>summary{background:var(--ac2);color:var(--ac)}
.cl-subtab{margin-left:auto;align-self:center}
.kit .gm .cl-subtab>summary{height:38px;padding:0 14px;font-size:13.5px;font-weight:600;background:var(--ac2);color:var(--ac)}
.sc-event-actions .ad-kbtn{flex:1;display:block}
.kit .gm .ad-kbtn>summary{display:flex;align-items:center;justify-content:center;min-height:40px;padding:0 12px;border-radius:10px;background:#EEF0F4;color:#12141A;font-size:12px;font-weight:600}
@media(max-width:1080px){.cl-subtab{margin-left:0}}
.ad-url{display:block;width:100%;margin:2px 0 4px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:#F4F5F8;color:#12141A;font:12px/1.3 var(--mono)}
/* На телефоне меню — нижняя панель во всю ширину: у кнопок в строках и карточках справа для выпадающего списка нет места.
   В окне события меню раскрывается вверх внутри окна, его не трогаем. */
@media(max-width:700px){
  .ad-cal:not(.ad-up):not(.ad-hero) .ad-menu,.ad-cal.ad-right:not(.ad-up):not(.ad-hero) .ad-menu{position:fixed;top:auto;left:12px;right:12px;bottom:12px;width:auto;max-width:none;padding:8px;border-radius:16px;
    box-shadow:0 -6px 40px rgba(18,20,26,.28),0 0 0 1px rgba(18,20,26,.08)}
  .kit .gm .ad-cal:not(.ad-up):not(.ad-hero) .ad-menu a,.kit .gm .ad-cal:not(.ad-up):not(.ad-hero) .ad-menu button{padding:12px}
  .sc-event-actions .ad-up .ad-menu{left:0;width:auto}
}

/* Подписка в шапке раскрывается внутри панели: у шапки overflow:hidden и полоса цифр поверх, выпадающий список обрезался.
   На телефоне фиксированная нижняя панель тоже не годится — backdrop-filter панели делает её опорой для position:fixed. */
.kit .gm .cl-panel .ad-hero{display:block;width:100%}
.ad-hero .ad-menu{position:static;width:auto;max-width:none;margin-top:10px;box-shadow:none;border-radius:12px}
/* В окне события меню привязано к ряду кнопок, а не к половинке кнопки: иначе на телефоне пункты переносились в две строки. */
.sc-event-actions{position:relative}
.sc-event-actions .ad-kbtn{position:static}
.sc-event-actions .ad-up .ad-menu{left:auto;right:0;width:min(100%,300px)}

/* ── достижения: /steam/<aid>/achievements/ и /steam/achievements/ (achievements_page.py) ── */
.ah-top{max-width:380px;justify-self:end}
.ah-card{display:grid;grid-template-columns:64px minmax(0,1fr);gap:14px;align-items:start;margin:4px 0 10px}
.ah-card .ic,.ah-it .ic,.ah-rare .ic{display:block;border-radius:10px;overflow:hidden;background:rgba(255,255,255,.08)}
.ah-card .ic{width:64px;height:64px}
.ah-card .ic img{width:64px;height:64px;display:block;object-fit:cover}
.ah-card b{display:block;font-size:16px;font-weight:700;color:#fff;line-height:1.3}
.ah-card em{display:block;margin-top:3px;font-style:normal;font-size:13px;line-height:1.45;color:rgba(255,255,255,.72)}
.ah-card i{display:inline-block;margin-top:8px;padding:3px 8px;border-radius:7px;background:#C9A64B;color:#1b1406;font-style:normal;font-family:var(--mono);font-size:12.5px;font-weight:700}
.ah-top .cp-line{border-top-color:rgba(255,255,255,.12)}
.ah-top .cp-line span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ah-top .cp-btns{margin-top:12px;justify-content:flex-start}
.ah-hist{height:170px}
.ah-tools{display:grid;grid-template-columns:minmax(220px,1fr) auto;gap:10px;align-items:center;margin-bottom:14px}
.kit .gm .ah-tiers a em{margin-left:6px;font-style:normal;font-family:var(--mono);font-size:11.5px;color:var(--dim)}
.ah-grp{margin-top:6px}
.ah-gh{display:flex;align-items:baseline;gap:8px;margin:14px 0 4px;font-size:13px;font-weight:600;color:var(--ink2)}
.ah-gh em{font-style:normal;font-family:var(--mono);font-size:12px;color:var(--dim)}
.ah-it{display:grid;grid-template-columns:52px minmax(0,1fr) 150px 104px;gap:14px;align-items:center;padding:9px 0;border-top:1px solid var(--line2)}
.ah-it .ic{width:52px;height:52px;background:var(--line2)}
.ah-it .ic img{width:52px;height:52px;display:block;object-fit:cover}
.ah-it .tx{min-width:0}
.ah-it .tx b{font-size:14.5px;font-weight:600;color:var(--ink)}
.ah-it .tx em{display:block;margin-top:2px;font-style:normal;font-size:13px;line-height:1.45;color:var(--mut)}
.ah-it .hd{display:inline-block;margin-left:8px;padding:1px 6px;border-radius:6px;background:var(--line2);font-size:11px;font-weight:600;color:var(--mut);vertical-align:2px}
.ah-it .pc{display:flex;flex-direction:column;gap:5px}
.ah-it .pc b{font-family:var(--mono);font-size:14px;font-weight:700;color:var(--ink)}
.ah-it .bar{position:relative;height:6px;border-radius:4px;background:var(--line2);overflow:hidden}
.ah-it .bar i{position:absolute;inset:0 auto 0 0;border-radius:4px;background:var(--ac);opacity:.5}
.ah-it .tg{justify-self:end;padding:3px 8px;border-radius:7px;background:var(--line2);color:var(--mut);font-size:12px;font-weight:600;white-space:nowrap}
.ah-it.is-legend .tg{background:#F6EBCB;color:#8A6412}.ah-it.is-legend .bar i{background:#C9A64B;opacity:1}
.ah-it.is-rare .tg{background:#EDE7FB;color:#5B3FB8}.ah-it.is-rare .bar i{background:#7C5CD6;opacity:.8}
.ah-it.is-uncommon .tg{background:var(--ac2);color:var(--ac)}
.ah-it[hidden],.ah-grp[hidden]{display:none}
.ah-rares{display:grid}
.ah-rare{display:grid;grid-template-columns:44px minmax(0,1fr) minmax(0,220px) 110px;gap:14px;align-items:center;padding:9px 0;border-top:1px solid var(--line2)}
.ah-rare:first-child{border-top:0}
.ah-rare .ic{width:44px;height:44px;background:var(--line2)}
.ah-rare .ic img{width:44px;height:44px;display:block;object-fit:cover}
.ah-rare .tx{min-width:0}
.ah-rare .tx b{display:block;font-size:14px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ah-rare .tx em{display:block;font-style:normal;font-size:12.5px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit .gm .ah-rare a.gmn{display:flex;align-items:center;gap:10px;min-width:0;color:var(--ink2);font-size:13px;text-decoration:none}
.kit .gm .ah-rare a.gmn:hover{color:var(--ac)}
.ah-rare .gmn img{width:64px;height:30px;object-fit:cover;border-radius:4px;flex:none}
.ah-rare .gmn span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ah-rare .pc{justify-self:end;padding:3px 8px;border-radius:7px;background:#F6EBCB;color:#8A6412;font-family:var(--mono);font-size:12.5px;font-weight:700;white-space:nowrap}
.kit .gm a.ah-gr{grid-template-columns:64px minmax(0,1fr) auto}
.ah-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px}
@media(max-width:1080px){.ah-it{grid-template-columns:52px minmax(0,1fr) 120px}.ah-it .tg{display:none}.ah-rare{grid-template-columns:44px minmax(0,1fr) minmax(0,170px) auto}.ah-rare .gmn img{display:none}}
@media(max-width:700px){
  .ah-top{max-width:none;justify-self:stretch}.ah-tools{grid-template-columns:1fr}.ah-tools .hb-seg{overflow-x:auto}
  .ah-it{grid-template-columns:44px minmax(0,1fr) auto;gap:10px}.ah-it .ic,.ah-it .ic img{width:44px;height:44px}
  .ah-it .pc{min-width:64px}.ah-it .tx em{font-size:12.5px}.ah-2{grid-template-columns:1fr}
}

/* ⚠️ На телефоне ссылка на игру встаёт второй строкой под достижением: правило скрытия проигрывало .kit .gm .ah-rare a.gmn,
   в сетку из трёх колонок попадали четыре элемента и процент уезжал за левый край. */
@media(max-width:700px){
  .ah-rare{grid-template-columns:44px minmax(0,1fr) auto;column-gap:10px;row-gap:1px}
  .ah-rare .ic{grid-column:1;grid-row:1/3}
  .ah-rare .tx{grid-column:2;grid-row:1}
  .ah-rare .tx em{display:none}
  .kit .gm .ah-rare a.gmn{grid-column:2;grid-row:2;font-size:12px;color:var(--mut)}
  .ah-rare .pc{grid-column:3;grid-row:1/3}
}

/* ── сравнение игр /steam/compare/ (compare_page.py) ── */
.cm-find{max-width:420px;justify-self:end;width:100%}
.cm-find form{display:block}
.kit .gm .cm-find .hb-q button[disabled]{opacity:.5;cursor:not-allowed}
.cm-res{position:relative;z-index:30;margin-top:6px;padding:4px;border-radius:12px;background:#fff;box-shadow:0 14px 36px rgba(0,0,0,.35)}
.kit .gm .cm-opt{display:grid;grid-template-columns:64px minmax(0,1fr);gap:10px;align-items:center;width:100%;padding:6px;border:0;border-radius:8px;background:none;color:#12141A;font:inherit;font-size:14px;font-weight:600;text-align:left;cursor:pointer}
.cm-opt img{width:64px;height:30px;object-fit:cover;border-radius:4px;display:block}
.cm-opt span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit .gm .cm-opt:hover,.kit .gm .cm-opt[aria-selected="true"]{background:#EEF0F4;color:var(--ac)}
.cm-fallback{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.kit .gm .cm-fallback a{display:inline-flex;align-items:center;height:32px;padding:0 11px;border-radius:9px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.14);color:#fff;font-size:13px;text-decoration:none}
.cm-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:12px}
.cm-cc{display:flex;align-items:center;gap:8px;font-size:12.5px;color:rgba(255,255,255,.65)}
.cm-cc select{height:38px;padding:0 10px;border:0;border-radius:10px;background:#fff;color:#12141A;font:inherit;font-size:13.5px}
.kit .gm .cm-bar .gm-b{height:38px;padding:0 14px;font-size:13.5px}
.cm-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}
.cm-card{display:flex;flex-direction:column;min-width:0}
.kit .gm .cm-card .im{display:block;aspect-ratio:460/215;border-radius:10px;overflow:hidden;background:var(--line2)}
.cm-card .im img{width:100%;height:100%;object-fit:cover;display:block}
.cm-card b{margin-top:8px;font-size:14.5px;font-weight:600;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit .gm .cm-card b a{color:var(--ink);text-decoration:none}
.kit .gm .cm-card b a:hover{color:var(--ac)}
.kit .gm a.cm-rm{align-self:flex-start;margin-top:2px;font-size:12.5px;color:var(--mut);text-decoration:none}
.kit .gm a.cm-rm:hover{color:var(--bad)}
.cm-slot{justify-content:center;align-items:center;aspect-ratio:460/215;border:1.5px dashed var(--line);border-radius:10px;color:var(--mut);cursor:pointer;text-align:center}
.cm-slot span{font-size:26px;line-height:1;color:var(--ac)}
.cm-slot b{margin-top:4px;font-size:13px;font-weight:600;color:var(--ink2)}
.cm-slot:hover{border-color:var(--ac);background:var(--ac2)}
.cm-wrap{overflow-x:auto;margin:0 -2px;padding:0 2px}
.kit .gm .cm-table{width:100%;min-width:calc(170px + var(--n) * 210px);border-collapse:separate;border-spacing:0;table-layout:fixed;font-size:13.5px}
.kit .gm .cm-table th,.kit .gm .cm-table td{padding:10px 12px;border:0;border-top:1px solid var(--line2);background:#fff;text-align:left;vertical-align:top;font-weight:400;color:var(--ink2);text-transform:none;letter-spacing:0}
.kit .gm .cm-table thead th{border-top:0;font-size:14px;font-weight:600;color:var(--ink)}
.kit .gm .cm-table thead th a{color:var(--ink);text-decoration:none}
.kit .gm .cm-table .cm-k{position:sticky;left:0;z-index:1;width:170px;font-size:13px;font-weight:500;color:var(--mut)}
.kit .gm .cm-table tr.cm-sec th{padding:18px 12px 8px;border-top:0;background:#fff;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--dim)}
.cm-table td b{font-weight:700;color:var(--ink)}
.cm-table td small{display:block;margin-top:2px;font-size:12px;color:var(--dim)}
.kit .gm .cm-table td a{color:var(--ink);text-decoration:none}
.kit .gm .cm-table td a:hover{color:var(--ac)}
.cm-rv{display:inline-flex;align-items:center;gap:6px}
.kit .gm .cm-table td.is-best{background:var(--ac2)}
.cm-best{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:6px;background:var(--ac);color:#fff;font-style:normal;font-size:11px;font-weight:700;vertical-align:1px}
.cm-na{color:var(--dim)}
.cm-req{margin:0;padding:0;list-style:none;font-size:12.5px;line-height:1.45}
.cm-req li+li{margin-top:3px}
.cm-deck{display:inline-block;padding:2px 8px;border-radius:7px;font-size:12.5px;font-weight:600}
.cm-deck.is-ok{background:#E3F2E8;color:#1F7A45}.cm-deck.is-mid{background:#FFF3D6;color:#8A6412}.cm-deck.is-no{background:#FBE9E7;color:#B8412F}
.cm-add{color:var(--ac);font-weight:600}
.cm-pairs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 16px}
.kit .gm a.cm-pair{display:flex;flex-direction:column;min-width:0;text-decoration:none;color:inherit}
.cm-pair .cv{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:3px;aspect-ratio:2/.66;border-radius:10px;overflow:hidden;background:var(--line2)}
.cm-pair .cv img{width:100%;height:100%;object-fit:cover;display:block}
.cm-pair .cv i{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:3px 9px;border-radius:999px;background:#12141A;color:#fff;font-style:normal;font-size:12px;font-weight:700}
.cm-pair b{margin-top:9px;font-size:14px;font-weight:600;line-height:1.3;color:var(--ink)}
.kit .gm a.cm-pair:hover b{color:var(--ac)}
.cm-pair em{margin-top:2px;font-style:normal;font-size:12.5px;color:var(--mut)}
@media(max-width:1080px){.cm-cards,.cm-pairs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.cm-find{max-width:none;justify-self:stretch}.kit .gm .cm-table .cm-k{width:120px}.kit .gm .cm-table{min-width:calc(120px + var(--n) * 180px)}.cm-pairs{grid-template-columns:1fr}}
/* Панель поиска растёт вниз, когда открыт список найденных игр: колонки шапки выравниваем по верху, иначе заголовок прыгал к середине.
   Список поверх нельзя — шапка обрезает всё, что выходит за её край. */
.cm-hero .h2-row{align-items:start}
/* Рейтинги карточек /steam/cards/sets|expensive|active/ (card_ranks_page.py) */
.cd-sets.cr-sets{grid-template-columns:repeat(3,minmax(0,1fr))}
.cr-list{display:flex;flex-direction:column}
.kit .gm a.cr-row{display:grid;grid-template-columns:40px 36px minmax(0,1fr) auto;gap:14px;align-items:center;margin:0 -10px;padding:6px 10px;border-radius:10px;text-decoration:none;color:inherit}
.kit .gm a.cr-row:hover{background:var(--page)}
.cr-row .rk{font-family:var(--mono);font-size:15px;font-weight:700;color:var(--ink2);text-align:center}
.cr-row .th img{width:36px;height:42px;object-fit:cover;border-radius:4px;display:block;background:var(--line2)}
.cr-row.is-foil .th img{box-shadow:0 0 0 2px #C9A64B}
.cr-row .nm{min-width:0}
.cr-row .nm b{display:block;font-size:14px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit .gm a.cr-row:hover .nm b{color:var(--ac)}
.cr-row .nm em{display:block;font-style:normal;font-size:12px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cr-row .vl{display:flex;flex-direction:column;align-items:flex-end;font-family:var(--mono);line-height:1.25}
.cr-row .vl b{font-size:14.5px;font-weight:700;color:var(--ink);white-space:nowrap}
.cr-row .vl small{font-size:11.5px;color:var(--dim);white-space:nowrap}
#hbGrid.cr-list[aria-busy]{opacity:.55}
@media(max-width:700px){.cd-sets.cr-sets{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kit .gm a.cr-row{grid-template-columns:28px 32px minmax(0,1fr) auto;gap:10px;margin:0 -6px;padding:6px}
  .cr-row .th img{width:32px;height:37px}
  .cr-row .rk{font-size:13px}}
/* Игра без данных и 404 раздела Steam (thin_page.py) */
.tn-panel .tn-note{margin:0 0 14px;font-size:14px;line-height:1.5;opacity:.82}
.kit .gm .tn-panel .tn-go{width:100%;justify-content:center;border:0;font:inherit;font-weight:600;cursor:pointer}
.kit .gm .tn-panel .tn-go:disabled{opacity:.7;cursor:default}
.tn-panel .tn-st{min-height:20px;margin:10px 0 0;font-size:13.5px;line-height:1.45}
.tn-panel .tn-st:empty{min-height:0;margin:0}
.tn-find{margin:0 0 18px}
