/* ============================================================
   Lizaro Spielen DE — "Terracotta Arcade"
   flat scorched-cabinet palette · sidebar rail · sharp corners
   ============================================================ */

:root{
  /* palette */
  --bg-main:#120C09;
  --bg-deep:#0D0806;
  --bg-card:#1C1410;
  --accent:#D93B22;
  /* --accent на мелком тексте даёт 4.26:1 — ниже AA. Осветлённый вариант
     (5.4:1) для eyebrow, счётчиков и прочей мелочи. */
  --accent-text:#E8543A;
  --accent-2:#E0B37A;
  --text-main:#F4E9DC;
  --text-muted:#A08D7B;
  --border:rgba(224,179,122,0.18);
  --border-strong:rgba(224,179,122,0.34);

  /* type */
  /* Без внешних шрифтов: Impact/Haettenschweiler убраны — они ультра-узкие и
     дают на Win/mac совсем другую картинку, чем задумано, а на Android/Linux
     стек проваливался в обычный sans-serif весом 400 (заголовки выглядели
     «нешрифтовыми»). Оставлены только чёрные гротески + системный фолбэк,
     вес заголовков поднят до 800, чтобы фолбэк был тоже жирным. */
  --font-head:"Archivo Black","Archivo","Arial Black",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-body:"Work Sans","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-data:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  /* rhythm — airy */
  --gap-xs:.6rem;
  --gap-sm:1rem;
  --gap-md:1.75rem;
  --gap-lg:2.75rem;
  --pad-card:28px;
  --sec-pad:clamp(56px,7vw,96px);
  --wrap:1100px;
  --gutter:24px;
  --rail-w:264px;

  /* shape — sharp */
  --r:2px;
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}

body{
  margin:0;
  background:var(--bg-main);
  color:var(--text-main);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.75;
  overflow-x:hidden;
  padding-inline-start:var(--rail-w);
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%}
svg{max-width:100%}

h1,h2,h3,h4{
  font-family:var(--font-head);
  font-weight:800;
  line-height:1.08;
  letter-spacing:-.01em;
  margin:0 0 var(--gap-sm);
  text-wrap:balance;
}
h1{font-size:clamp(2.1rem,4.4vw,3.4rem);text-transform:uppercase}
h2{font-size:clamp(1.6rem,2.9vw,2.3rem);text-transform:uppercase}
h3{font-size:clamp(1.15rem,1.7vw,1.4rem)}
h4{font-size:1.05rem}

/* anywhere рвал немецкие композиты посреди слова; break-word + мягкий перенос */
p{margin:0 0 var(--gap-sm);overflow-wrap:break-word;hyphens:auto}
p:last-child{margin-bottom:0}

a{color:var(--accent-2);text-decoration:none;border-bottom:1px solid var(--border-strong)}
a:hover,a:focus-visible{background:var(--accent-2);color:var(--bg-deep);border-bottom-color:transparent}

strong,b{font-weight:600;color:var(--text-main)}
small{font-size:.85rem}

:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

ul,ol{margin:0 0 var(--gap-sm);padding-inline-start:1.3em}
li{margin-bottom:.5rem}
li::marker{color:var(--accent)}

hr{border:0;border-top:1px solid var(--border);margin:var(--gap-lg) 0}

/* ---------- container / sections ---------- */
.lzs-container{
  width:100%;
  max-width:var(--wrap);
  margin-inline:auto;
  padding-inline:var(--gutter);
}

.lzs-section{padding-block:var(--sec-pad);position:relative}
.lzs-section + .lzs-section{border-top:1px solid var(--border)}
/* было var(--bg-deep) #0D0806 — отличие от #120C09 в 5/255, полосы не читались */
.lzs-section--alt{background:#080503}

.lzs-section__head{
  display:flex;flex-direction:column;gap:var(--gap-xs);
  margin-bottom:var(--gap-md);
}
.lzs-eyebrow{
  font-family:var(--font-data);
  font-size:.72rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--accent-text);
  margin:0;
}

/* arcade score counter — 01/02/03 stamped at the left edge */
.lzs-count{
  font-family:var(--font-head);
  font-weight:800;
  font-size:clamp(2.6rem,6vw,4.4rem);
  line-height:.8;
  color:var(--accent-2);
  opacity:.3;
  display:block;
  user-select:none;
}

/* ============================================================
   SIDEBAR RAIL HEADER
   ============================================================ */
.lzs-header{
  position:fixed;
  inset-block:0;
  inset-inline-start:0;
  width:var(--rail-w);
  background:var(--bg-deep);
  border-inline-end:1px solid var(--border);
  display:flex;
  flex-direction:column;
  z-index:900;
  overflow-y:auto;
}

.lzs-header__bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--gap-sm);
  padding:26px var(--gap-sm) 22px;
  border-bottom:1px solid var(--border);
}

.lzs-logo{display:inline-flex;align-items:center;border-bottom:0;background:none}
.lzs-logo:hover,.lzs-logo:focus-visible{background:none}
.lzs-logo__img{
  display:block;
  height:40px;
  width:auto;
  max-width:100%;
  object-fit:contain;
}

.lzs-burger{
  display:none;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  width:44px;height:44px;
  flex-shrink:0;
  padding:0;
  background:transparent;
  border:1px solid var(--border-strong);
  border-radius:var(--r);
  cursor:pointer;
}
.lzs-burger span{
  display:block;
  width:22px;height:2px;
  margin-inline:auto;
  background:var(--text-main);
}
.lzs-header.is-open .lzs-burger{border-color:var(--accent)}

