/* pinball — пинбол-стол. Парадигма раскладки: страница = наклонное игровое поле
   внутри корпуса автомата.
     .pbcab    — корпус: две хромированные боковины на всю высоту документа;
     .pbback   — бэкглас: липкое табло с механическим счётчиком очков (.pbreel);
     .pbfield  — поле со светящейся аркой вверху и диагональной текстурой дерева;
     .pbshoot  — дорожка запуска: hero + жёлоб плунжера справа;
     .pbbumpers— бамперы-кружки с концентрическими кольцами (KPI), шахматный сдвиг;
     .pbslot   — секция: наклонный указатель-жёлоб .pbsign со стальным шаром-номером
                 и панель .pbwell с направляющим рельсом слева;
     .pbtargets— ряд мишеней (drop targets) с фаской и лёгким разворотом;
     .pbramp   — рампа уровней: шесть ступеней с косым срезом, растут по высоте;
     .pbflip   — кнопки-флипперы (скруглённые с одного конца);
     .pbtilt   — полоса TILT в косую штриховку (предупреждения, 18+);
     .pbmulti  — мультибол: карточки отзывов с шариком-маркером;
     .pbkick   — кикер-лист вопросов; .pbdrain — дренаж (подвал).

   Перекраска: правятся только --acc (accent_hue) и --acc2 (второй акцент).
   --sig — сигнальный жёлтый, трогать не нужно. Тема тёмная.
   Мобильный (<=700px): указатели распрямляются, бамперы в две колонки,
   рампа складывается в столбец, боковины корпуса ужимаются до 4px. */

