/* royals-tiger-de.com — слой редизайна.
   Метод: замена стилей на неизменной разметке. Стили сайта лежат inline в <style>,
   этот файл подключается после них.
   Структурные оси: число вместо карточки (носитель данных) + крупная первая ячейка
   каталога. Signature-слот посева: укрупнённое число как якорь макета. */

:root{
  /* было --color-primary #DCA94B (41° золото). 41° занял casino-godofcoins.com
     в этой же партии, поэтому берём 153° из посева — нефрит. */
  --color-primary:#3fae82;
  --color-primary-dark:#2b7f5e;
  --color-secondary:#c96a3a;
  --color-bg-dark:#141210;      /* тёплый уголь: посев дал paper-warm, но светлая
                                   подложка для казино-аффилиата запрещена */
  --color-bg-card:#1d1a17;
  --color-bg-overlay:rgba(255,255,255,.045);
  --color-border:rgba(240,236,230,.12);
  --color-text:#f0ece6;
  --color-text-muted:rgba(240,236,230,.62);

  /* внешние скругления крупные, внутренние мелкие — разный радиус для внешнего
     и внутреннего это отдельная ось, остальные значения радиуса заняты */
  --radius-sm:6px;
  --radius-md:6px;
  --radius-lg:20px;
  --radius-xl:20px;

  /* шкала 1.200 minor third — плотнее, чем у остальных четырёх */
  --rd-s0:1rem; --rd-s1:1.2rem; --rd-s2:1.44rem;
  --rd-s3:1.728rem; --rd-s4:2.074rem; --rd-s5:2.488rem;

  --rd-head:'Bebas Neue',Impact,sans-serif;
  --rd-body:'Merriweather',Georgia,serif;
  --rd-line:rgba(240,236,230,.12);
}

body{
  background-color:var(--color-bg-dark);
  background-image:radial-gradient(900px 520px at 88% 4%,rgba(63,174,130,.10),transparent 62%);
  background-attachment:fixed;
  color:var(--color-text);
  font-family:var(--rd-body);
  font-size:1rem;line-height:1.78;
}

/* типографика: Bebas Neue капсом против Merriweather — контраст 4.1× */
h1,h2,h3,.section-title,.game-title{
  font-family:var(--rd-head);font-weight:400;
  text-transform:uppercase;letter-spacing:.012em;line-height:.96;
  color:var(--color-text);
}
h1{font-size:clamp(2.4rem,5.4vw,4.1rem);}
h2,.section-title{font-size:var(--rd-s4);}
h3{font-size:var(--rd-s2);}
p{max-width:64ch;}
a{color:var(--color-primary);}

/* ── СТРУКТУРА 1 + signature: число вместо карточки ─────────────────────── */
.table-wrapper table,table{border-collapse:collapse;width:100%;}
.table-wrapper th,table th{
  font-family:var(--rd-head);font-weight:400;text-transform:uppercase;
  letter-spacing:.06em;font-size:1rem;color:var(--color-primary);
  background:none;border:0;border-bottom:2px solid var(--color-primary-dark);
  padding:.6rem .9rem;text-align:left;
}
.table-wrapper td,table td{
  border:0;border-bottom:1px solid var(--rd-line);
  background:none;padding:1rem .9rem;
  font-variant-numeric:tabular-nums;
}
/* значение крупной цифрой без рамки — это и есть носитель данных */
.table-wrapper td:last-child,table td:last-child{
  font-family:var(--rd-head);font-weight:400;
  font-size:clamp(1.5rem,2.6vw,2.1rem);
  line-height:1;color:var(--color-text);letter-spacing:.01em;
}
.table-wrapper td:first-child,table td:first-child{
  color:var(--color-text-muted);font-size:.88rem;width:44%;
}
.table-wrapper{background:none;border:0;border-radius:0;}

/* ── СТРУКТУРА 2: крупная первая ячейка каталога ────────────────────────── */
@media (min-width:900px){
  .top-games{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
  }
  .top-games>.game-card:first-child{
    grid-column:span 2;grid-row:span 2;
  }
  .top-games>.game-card:first-child .game-title{font-size:var(--rd-s4);}
}
.game-card{
  border-radius:var(--radius-lg);overflow:hidden;
  border:1px solid var(--rd-line);background:var(--color-bg-card);
}
.game-card .game-image img,.game-card picture img{width:100%;height:100%;object-fit:cover;}
.game-card .btn{border-radius:var(--radius-sm);}
.game-info{padding:.9rem;}
.game-provider{font-family:var(--rd-body);font-size:.78rem;color:var(--color-text-muted);text-transform:none;}

/* ── секции: спокойный ровный ритм, вся смелость ушла в число ───────────── */
section.section,.screenshot-section{padding-block:clamp(2.2rem,5vw,3.4rem);}
.content-section{border:0;background:none;}
.section-title{margin-bottom:var(--rd-s1);padding-bottom:.5rem;border-bottom:1px solid var(--rd-line);}

/* ── шапка ─────────────────────────────────────────────────────────────── */
.header{background:rgba(20,18,16,.9);backdrop-filter:blur(8px);border-bottom:1px solid var(--rd-line);}
.header .btn{border-radius:var(--radius-sm);font-family:var(--rd-head);letter-spacing:.08em;font-size:1rem;}
.hero .btn-large{border-radius:var(--radius-sm);font-family:var(--rd-head);font-size:1.3rem;letter-spacing:.06em;}

@media (prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important;}}

/* ══ ИТЕРАЦИЯ 2 по замечаниям владельца ═══════════════════════════════════ */

/* ── Book of Dead сплющен по вертикали.
   Картинки игр здесь не <img>, а <div class="game-image"> с ИНЛАЙНОВЫМ
   background-size:100% 100% — это растяжение без сохранения пропорций. Пока все
   ячейки были одного размера, искажение было незаметным; моя укрупнённая первая
   ячейка (562x668) его проявила.
   Правим ТОЛЬКО укрупнённую ячейку, остальные остаются ровно как были. */
@media (min-width:900px){
  .top-games>.game-card:first-child{display:flex;flex-direction:column;}
  .top-games>.game-card:first-child .game-image{
    background-size:cover !important;
    flex:1 1 auto;min-height:0;height:auto;
  }
  .top-games>.game-card:first-child .game-info{flex:0 0 auto;}
}

/* ── подвал: мой глобальный p{max-width} обрезал абзац в подвале.
   Мера набора нужна только основному тексту. */
p{max-width:none;}
main p,.content-section p{max-width:64ch;}
footer p{max-width:none;}