.lzs-nav{
  display:flex;
  flex-direction:column;
  flex:1;
  padding:var(--gap-sm) 0 var(--gap-md);
}
.lzs-nav__list{
  list-style:none;
  margin:0;padding:0;
  display:flex;
  flex-direction:column;
}
.lzs-nav__list li{margin:0;min-width:0}

.lzs-nav a:not(.lzs-btn){
  display:block;
  padding:12px var(--gap-sm) 12px calc(var(--gap-sm) + 10px);
  border-bottom:0;
  border-inline-start:2px solid transparent;
  color:var(--text-muted);
  font-size:.95rem;
  letter-spacing:.02em;
  background:transparent;
}
.lzs-nav a:not(.lzs-btn):hover,
.lzs-nav a:not(.lzs-btn):focus-visible,
.lzs-nav a:not(.lzs-btn)[aria-current="page"]{
  background:var(--accent);
  color:#fff;
  border-inline-start-color:var(--accent-2);
}

.lzs-nav__label{
  font-family:var(--font-data);
  font-size:.68rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--text-muted);
  opacity:.6;
  padding:var(--gap-sm) var(--gap-sm) .4rem calc(var(--gap-sm) + 10px);
  margin:0;
}

.lzs-header__foot{
  padding:var(--gap-sm);
  border-top:1px solid var(--border);
  display:flex;
  flex-direction:column;
  gap:.75rem;
  /* высота рельса ~870px: на окне <750px CTA уезжал за нижний край */
  position:sticky;
  bottom:0;
  background:var(--bg-deep);
}
.lzs-header__note{
  font-family:var(--font-data);
  font-size:.8rem;
  letter-spacing:.04em;
  line-height:1.5;
  color:var(--text-muted);
  margin:0;
}
.lzs-header__cta{width:100%;text-align:center}

/* grouped menu (unused when flat, kept for contract) */
.lzs-nav__group{position:relative}
.lzs-nav__toggle{
  display:none;
  background:transparent;border:0;color:var(--text-muted);
  cursor:pointer;font-size:1rem;padding:0 var(--gap-sm);
}
.lzs-submenu{list-style:none;margin:0;padding:0;display:none}
.lzs-nav__group:hover .lzs-submenu,
.lzs-nav__group:focus-within .lzs-submenu,
.lzs-nav__group.is-open .lzs-submenu{display:block}
.lzs-submenu a{padding-inline-start:calc(var(--gap-sm) + 26px)!important;font-size:.9rem}

/* ---------- buttons ---------- */
.lzs-btn{
  display:inline-block;
  font-family:var(--font-head);
  font-weight:800;
  font-size:.9rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  padding:14px 26px;
  border-radius:var(--r);
  border:1px solid var(--accent);
  background:var(--accent);
  color:#fff;
  cursor:pointer;
  text-align:center;
}
.lzs-btn:hover,.lzs-btn:focus-visible{background:var(--bg-deep);color:var(--accent)}
.lzs-btn--ghost{
  background:transparent;color:var(--accent-2);border-color:var(--border-strong);
}
.lzs-btn--ghost:hover,.lzs-btn--ghost:focus-visible{background:var(--accent-2);color:var(--bg-deep);border-color:var(--accent-2)}
.lzs-btn--sm{padding:12px 18px;font-size:.78rem}

/* ---------- icons ---------- */
.lzs-icon{
  width:1.5em;height:1.5em;
  display:inline-block;
  vertical-align:middle;
  flex-shrink:0;
  stroke:currentColor;
  fill:none;
  color:var(--accent);
}
.lzs-icon--lg{width:2.1em;height:2.1em}

/* ============================================================
   LAYOUT (sidebar archetype — inner grid, never on <section>)
   ============================================================ */
.lzs-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--gap-lg);
}
@media(min-width:1224px){
  .lzs-layout{grid-template-columns:minmax(0,1fr) 280px}
}
.lzs-layout__aside{min-width:0}
.lzs-layout__main{min-width:0}
@media(min-width:1224px){
  .lzs-layout__aside{position:sticky;top:var(--gap-md);align-self:start}
}

main{display:block}

/* ============================================================
   HERO — split (home) / compact band (inner)
   ============================================================ */
.lzs-hero{position:relative;padding-block:var(--sec-pad)}
.lzs-hero__inner{
  position:relative;
  width:100%;
  max-width:var(--wrap);
  margin-inline:auto;
  /* Было max(--gutter, (100% - --wrap)/2 + --gutter): проценты считаются от
     родителя, а не от собственных 1100px, поэтому на широких экранах padding
     накладывался поверх auto-полей и текст hero уезжал вправо (на 1920px —
     на 278px мимо оси .lzs-container). Обычный gutter, как у контейнера. */
  padding-inline:var(--gutter);
  display:flex;
  flex-direction:column;
  gap:var(--gap-sm);
}
/* На внутренних страницах hero__inner дополнительно обёрнут в .lzs-container —
   без сброса padding складывался вдвое и h1 не совпадал по оси с текстом ниже. */
.lzs-container > .lzs-hero__inner{padding-inline:0;max-width:none}

.lzs-hero__img{
  display:block;
  width:100%;
  height:auto;
  max-height:70vh;
  aspect-ratio:3/2;
  object-fit:cover;
  border-radius:var(--r);
}