:root{
  --acc:hsl(137 68% 46%);
  --acc-d:hsl(137 70% 36%);
  --acc-soft:hsl(137 68% 46% / .17);
  --acc2:hsl(172 70% 44%);
  --acc2-soft:hsl(172 70% 44% / .16);
  --sig:hsl(44 92% 57%);
  --bg:hsl(150 18% 6%);
  --bg2:hsl(150 15% 9%);
  --panel:hsl(150 13% 12.5%);
  --panel2:hsl(150 12% 16.5%);
  --line:hsl(150 10% 22%);
  --tx:hsl(140 14% 93%);
  --tx2:hsl(145 9% 71%);
  --tx3:hsl(145 8% 54%);
  --rail:linear-gradient(180deg,#8f9b95,#3a443f 18%,#6f7a75 52%,#2c3531 100%);
  --rad:13px;
  --col:1150px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:#050806;color:var(--tx);
  font:400 17px/1.66 "Red Hat Text","Segoe UI",system-ui,sans-serif;
  -webkit-text-size-adjust:100%;overflow-x:hidden;
}
h1,h2,h3,h4{font-family:"Lilita One","Segoe UI",sans-serif;font-weight:400;line-height:1.14;margin:0 0 12px;letter-spacing:.01em}
p{margin:0 0 14px}
a{color:var(--acc2);text-decoration:none}
a:hover{text-decoration:underline}
.pb-em{color:var(--acc);font-weight:700}
.pb-em2{color:var(--acc2);font-weight:700}
.pb-n{font-family:"Lilita One",sans-serif;letter-spacing:.02em;color:var(--tx)}

/* ── корпус автомата ──────────────────────────────────────────── */
.pbcab{
  position:relative;max-width:1290px;margin:0 auto;background:var(--bg);
  border-left:10px solid transparent;border-right:10px solid transparent;
  background-image:var(--rail),var(--rail),linear-gradient(180deg,var(--bg),var(--bg));
  background-origin:border-box;
  background-clip:border-box,border-box,padding-box;
  background-repeat:no-repeat;
  background-size:10px 100%,10px 100%,100% 100%;
  background-position:left top,right top,center;
  box-shadow:0 0 0 1px #000,0 24px 90px rgb(0 0 0 / .8);
}
.pb-wrap{position:relative;z-index:2;max-width:var(--col);margin:0 auto;padding:0 22px}

/* ── бэкглас ──────────────────────────────────────────────────── */
.pbback{
  position:sticky;top:0;z-index:40;
  background:linear-gradient(180deg,hsl(150 20% 10% / .97),hsl(150 18% 7% / .95));
  border-bottom:3px solid var(--acc-d);backdrop-filter:blur(8px);
}
.pbback__in{display:flex;align-items:center;gap:16px;max-width:var(--col);margin:0 auto;padding:9px 22px}
.pblogo{display:flex;align-items:center;gap:10px;color:var(--tx);font-family:"Lilita One",sans-serif;font-size:21px;letter-spacing:.05em;text-transform:uppercase}
.pblogo:hover{text-decoration:none}
.pblogo i{
  width:22px;height:22px;border-radius:50%;flex:none;display:block;
  background:radial-gradient(circle at 32% 26%,#fff,#cad6d0 26%,#7f8c86 58%,#2a322e 100%);
  box-shadow:0 0 0 3px hsl(150 13% 16%),0 0 14px hsl(137 68% 46% / .55);
}
.pbreel{display:flex;gap:3px;margin-left:auto}
.pbreel s{
  position:relative;text-decoration:none;display:grid;place-items:center;
  min-width:23px;height:32px;padding:0 3px;border-radius:4px;
  background:linear-gradient(180deg,#1a231e,#0c110e);border:1px solid var(--line);
  font-family:"Lilita One",sans-serif;font-size:19px;color:var(--sig);
  text-shadow:0 0 9px hsl(44 92% 57% / .55);
}
.pbreel s::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:rgb(0 0 0 / .65)}
.pbreel s.u{color:var(--tx2);font-size:14px;text-shadow:none;min-width:auto;padding:0 6px}
.pbback__cta{flex:none}

/* ── кнопки-флипперы ──────────────────────────────────────────── */
.pbflip{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:48px;padding:12px 26px;
  border-radius:999px 10px 999px 10px;
  font-family:"Lilita One",sans-serif;font-size:16.5px;letter-spacing:.04em;
  background:linear-gradient(180deg,hsl(137 70% 52%),var(--acc-d));
  color:hsl(150 45% 7%);border:2px solid hsl(137 72% 60%);
  box-shadow:0 5px 0 hsl(137 72% 24%),0 12px 26px hsl(137 70% 30% / .4);
}
.pbflip:hover{text-decoration:none;transform:translateY(1px);box-shadow:0 4px 0 hsl(137 72% 24%)}
.pbflip--l{border-radius:10px 999px 10px 999px;background:transparent;color:var(--acc2);border-color:var(--acc2);box-shadow:0 5px 0 hsl(172 70% 20%)}
.pbflip--l:hover{background:var(--acc2-soft)}
.pbflip--s{min-height:44px;padding:10px 18px;font-size:15px}

/* ── поле ─────────────────────────────────────────────────────── */
.pbfield{position:relative;overflow:hidden;padding-bottom:18px}
.pbfield::before{
  content:"";position:absolute;top:0;left:-6%;right:-6%;height:520px;pointer-events:none;
  background:radial-gradient(120% 100% at 50% -12%,var(--acc-soft),transparent 68%),
             radial-gradient(70% 80% at 88% 6%,var(--acc2-soft),transparent 70%);
  border-radius:0 0 50% 50% / 0 0 100% 100%;
}
.pbfield::after{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.35;
  background:repeating-linear-gradient(118deg,transparent 0 15px,hsl(150 12% 18% / .5) 15px 16px);
}

/* ── дорожка запуска (hero) ───────────────────────────────────── */
.pbshoot{display:grid;grid-template-columns:1fr 96px;gap:26px;padding:34px 0 6px}
.pbshoot__tag{
  display:inline-flex;align-items:center;gap:9px;margin-bottom:15px;
  padding:6px 15px 6px 9px;border-radius:999px;background:var(--panel);
  border:1px solid var(--line);font-size:13px;letter-spacing:.07em;
  text-transform:uppercase;color:var(--tx2);
}
.pbshoot__tag s{width:11px;height:11px;border-radius:50%;background:var(--sig);display:block;text-decoration:none;box-shadow:0 0 10px var(--sig)}
.pbshoot h1{font-size:clamp(29px,4.6vw,54px);margin-bottom:15px}
.pbshoot__lede{font-size:clamp(16px,1.5vw,19px);color:var(--tx2);max-width:60ch;margin-bottom:22px}
.pbshoot__cta{display:flex;flex-wrap:wrap;gap:13px;margin-bottom:12px}
.pbshoot__fine{margin:0;font-size:13.5px;color:var(--tx3)}
/* жёлоб плунжера */
.pbplunger{position:relative;border-radius:999px;background:var(--bg2);border:1px solid var(--line);overflow:hidden}
.pbplunger::before{
  content:"";position:absolute;left:50%;top:14%;bottom:8%;width:9px;margin-left:-4.5px;border-radius:5px;
  background:linear-gradient(180deg,#b9c4be,#4a534e);
}
.pbplunger::after{
  content:"";position:absolute;left:50%;bottom:5%;width:34px;height:34px;margin-left:-17px;border-radius:50%;
  background:radial-gradient(circle at 32% 26%,#fff,#cad6d0 26%,#7f8c86 58%,#2a322e 100%);
  box-shadow:0 0 22px hsl(137 68% 46% / .6);
}

/* ── бамперы (KPI) ────────────────────────────────────────────── */
.pbbumpers{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;padding:30px 0 12px}
.pbbump{
  flex:1 1 160px;aspect-ratio:1/1;max-width:186px;border-radius:50%;
  display:grid;place-content:center;text-align:center;padding:10px;
  background:radial-gradient(circle at 50% 34%,var(--panel2),var(--bg2) 72%);
  box-shadow:0 0 0 5px var(--panel),0 0 0 7px var(--acc),0 16px 34px rgb(0 0 0 / .55),
             inset 0 0 26px hsl(137 68% 46% / .12);
}
.pbbump:nth-child(even){box-shadow:0 0 0 5px var(--panel),0 0 0 7px var(--acc2),0 16px 34px rgb(0 0 0 / .55),inset 0 0 26px hsl(172 70% 44% / .12);margin-top:32px}
.pbbump em{font-style:normal;font-weight:400;font-family:"Lilita One",sans-serif;font-size:clamp(20px,2.5vw,29px);display:block;line-height:1.05}
.pbbump span{display:block;margin-top:7px;font-size:13px;color:var(--tx3);line-height:1.35}

/* ── секции-жёлоба ────────────────────────────────────────────── */
.pbslot{padding:34px 0 6px}
.pbsign{
  display:flex;align-items:center;gap:16px;margin-bottom:18px;
  padding:13px 22px 13px 14px;border-radius:6px;
  background:linear-gradient(90deg,var(--panel2),var(--bg2) 78%,transparent);
  border-left:5px solid var(--acc);transform:skewX(-9deg);
}
.pbslot:nth-of-type(even) .pbsign{border-left-color:var(--acc2);transform:skewX(9deg)}
.pbsign > *{transform:skewX(9deg)}
.pbslot:nth-of-type(even) .pbsign > *{transform:skewX(-9deg)}
.pbball{
  flex:none;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  text-decoration:none;font-family:"Lilita One",sans-serif;font-size:17px;color:#141c18;
  background:radial-gradient(circle at 32% 26%,#fff,#cfdad4 28%,#8b968f 62%,#39423d 100%);
  box-shadow:0 4px 12px rgb(0 0 0 / .6);
}
.pbsign__kick{margin:0 0 3px;font-size:12.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--acc2)}
.pbslot:nth-of-type(even) .pbsign__kick{color:var(--acc)}
.pbsign h2{font-size:clamp(21px,2.7vw,32px);margin:0}
.pbwell{
  position:relative;background:var(--panel);border:1px solid var(--line);
  border-radius:4px var(--rad) var(--rad) 4px;padding:22px 25px 20px;
}
.pbwell::before{content:"";position:absolute;left:-1px;top:14px;bottom:14px;width:5px;border-radius:3px;background:linear-gradient(180deg,var(--acc),var(--acc2))}
.pbwell + .pbwell{margin-top:14px}
.pbwell p:last-child{margin-bottom:0}

/* ── мишени ───────────────────────────────────────────────────── */
.pbtargets{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin:4px 0 2px}
.pbtarget{
  position:relative;background:var(--bg2);border:1px solid var(--line);
  border-radius:4px 4px 12px 12px;padding:17px 16px 15px;
}
.pbtarget::before{content:"";position:absolute;left:16px;right:16px;top:-1px;height:4px;border-radius:0 0 4px 4px;background:var(--acc)}
.pbtarget:nth-child(even)::before{background:var(--acc2)}
.pbtarget:nth-child(3n)::before{background:var(--sig)}
.pbtarget h3{font-size:17.5px;margin-bottom:6px}
.pbtarget p{margin:0;font-size:14.5px;color:var(--tx2)}
.pbtarget span{display:block;margin-top:8px;font-size:13px;color:var(--tx3);letter-spacing:.02em}

/* ── рампа уровней ────────────────────────────────────────────── */
.pbramp{display:grid;grid-template-columns:repeat(6,1fr);gap:9px;align-items:end;margin-top:6px}
.pbstep{
  background:linear-gradient(180deg,var(--panel2),var(--bg2));border:1px solid var(--line);
  border-top:4px solid var(--acc);padding:14px 12px 13px;
  clip-path:polygon(0 14px,100% 0,100% 100%,0 100%);
}
.pbstep:nth-child(2){border-top-color:hsl(144 67% 46%)}
.pbstep:nth-child(3){border-top-color:hsl(151 68% 45%)}
.pbstep:nth-child(4){border-top-color:hsl(158 69% 45%)}
.pbstep:nth-child(5){border-top-color:hsl(165 69% 44%)}
.pbstep:nth-child(6){border-top-color:var(--acc2)}
.pbstep--1{min-height:118px}.pbstep--2{min-height:136px}.pbstep--3{min-height:154px}
.pbstep--4{min-height:172px}.pbstep--5{min-height:190px}.pbstep--6{min-height:210px}
.pbstep em{display:block;font-style:normal;font-weight:400;font-family:"Lilita One",sans-serif;font-size:16.5px;margin:8px 0 5px}
.pbstep span{display:block;font-size:13px;color:var(--tx3);line-height:1.45}
.pbstep i{display:block;margin-top:8px;font-style:normal;font-family:"Lilita One",sans-serif;font-size:20px;color:var(--acc)}
.pbstep:nth-child(n+5) i{color:var(--acc2)}

/* ── таблицы ──────────────────────────────────────────────────── */
.pbscroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:4px 0 2px}
table.pbtable{width:100%;min-width:540px;border-collapse:collapse;font-size:15.5px}
table.pbtable th,table.pbtable td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line)}
table.pbtable th{font-family:"Lilita One",sans-serif;font-weight:400;font-size:13px;letter-spacing:.07em;text-transform:uppercase;color:var(--tx3)}
table.pbtable td:first-child{color:var(--tx)}
table.pbtable tr:last-child td{border-bottom:0}
table.pbtable .v{font-family:"Lilita One",sans-serif;color:var(--acc)}

/* ── списки-жёлоба ────────────────────────────────────────────── */
.pblist{margin:2px 0 0;padding:0;list-style:none}
.pblist li{position:relative;padding:8px 0 8px 28px;border-bottom:1px dashed var(--line);font-size:15.5px;color:var(--tx2)}
.pblist li:last-child{border-bottom:0}
.pblist li::before{
  content:"";position:absolute;left:3px;top:16px;width:12px;height:12px;border-radius:50%;
  background:radial-gradient(circle at 32% 28%,#fff,#b9c4be 34%,#586159 100%);
}

/* ── TILT ─────────────────────────────────────────────────────── */
.pbtilt{
  display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:14px 0 0;padding:12px 18px;
  border-radius:8px;font-size:14.5px;color:var(--tx2);
  background:repeating-linear-gradient(45deg,hsl(150 14% 11%) 0 12px,hsl(150 14% 14%) 12px 24px);
  border-left:6px solid var(--sig);
}
.pbtilt em{font-style:normal;font-family:"Lilita One",sans-serif;letter-spacing:.1em;color:var(--sig)}

/* ── мультибол (отзывы) ───────────────────────────────────────── */
.pbmulti{display:grid;grid-template-columns:repeat(2,1fr);gap:13px}
.pbquote{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:17px 19px;border-top:3px solid var(--acc2)}
.pbquote:nth-child(odd){border-top-color:var(--acc)}
.pbquote p{font-size:15.5px;color:var(--tx2);margin-bottom:11px}
.pbquote footer{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--tx3)}
.pbquote footer s{
  width:16px;height:16px;border-radius:50%;flex:none;display:block;text-decoration:none;
  background:radial-gradient(circle at 32% 28%,#fff,#b9c4be 34%,#586159 100%);
}

/* ── кикер-лист (вопросы) ─────────────────────────────────────── */
.pbkick{border-bottom:1px solid var(--line);padding:14px 0 13px}
.pbkick:last-child{border-bottom:0}
.pbkick h3{position:relative;font-size:17.5px;margin-bottom:6px;padding-left:24px}
.pbkick h3::before{
  content:"";position:absolute;left:0;top:6px;width:0;height:0;
  border:6px solid transparent;border-left-color:var(--acc);
}
.pbkick p{margin:0;color:var(--tx2);font-size:15.5px;padding-left:24px}

/* ── заметка ──────────────────────────────────────────────────── */
.pbnote{margin:8px 0 34px;padding:21px 25px;border-radius:var(--rad);background:var(--bg2);border:1px solid var(--line);border-left:6px solid var(--acc2)}
.pbnote h3{font-size:19.5px}
.pbnote p{color:var(--tx2);font-size:15.5px}
.pbnote p:last-child{margin-bottom:0}

/* ── дренаж ───────────────────────────────────────────────────── */
.pbdrain{position:relative;z-index:2;border-top:3px solid var(--acc-d);background:hsl(150 16% 8%);padding:26px 0 36px}
.pbdrain__in{max-width:var(--col);margin:0 auto;padding:0 22px;display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:24px}
.pbdrain h4{font-family:"Lilita One",sans-serif;font-weight:400;font-size:13.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--tx3);margin-bottom:9px}
.pbdrain p,.pbdrain li{font-size:14px;color:var(--tx3);line-height:1.62}
.pbdrain ul{margin:0;padding:0;list-style:none}
.pbage{
  display:inline-flex;align-items:center;justify-content:center;min-width:46px;height:28px;padding:0 10px;
  border-radius:999px;border:2px solid var(--sig);color:var(--sig);
  font-family:"Lilita One",sans-serif;font-size:14px;margin-right:9px;
}

/* ── адаптив ──────────────────────────────────────────────────── */
@media (max-width:960px){
  .pbtargets{grid-template-columns:repeat(2,1fr)}
  .pbramp{grid-template-columns:repeat(3,1fr)}
  .pbdrain__in{grid-template-columns:1fr 1fr}
  .pbbump{max-width:none}
}
@media (max-width:700px){
  body{font-size:16px}
  .pbcab{border-left-width:4px;border-right-width:4px;background-size:4px 100%,4px 100%,100% 100%}
  .pb-wrap{padding:0 14px}
  .pbback__in{padding:8px 14px;gap:10px}
  .pblogo{font-size:18px}
  .pbreel{display:none}
  .pbback__cta{margin-left:auto}
  .pbshoot{grid-template-columns:1fr;gap:0;padding:22px 0 4px}
  .pbplunger{display:none}
  .pbshoot__cta .pbflip{flex:1 1 100%}
  .pbbumpers{display:grid;grid-template-columns:1fr 1fr;padding:22px 0 8px}
  .pbbump{aspect-ratio:auto;padding:16px 12px;border-radius:16px;margin-top:0!important}
  .pbsign{transform:none!important;padding:11px 14px;gap:12px}
  .pbsign > *{transform:none!important}
  .pbwell{padding:16px 15px}
  .pbtargets,.pbramp,.pbmulti{grid-template-columns:1fr}
  .pbstep{min-height:0!important;clip-path:none}
  .pbdrain__in{grid-template-columns:1fr}
}

body{overflow-x:hidden}header{position:sticky;top:0;z-index:10;display:flex;gap:18px;align-items:center;justify-content:space-between;padding:14px max(18px,calc((100% - 1180px)/2));background:#101018;color:#fff}header a{color:inherit}.brand{font-size:22px;text-decoration:none}.brand small{font-size:10px}.cta{display:inline-flex;min-height:44px;align-items:center;padding:0 20px;border-radius:10px;background:#ff3366;color:#fff;text-decoration:none}main{max-width:1120px;margin:auto;padding:32px 18px}.hero{padding:clamp(28px,6vw,76px);border-radius:24px}.hero h1{font-size:clamp(34px,6vw,72px);line-height:1.02}.actions,.kpi,.entities{display:flex;flex-wrap:wrap;gap:12px}.kpi span,.entities span{padding:10px 14px;border:1px solid currentColor;border-radius:999px}section{margin:30px 0;padding:clamp(20px,4vw,48px);border-radius:20px}p{font-size:18px;line-height:1.75}blockquote{padding:18px;border-left:4px solid #ff3366}.keywords{font-size:13px;opacity:.65}details{padding:14px 0;border-bottom:1px solid currentColor}footer{padding:32px;text-align:center}@media(max-width:700px){header nav{display:none}.hero h1{font-size:38px}.kpi span{flex:1 1 42%}p{font-size:16px}}