.lzs-hero__visual{
  position:relative;
  min-width:0;
  border:1px solid var(--border);
  border-radius:var(--r);
  background:linear-gradient(135deg,#1C1410 0%,#2A1B12 55%,#3A2013 100%);
  aspect-ratio:3/2;
}
.lzs-hero__visual .lzs-hero__img{border:0}

/* --- home: split (text left 1.1fr / visual right .9fr) --- */
.lzs-hero--home{
  border-bottom:1px solid var(--border);
  background:var(--bg-deep);
}
.lzs-hero--home .lzs-hero__inner{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--gap-lg);
  align-items:center;
}
/* Брейкпоинты меряют вьюпорт, но контент с 960px ужат на 264px боковым
   рельсом. Поэтому все «широкие» раскладки сдвинуты на 960+264=1224 —
   иначе на 960–1223px hero и сетка слотов схлопывались в 696px. */
@media(min-width:1224px){
  .lzs-hero--home .lzs-hero__inner{grid-template-columns:1.1fr .9fr}
}
.lzs-hero__text{
  display:flex;flex-direction:column;gap:var(--gap-sm);
  min-width:0;text-align:start;
}
.lzs-hero__sub{
  color:var(--text-muted);
  font-size:1.08rem;
  margin:0;
}
.lzs-hero__actions{
  display:flex;flex-wrap:wrap;gap:var(--gap-sm);align-items:center;
}
.lzs-hero__fine{
  font-family:var(--font-data);
  font-size:.8rem;letter-spacing:.04em;line-height:1.6;
  color:var(--text-muted);margin:0;
}

/* --- inner: compact page-header band --- */
.lzs-hero--inner{
  position:relative;
  padding-block:0;
  background:var(--bg-deep);
  border-bottom:1px solid var(--accent);
  overflow:hidden;
}
.lzs-hero--inner .lzs-hero__inner{
  min-height:190px;
  padding-block:var(--gap-md);
  justify-content:center;
  gap:.6rem;
}
.lzs-hero--inner .lzs-hero__img{
  position:absolute;inset:0;
  width:100%;height:100%;
  max-height:none;aspect-ratio:auto;
  object-fit:cover;
  border-radius:0;
  z-index:0;
}
.lzs-hero--inner .lzs-hero__inner::after{
  content:"";
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(90deg,rgba(13,8,6,.94) 0%,rgba(13,8,6,.86) 55%,rgba(13,8,6,.7) 100%);
}
:where(.lzs-hero--inner .lzs-hero__inner > :not(.lzs-hero__img)){position:relative;z-index:2}
.lzs-hero--inner h1{font-size:clamp(1.7rem,3.4vw,2.5rem);color:var(--text-main)}

/* ---------- page-header (no hero image) ---------- */
.lzs-page-header{
  position:relative;
  background:var(--bg-deep);
  border-bottom:1px solid var(--accent);
  padding-block:var(--gap-lg);
  overflow:hidden;
}
.lzs-page-header__inner{
  position:relative;z-index:2;
  display:flex;flex-direction:column;gap:.6rem;
}
.lzs-page-header h1{margin:0}

/* ---------- breadcrumb ---------- */
.lzs-breadcrumb{
  font-family:var(--font-data);
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--text-muted);
  margin:0;
}
.lzs-breadcrumb ol{
  list-style:none;margin:0;padding:0;
  display:flex;flex-wrap:wrap;gap:.45rem;
}
.lzs-breadcrumb li{margin:0;display:flex;gap:.45rem;align-items:center}
.lzs-breadcrumb li + li::before{content:"/";color:var(--accent);opacity:.7}
.lzs-breadcrumb a{color:var(--text-muted);border-bottom:0}
.lzs-breadcrumb a:hover,.lzs-breadcrumb a:focus-visible{background:var(--accent-2);color:var(--bg-deep)}

/* ============================================================
   OVERVIEW / prose
   ============================================================ */
.lzs-overview{min-width:0}
.lzs-prose > * + *{margin-top:var(--gap-sm)}
.lzs-lead{font-size:1.1rem;color:var(--text-main)}

/* ============================================================
   FEATURE CARDS — grid pattern
   ============================================================ */
.lzs-features{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));
  gap:var(--gap-md);
}
.lzs-features > *{min-width:0}
.lzs-feature{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--r);
  padding:var(--pad-card);
  display:flex;flex-direction:column;gap:.7rem;
}
.lzs-feature__icon{color:var(--accent);display:flex}
.lzs-feature h3{margin:0}
.lzs-feature p{color:var(--text-muted);margin:0}

/* ============================================================
   CARDS GRID
   ============================================================ */
.lzs-cards{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));
  gap:var(--gap-md);
}
.lzs-cards > *{min-width:0}
.lzs-card{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--r);
  padding:var(--pad-card);
  display:flex;flex-direction:column;gap:.7rem;
  min-width:0;
}
.lzs-card__label{
  font-family:var(--font-data);
  font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--accent-2);margin:0;
}
.lzs-card h3{margin:0}
.lzs-card p{color:var(--text-muted);margin:0}
.lzs-card ul{margin:0;color:var(--text-muted)}

/* ============================================================
   TABLES (data-table / bonus-table / payments-table)
   ============================================================ */
.lzs-table-wrap{
  overflow-x:auto;
  max-width:100%;
  margin-block:1.5rem;
  border:1px solid var(--border);
  border-radius:var(--r);
  /* Таблицы шире экрана (min-width:520px), а оверлейный скроллбар на мобиле
     невидим — половина колонок уезжала за край без единого признака. */
  scrollbar-width:thin;
  scrollbar-color:var(--accent) var(--bg-deep);
}
.lzs-table-wrap::-webkit-scrollbar{height:8px;-webkit-appearance:none}
.lzs-table-wrap::-webkit-scrollbar-track{background:var(--bg-deep)}
.lzs-table-wrap::-webkit-scrollbar-thumb{background:var(--accent)}
.lzs-table{
  width:100%;
  border-collapse:collapse;
  font-size:.95rem;
  min-width:520px;
}
.lzs-table th,.lzs-table td{
  padding:14px 18px;
  text-align:start;
  border-bottom:1px solid var(--border);
  vertical-align:top;
}
.lzs-table th{
  white-space:nowrap;
  background:var(--bg-deep);
  font-family:var(--font-data);
  font-size:.72rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--accent-2);
  font-weight:500;
}
.lzs-table tbody tr:last-child td{border-bottom:0}
.lzs-table tbody tr:nth-child(even){background:var(--bg-card)}
.lzs-table td.lzs-num,.lzs-table .lzs-num{font-family:var(--font-data);white-space:nowrap}

.lzs-payments td:first-child{white-space:nowrap;color:var(--text-main)}
.lzs-payments .lzs-pay{display:flex;align-items:center;gap:.6rem;min-width:0}
.lzs-payments .lzs-icon{color:var(--accent-2)}

/* отрицательный margin ломал ритм там, где заметка идёт не сразу после таблицы */
.lzs-table-note{color:var(--text-muted);font-size:.92rem}

/* ============================================================
   TWO COLS + CONTENT PANEL
   ============================================================ */
.lzs-two-cols{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--gap-lg);
  align-items:start;
}
@media(min-width:860px) and (max-width:959px){
  .lzs-two-cols{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
@media(min-width:1124px){
  .lzs-two-cols{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
.lzs-two-cols > *{min-width:0}

.lzs-panel{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--r);
  padding:var(--pad-card);
  display:flex;flex-direction:column;gap:var(--gap-sm);
  min-width:0;
}
.lzs-panel__title{
  font-family:var(--font-head);
  font-size:1.05rem;
  text-transform:uppercase;
  margin:0;
  color:var(--text-main);
}

.lzs-facts{margin:0;display:flex;flex-direction:column}
.lzs-facts__row{
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem;
  padding-block:.7rem;
  border-bottom:1px solid var(--border);
  min-width:0;
}
.lzs-facts__row:last-child{border-bottom:0;padding-bottom:0}
.lzs-facts dt{
  color:var(--text-muted);
  font-size:.85rem;
  letter-spacing:.04em;
  margin:0;min-width:0;
}
.lzs-facts dd{
  margin:0;
  font-family:var(--font-data);
  font-size:.92rem;
  color:var(--text-main);
  text-align:end;
  min-width:0;
  overflow-wrap:anywhere;
}

.lzs-checklist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.7rem}
.lzs-checklist li{
  display:flex;gap:.65rem;align-items:flex-start;margin:0;
  color:var(--text-muted);font-size:.95rem;min-width:0;
}
.lzs-checklist .lzs-icon{color:var(--accent);width:1.15em;height:1.15em;margin-top:.35em}

.lzs-stat-tiles{
  display:grid;
  /* 120px давали на 320px две колонки по 138px: «350% / 16.000 EUR» в 1.35rem
     ломалось на две строки, подпись — ещё на две. */
  grid-template-columns:repeat(auto-fit,minmax(min(150px,100%),1fr));
  gap:.75rem;
}
.lzs-stat-tiles > *{min-width:0}
.lzs-stat-tile{
  background:var(--bg-deep);
  border:1px solid var(--border);
  border-radius:var(--r);
  padding:14px 16px;
  display:flex;flex-direction:column;gap:.25rem;
  /* подписи прижаты к низу — иначе при значении в одну/две строки
     они разъезжались по высоте внутри одного ряда */
  justify-content:space-between;
}
.lzs-stat-tile b{
  font-family:var(--font-head);font-weight:800;
  font-size:clamp(1.05rem,4.5vw,1.35rem);color:var(--accent-2);line-height:1.1;
}
.lzs-stat-tile span{font-size:.75rem;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted)}

.lzs-score{
  display:flex;align-items:center;gap:.85rem;flex-wrap:wrap;min-width:0;
}
.lzs-score__value{
  font-family:var(--font-head);font-size:2.2rem;line-height:1;color:var(--accent);
}
.lzs-score__stars{display:flex;gap:.15rem;color:var(--accent-2)}
.lzs-score__stars .lzs-icon{width:1.1em;height:1.1em}
.lzs-score__label{font-size:.82rem;color:var(--text-muted);letter-spacing:.08em}

/* ============================================================
   NUMBERED LIST
   ============================================================ */
.lzs-steps{list-style:none;counter-reset:lzs-step;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--gap-md)}
.lzs-steps > li{
  counter-increment:lzs-step;
  position:relative;
  padding-inline-start:64px;
  margin:0;min-width:0;
}
.lzs-steps > li::before{
  content:counter(lzs-step,decimal-leading-zero);
  position:absolute;
  inset-inline-start:0;top:-.1em;
  font-family:var(--font-head);
  font-weight:800;
  font-size:1.6rem;
  color:var(--accent);
  line-height:1;
}
.lzs-steps h3{margin:0 0 .35rem}
.lzs-steps p{color:var(--text-muted);margin:0}

/* ============================================================
   STATS BAR — strip pattern
   ============================================================ */
.lzs-stats{
  display:flex;
  flex-wrap:wrap;
  padding-block:var(--gap-sm);
  border-block:1px solid var(--border);
}
.lzs-stats__item{
  flex:1 1 180px;
  min-width:0;
  padding:.5rem var(--gap-sm);
  border-inline-start:1px solid var(--border);
  display:flex;flex-direction:column;gap:.2rem;
}
.lzs-stats__item:first-child{border-inline-start:0;padding-inline-start:0}
.lzs-stats__value{
  font-family:var(--font-head);
  font-size:clamp(1.5rem,2.6vw,2rem);
  line-height:1;
  color:var(--accent-2);
}
.lzs-stats__label{
  font-family:var(--font-data);
  font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--text-muted);
}

/* ============================================================
   CATEGORIES BAR (pills)
   ============================================================ */
.lzs-pills{display:flex;flex-wrap:wrap;gap:.6rem;list-style:none;margin:0;padding:0}
.lzs-pills li{margin:0;min-width:0}
.lzs-pill{
  display:inline-block;
  padding:8px 14px;
  border:1px solid var(--border-strong);
  border-radius:var(--r);
  background:var(--bg-card);
  color:var(--text-muted);
  font-family:var(--font-data);
  font-size:.76rem;
  letter-spacing:.1em;
  text-transform:uppercase;
}
a.lzs-pill{border-bottom:1px solid var(--border-strong)}
a.lzs-pill:hover,a.lzs-pill:focus-visible{background:var(--accent);color:#fff;border-color:var(--accent)}

/* ============================================================
   TOC (Sprungnavigation)
   ============================================================ */
.lzs-toc{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--r);
  padding:var(--pad-card);
  display:flex;flex-direction:column;gap:var(--gap-sm);
}
.lzs-toc__title{
  font-family:var(--font-data);
  font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--accent-text);margin:0;
}
.lzs-toc ol,.lzs-toc ul{
  list-style:none;margin:0;padding:0;
  display:grid;
  /* было minmax(220px) → 4 колонки: нумерованный список приходилось читать
     поперёк. Плюс row-gap .15rem слипал строки с их border-bottom. */
  grid-template-columns:repeat(auto-fit,minmax(min(420px,100%),1fr));
  gap:.4rem 2rem;
  counter-reset:lzs-toc;
}
.lzs-toc li{margin:0;min-width:0;counter-increment:lzs-toc}
.lzs-toc a{
  display:block;
  padding:.75rem 0;
  border-bottom:1px solid var(--border);
  color:var(--text-main);
  font-size:.95rem;
}
.lzs-toc a::before{
  content:counter(lzs-toc,decimal-leading-zero);
  font-family:var(--font-data);
  font-size:.72rem;
  color:var(--accent-2);
  opacity:.7;
  margin-inline-end:.7rem;
}
.lzs-toc a:hover,.lzs-toc a:focus-visible{background:var(--accent-2);color:var(--bg-deep)}

/* ============================================================
   RTP / GAME TILE GRID
   ============================================================ */
.lzs-rtp{
  display:grid;
  gap:clamp(.6rem,1.5vw,1rem);
  grid-template-columns:repeat(2,minmax(0,1fr));
}
@media(min-width:640px){.lzs-rtp{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1224px){.lzs-rtp{grid-template-columns:repeat(4,minmax(0,1fr))}}

.lzs-rtp-item{
  position:relative;
  overflow:hidden;
  min-width:0;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--r);
}
.lzs-rtp-item__thumb{
  display:block;
  aspect-ratio:3/2;
  position:relative;
  background:linear-gradient(135deg,#2A1B12 0%,#3A2013 100%);
}
.lzs-rtp-item__thumb img{width:100%;height:100%;object-fit:cover;display:block}
.lzs-rtp-item__name{
  display:block;
  padding:10px 12px;
  font-size:.85rem;
  color:var(--text-main);
  overflow-wrap:anywhere;
}
/* Провайдер дублировался: он же первый токен тултипа. На touch обе строки
   показывались одновременно. Оставлена одна — полная. */
.lzs-rtp-item__meta{
  display:none;
  padding:0 12px 10px;
  font-family:var(--font-data);
  font-size:.72rem;
  letter-spacing:.08em;
  color:var(--text-muted);
}
/* RTP, волатильность и макс. выигрыш были доступны только по hover и без
   какого-либо признака, что там что-то есть — теперь видны всегда. */
.lzs-rtp-tooltip{
  display:block;
  padding:0 12px 10px;
  font-family:var(--font-data);
  font-size:.74rem;
  line-height:1.45;
  color:var(--accent-2);
}

/* ============================================================
   PROS / CONS
   ============================================================ */
.lzs-proscons{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));
  gap:var(--gap-md);
}
.lzs-proscons > *{min-width:0}
.lzs-proscons__col{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--r);
  padding:var(--pad-card);
  display:flex;flex-direction:column;gap:.85rem;
}
.lzs-proscons__col--pro{border-top:2px solid var(--accent-2)}
.lzs-proscons__col--con{border-top:2px solid var(--accent)}
.lzs-proscons h3{margin:0}
.lzs-proscons ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.6rem}
.lzs-proscons li{display:flex;gap:.6rem;align-items:flex-start;margin:0;color:var(--text-muted);min-width:0}
.lzs-proscons--pro .lzs-icon,.lzs-proscons__col--pro .lzs-icon{color:var(--accent-2)}
.lzs-proscons__col--con .lzs-icon{color:var(--accent)}

/* ============================================================
   FAQ — boxed pattern
   ============================================================ */
.lzs-faq{display:flex;flex-direction:column;gap:.75rem}
.lzs-faq details{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--r);
  padding:0 var(--pad-card);
}
.lzs-faq details[open]{border-color:var(--border-strong)}
.lzs-faq summary{
  cursor:pointer;
  padding:1rem 0;
  font-weight:600;
  list-style:none;
  color:var(--text-main);
  /* вторая строка длинного вопроса заезжала под «+» — висячий отступ.
     Не flex: на <summary> он ломает раскрытие в Safari. */
  display:block;
  padding-inline-start:1.15rem;
  text-indent:-1.15rem;
}
.lzs-faq summary::-webkit-details-marker{display:none}
.lzs-faq summary::before{
  content:'+';
  margin-inline-end:.5rem;
  transition:transform .2s;
  color:var(--accent-text);
  font-family:var(--font-data);
}
.lzs-faq details[open] summary::before{content:'−'}
.lzs-faq details > :not(summary){padding:.5rem 0 1rem;color:var(--text-muted)}
.lzs-faq details > :not(summary):first-of-type{border-top:1px solid var(--border)}

/* ============================================================
   LEGAL BODY
   ============================================================ */
.lzs-legal{counter-reset:lzs-legal;margin-top:var(--gap-lg)}
.lzs-legal > h2{
  counter-increment:lzs-legal;
  margin-top:var(--gap-lg);
  padding-top:var(--gap-md);
  border-top:1px solid var(--border);
  font-size:clamp(1.25rem,2.2vw,1.7rem);
}
.lzs-legal > h2:first-child{margin-top:0;padding-top:0;border-top:0}
.lzs-legal > h2::before{
  content:counter(lzs-legal,decimal-leading-zero) " ";
  font-family:var(--font-data);
  font-size:.72rem;
  letter-spacing:.16em;
  color:var(--accent-text);
  display:block;
  margin-bottom:.5rem;
}
.lzs-legal h3{margin-top:var(--gap-md)}
.lzs-legal p,.lzs-legal li{color:var(--text-muted)}
.lzs-legal address{font-style:normal;color:var(--text-muted)}

/* ============================================================
   CTA BLOCK
   ============================================================ */
.lzs-cta{
  background:var(--bg-card);
  border-block:1px solid var(--accent);
  padding-block:var(--sec-pad);
}
.lzs-cta__inner{
  display:flex;
  flex-direction:column;
  gap:var(--gap-sm);
  align-items:flex-start;
  text-align:start;
}
.lzs-cta h2{margin:0}
.lzs-cta p{color:var(--text-muted);margin:0;max-width:none}
.lzs-cta__actions{display:flex;flex-wrap:wrap;gap:var(--gap-sm);justify-content:flex-start}
.lzs-cta__fine{
  font-family:var(--font-data);
  font-size:.8rem;letter-spacing:.04em;line-height:1.6;
  color:var(--text-muted);margin:0;
}
.lzs-cta--center .lzs-cta__inner{align-items:center;text-align:center}
.lzs-cta--center .lzs-cta__actions{justify-content:center}

/* ---------- notes / callouts ---------- */
.lzs-note{
  border-inline-start:2px solid var(--accent);
  background:var(--bg-card);
  padding:var(--gap-sm) var(--gap-md);
  border-radius:var(--r);
  color:var(--text-muted);
  display:flex;flex-direction:column;gap:.6rem;
}
.lzs-note--warn{border-inline-start-color:var(--accent-2)}
.lzs-note strong{color:var(--text-main)}

/* ============================================================
   STICKY MOBILE NAV
   ============================================================ */
.lzs-sticky-nav{display:none}
@media(max-width:767px){
  .lzs-sticky-nav{
    display:flex;
    position:fixed;
    inset-inline:0;bottom:0;
    z-index:850;
    background:var(--bg-deep);
    border-top:1px solid var(--accent);
  }
  .lzs-sticky-nav a{
    flex:1 1 0;
    min-width:0;
    display:flex;flex-direction:column;align-items:center;gap:.15rem;
    padding:10px 4px;
    border-bottom:0;
    color:var(--text-muted);
    font-family:var(--font-data);
    font-size:.62rem;
    letter-spacing:.1em;
    text-transform:uppercase;
    text-align:center;
  }
  .lzs-sticky-nav a:hover,.lzs-sticky-nav a:focus-visible{background:var(--accent);color:#fff}
  .lzs-sticky-nav .lzs-icon{width:1.2em;height:1.2em}
  body:has(.lzs-sticky-nav){padding-bottom:64px}
}

/* ============================================================
   CHAT WIDGET
   ============================================================ */
.lzs-chat-btn{
  position:fixed;
  inset-inline-end:18px;bottom:18px;
  z-index:880;
  width:52px;height:52px;
  display:flex;align-items:center;justify-content:center;
  background:var(--accent);
  color:#fff;
  border:0;
  border-radius:var(--r);
  cursor:pointer;
}
.lzs-chat-btn:hover,.lzs-chat-btn:focus-visible{background:var(--accent-2);color:var(--bg-deep)}
.lzs-chat{
  display:none;
  position:fixed;
  inset-inline-end:18px;bottom:82px;
  z-index:890;
  width:min(340px,calc(100vw - 36px));
  background:var(--bg-card);
  border:1px solid var(--border-strong);
  border-radius:var(--r);
  padding:var(--pad-card);
  flex-direction:column;
  gap:.8rem;
}
.lzs-chat.is-open{display:flex}
.lzs-chat h3{margin:0;font-size:1rem}
.lzs-chat p{color:var(--text-muted);font-size:.9rem;margin:0}
@media(max-width:767px){
  .lzs-chat-btn{bottom:76px}
  .lzs-chat{bottom:140px}
}

/* ============================================================
   FOOTER
   ============================================================ */
.lzs-footer{
  background:var(--bg-deep);
  border-top:1px solid var(--accent);
  padding-block:var(--sec-pad) var(--gap-lg);
  margin-top:0;
}
.lzs-footer__grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--gap-lg);
}
@media(min-width:760px){
  .lzs-footer__grid{grid-template-columns:1.4fr 1fr 1fr}
}
.lzs-footer__grid > *{min-width:0}
.lzs-footer__brand{display:flex;flex-direction:column;gap:var(--gap-sm);align-items:flex-start}
.lzs-footer__tag{color:var(--text-muted);font-size:.95rem;margin:0}
.lzs-footer__col h3{
  font-family:var(--font-data);
  font-weight:500;
  font-size:.72rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--accent-2);
  margin:0 0 var(--gap-sm);
}
.lzs-footer__col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.25rem}
.lzs-footer__col li{margin:0;min-width:0}
.lzs-footer__col a,.lzs-footer__brand a{color:var(--text-muted);border-bottom:0;font-size:.95rem}
/* ссылки футера были ~26px высотой с зазором 9px — мимо пальца на мобиле */
.lzs-footer__col a{display:inline-block;padding-block:7px}
.lzs-footer__col a:hover,.lzs-footer__col a:focus-visible,
.lzs-footer__brand a:hover,.lzs-footer__brand a:focus-visible{background:var(--accent-2);color:var(--bg-deep)}

.lzs-footer__legal{
  margin-top:var(--gap-lg);
  padding-top:var(--gap-md);
  border-top:1px solid var(--border);
  display:flex;flex-direction:column;gap:var(--gap-sm);
}
.lzs-footer__age{
  display:inline-flex;align-items:center;gap:.6rem;
  font-family:var(--font-data);
  font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--accent-2);
  border:1px solid var(--border-strong);
  border-radius:var(--r);
  padding:8px 14px;
  align-self:flex-start;
}
.lzs-footer__disclaimer{color:var(--text-muted);font-size:.88rem;margin:0;line-height:1.7}
.lzs-footer__help{color:var(--text-muted);font-size:.88rem;margin:0}
.lzs-footer__bottom{
  margin-top:var(--gap-md);
  padding-top:var(--gap-sm);
  border-top:1px solid var(--border);
  font-family:var(--font-data);
  font-size:.8rem;
  letter-spacing:.04em;
  line-height:1.6;
  color:var(--text-muted);
}
.lzs-footer__bottom p{margin:0}

/* ============================================================
   RAIL → TOP BAR under 960px
   ============================================================ */
@media(max-width:959px){
  body{padding-inline-start:0}

  .lzs-header{
    position:sticky;
    inset:0 auto auto 0;
    width:100%;
    flex-direction:column;
    border-inline-end:0;
    border-bottom:1px solid var(--accent);
    overflow:visible;
  }
  .lzs-header__bar{padding:10px var(--gutter);border-bottom:0}
  .lzs-logo__img{max-width:min(45vw,180px);height:auto;max-height:36px}
  .lzs-burger{display:flex}

  .lzs-nav{
    display:none;
    position:absolute;
    top:100%;inset-inline:0;
    background:var(--bg-deep);
    border-bottom:1px solid var(--accent);
    padding:0 0 var(--gap-sm);
    max-height:calc(100vh - 64px);
    overflow-y:auto;
  }
  .lzs-header.is-open .lzs-nav{display:flex}

  .lzs-nav__toggle{display:inline-block}

  /* Раньше было display:none — в мобильной шапке не оставалось ни одной
     кнопки, она показывалась только при открытом бургере. Теперь это узкая
     вторая строка шапки; сам элемент и его ссылка не тронуты. */
  .lzs-header__foot{
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:.5rem var(--gap-sm);
    padding:8px var(--gutter);
    border-top:1px solid var(--border);
  }
  .lzs-header__cta{width:auto;flex:0 0 auto}
  .lzs-header__note{font-size:.72rem;letter-spacing:.04em;line-height:1.4;text-align:end}
  .lzs-header.is-open .lzs-header__foot{
    display:flex;
    position:absolute;
    top:100%;inset-inline:0;
    transform:translateY(100%);
    background:var(--bg-deep);
    border-bottom:1px solid var(--accent);
  }
}
@media(max-width:399px){
  /* 18+-пометку не прячем и не мельчим (комплаенс) — она просто переносится
     на вторую строку, когда не помещается рядом с кнопкой */
  .lzs-header__note{text-align:start;min-width:0}
}
@media(max-width:959px){
  .lzs-header.is-open .lzs-header__foot{position:static;transform:none;border-bottom:0}
  .lzs-header.is-open .lzs-nav{position:static;max-height:none}
  /* Открытое меню выше вьюпорта, а JS лочит скролл body — без собственной
     прокрутки нижние пункты и CTA недостижимы на невысоких экранах. */
  .lzs-header.is-open{
    position:sticky;
    max-height:100vh;
    max-height:100dvh;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
}

@media(max-width:479px){
  :root{--gutter:16px;--pad-card:20px}
  body{font-size:16px}
  .lzs-logo__img{max-width:min(45vw,140px);max-height:32px}
  .lzs-stats__item{flex:1 1 100%;border-inline-start:0;padding-inline-start:0;border-top:1px solid var(--border)}
  .lzs-stats__item:first-child{border-top:0}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
/* sa-responsive-net */
table th{white-space:nowrap}
figure,blockquote,dl,dd,fieldset{margin:0}
/* sa-logo-chip */
.lzs-footer .lzs-logo__img{filter:none;background:transparent;padding:0}
.lzs-footer .lzs-footer__logo-chip{background:transparent;padding:0}
/* sa-logo-fit */
.lzs-logo__img{object-fit:contain}
/* sa-ph-media */
.lzs-page-header:has(.lzs-hero__img){position:relative;overflow:hidden;isolation:isolate;min-height:clamp(200px,30vh,300px);display:flex;flex-direction:column;justify-content:center}
.lzs-page-header:has(.lzs-hero__img) .lzs-hero__img{position:absolute;inset:0;width:100%;height:100%;max-height:none;aspect-ratio:auto;object-fit:cover;margin:0;z-index:0}
.lzs-page-header:has(.lzs-hero__img)::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(10,12,18,.72),rgba(10,12,18,.5))}
:where(.lzs-page-header:has(.lzs-hero__img)>:not(.lzs-hero__img)){position:relative}
.lzs-page-header:has(.lzs-hero__img)>:not(.lzs-hero__img){z-index:2}
.lzs-page-header:has(.lzs-hero__img),.lzs-page-header:has(.lzs-hero__img) h1,.lzs-page-header:has(.lzs-hero__img) a,.lzs-page-header:has(.lzs-hero__img) p,.lzs-page-header:has(.lzs-hero__img) li,.lzs-page-header:has(.lzs-hero__img) span{color:#fff}
/* sa-hero-media */
.lzs-hero:has(>.lzs-hero__img){position:relative;isolation:isolate}
.lzs-hero:has(>.lzs-hero__img)>.lzs-hero__img{z-index:0}
.lzs-hero:has(>.lzs-hero__img)::after{z-index:1}
:where(.lzs-hero:has(>.lzs-hero__img)>:not(.lzs-hero__img)){position:relative}
.lzs-hero:has(>.lzs-hero__img)>:not(.lzs-hero__img){z-index:2}
/* sa-rhythm */
:where(.lzs-table-wrap){margin-block:1.5rem}
:where(main) :where(ul,ol,table,.lzs-table-wrap)+p{margin-block-start:1rem}
/* sa-slot-link */
.lzs-rtp-item,.lzs-rtp-item:hover,.lzs-rtp-item:focus{color:inherit;text-decoration:none;cursor:pointer}
/* sa-rtp-touch */
.lzs-rtp-item__thumb{display:block}
@media (hover:none){.lzs-rtp-item__thumb{aspect-ratio:auto;overflow:visible}.lzs-rtp-item__thumb img{height:auto}.lzs-rtp-tooltip{position:static;opacity:1;background:transparent;border-top:0;padding:0 12px 10px;font-size:.74rem;line-height:1.45}.lzs-rtp-item__name{padding-top:.35rem}}
/* sa-icon-on-fill */
.lzs-nav a:not(.lzs-btn)[aria-current="page"] .lzs-icon{color:inherit}
/* sa-sticky-pad */

/* ============================================================
   FIXES (аудит)
   ============================================================ */

/* Переход на /#bonus с другой страницы браузер отрабатывает нативно, без
   JS-поправки — на мобиле верх секции уезжал под sticky-шапку. */
@media(max-width:959px){
  [id]{scroll-margin-top:80px}
}

/* CTA-блок в секции «Bonus»: юр. приписка вынесена из .lzs-hero__actions
   (там она вставала сбоку от кнопки), нужен собственный ритм. */
.lzs-container > .lzs-hero__actions{margin-block-start:var(--gap-md)}
.lzs-container > .lzs-hero__actions + .lzs-hero__fine{margin-block-start:var(--gap-sm)}

/* Длина строки: при 17px и контейнере 1052px выходило ~140 знаков в строке
   (оптимум 60–80). Сетки, таблицы и карточки ширину не теряют. */
.lzs-section > .lzs-container > p,
.lzs-prose,
.lzs-legal,
.lzs-cta p{max-width:68ch}

/* Кнопка «наверх» (её создаёт JS, right/bottom:18px) в самом низу страницы
   садилась поверх текста футера — резервируем место под неё. */
@media(max-width:767px){
  .lzs-footer{padding-bottom:76px}
  body .lzs-back-top{bottom:calc(18px + env(safe-area-inset-bottom,0px))}
}

/* Skip-link: без него клавиатурой приходилось табать все 12 пунктов рельса. */
.lzs-skip{
  position:fixed;
  inset-block-start:0;inset-inline-start:0;
  z-index:1000;
  transform:translateY(-120%);
  padding:12px 20px;
  background:var(--accent);
  color:#fff;
  border-bottom:0;
  font-family:var(--font-head);
  font-weight:800;
  font-size:.85rem;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.lzs-skip:focus,.lzs-skip:focus-visible{transform:none;background:var(--accent);color:#fff}