/* plinko-slot.click — архетип ticket-stub, namespace tks */

:root{
  --bg:#FFFFFF;          /* фон страницы — светлая тема, как на оригинале */
  --bg-soft:#FFF6F9;     /* очень светлая розовая подложка */
  --surface:#FFE6EF;     /* заливка секций и карточек */
  --surface-2:#FFD3E2;   /* вторая заливка, таблицы и выделенные блоки */
  --line:#FFB9D0;        /* границы, разделители, рамки таблиц */
  --pink:#FF6FA3;        /* основной акцент, фон главной кнопки */
  --pink-soft:#FF9FBD;   /* ховер, второстепенные акценты */
  --pink-mid:#E85F91;    /* активное состояние */
  --pink-deep:#D94F85;   /* нажатие */
  --plum:#4A1D2C;        /* основной текст */
  --plum-soft:#4E3441;   /* подписи, второстепенный текст */
  --gold:#FFBF19;        /* рейтинг, значки, акцент в цифрах */
  --green:#15AC24;       /* «да» в таблицах сравнения */
  --red:#E40539;         /* «нет» в таблицах сравнения */
}

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

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

body{
  margin:0;
  background:var(--bg);
  color:var(--plum);
  font-family:"EB Garamond",Georgia,serif;
  font-size:18px;
  line-height:1.62;
  overflow-x:hidden;
}

h1,h2,h3,.tks-word,.tks-num,.tks-btn,.tks-btn-ghost,.tks-kpi-v,.tks-stub-n{
  font-family:"Play","Trebuchet MS",sans-serif;
}

a{color:var(--pink-mid);text-decoration:none;border-bottom:1px dotted var(--pink)}
a:hover{color:var(--pink-deep)}

/* ---------- корешок: общая геометрия отрывного билета ---------- */

.tks-perf{
  height:14px;
  background:
    radial-gradient(circle at 9px 7px, var(--bg) 0 5px, transparent 5.5px) repeat-x;
  background-size:18px 14px;
  border-top:2px dashed var(--line);
}

.tks-wrap{max-width:1080px;margin:0 auto;padding:0 20px}

/* ---------- шапка: отрывной билет с перфорацией понизу ---------- */

.tks-head{
  position:sticky;top:0;z-index:40;
  background:var(--bg-soft);
  border-bottom:2px solid var(--line);
}
.tks-head-in{
  max-width:1080px;margin:0 auto;padding:12px 20px 10px;
  display:flex;align-items:center;gap:14px;flex-wrap:nowrap;
}
.tks-word{
  font-size:1.32rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--plum);border:0;white-space:nowrap;
}
.tks-word span{color:var(--pink-mid)}
.tks-serial{
  font-size:.7rem;letter-spacing:.22em;color:var(--plum-soft);
  text-transform:uppercase;display:block;line-height:1.2;
}
.tks-head-gap{flex:1 1 auto;min-width:8px}
.tks-stubs{display:flex;align-items:stretch;gap:0;flex:0 0 auto}

/* кнопки-корешки: разделены линией отрыва */
.tks-btn,.tks-btn-ghost{
  display:inline-block;
  padding:.625rem 1.25rem;
  border-radius:20px;
  text-transform:uppercase;
  font-size:.82rem;letter-spacing:.05em;
  white-space:nowrap;
  cursor:pointer;
}
.tks-btn{
  background:var(--pink);color:#FFFFFF;border:2px solid var(--pink);
}
.tks-btn:hover{background:var(--pink-mid);border-color:var(--pink-mid);color:#FFFFFF}
.tks-btn:active{background:var(--pink-deep);border-color:var(--pink-deep)}
.tks-btn-ghost{
  background:transparent;color:var(--pink);border:2px solid var(--pink);
}
.tks-btn-ghost:hover{color:var(--pink-mid);border-color:var(--pink-mid)}
.tks-stubs .tks-btn-ghost{margin-right:10px;position:relative}
.tks-stubs .tks-btn-ghost::after{
  content:"";position:absolute;right:-6px;top:4px;bottom:4px;
  border-right:2px dotted var(--line);
}

/* ---------- корпус ---------- */

main{display:block}

.tks-sec{padding:38px 0 34px;border-bottom:2px dashed var(--line)}
.tks-sec:nth-child(even){background:var(--bg-soft)}
.tks-sec-tint{background:var(--surface)}

h1{
  font-size:2.05rem;line-height:1.2;margin:0 0 14px;letter-spacing:.01em;
}
h2{
  font-size:1.42rem;line-height:1.25;margin:0 0 14px;
  padding-left:14px;border-left:6px solid var(--pink);
}
h3{
  font-size:1.1rem;line-height:1.3;margin:22px 0 8px;color:var(--pink-deep);
}
p{margin:0 0 13px}
ul,ol{margin:0 0 14px;padding-left:22px}
li{margin:0 0 7px}

.tks-lead{font-size:1.12rem;color:var(--plum-soft)}
.tks-mark{color:var(--pink-deep)}
.tks-num{color:var(--plum);background:var(--surface-2);padding:0 .28em;border-radius:5px}
.tks-gold{color:var(--gold)}
.tks-yes{color:var(--green)}
.tks-no{color:var(--red)}
.tks-note{font-size:.92rem;color:var(--plum-soft)}

/* KPI-полоса из пяти корешков */
.tks-kpi{
  display:grid;grid-template-columns:repeat(5,1fr);gap:0;
  margin:22px 0 24px;
  border:2px dashed var(--line);border-radius:12px;background:var(--bg);
  overflow:hidden;
}
.tks-kpi div{
  padding:14px 10px;text-align:center;
  border-right:2px dotted var(--line);
}
.tks-kpi div:last-child{border-right:0}
.tks-kpi-v{display:block;font-size:1.3rem;color:var(--pink-deep);line-height:1.15}
.tks-kpi-k{display:block;font-size:.76rem;text-transform:uppercase;letter-spacing:.07em;color:var(--plum-soft);margin-top:5px}

/* карточка-билет */
.tks-ticket{
  background:var(--bg);
  border:2px solid var(--line);
  border-radius:14px;
  padding:18px 20px;
  margin:18px 0;
  position:relative;
}
.tks-ticket::before,.tks-ticket::after{
  content:"";position:absolute;top:50%;width:16px;height:16px;
  margin-top:-8px;border-radius:50%;background:var(--bg-soft);
  border:2px solid var(--line);
}
.tks-ticket::before{left:-9px}
.tks-ticket::after{right:-9px}
.tks-ticket h3{margin-top:0}

.tks-grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.tks-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}

.tks-chip{
  background:var(--surface);border:1px dashed var(--plum-soft);
  border-radius:10px;padding:12px 14px;
}
.tks-stub-n{
  display:block;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--pink-deep);margin-bottom:5px;
}

/* SVG */
.tks-art{margin:20px 0}
.tks-art svg{display:block;width:100%;max-width:100%;height:auto}
.tks-art figcaption{
  font-size:.86rem;color:var(--plum-soft);margin-top:7px;text-align:center;
}
.tks-art-board svg{max-width:760px;margin:0 auto}
.tks-art-wide svg{max-width:880px;margin:0 auto}

/* таблицы */
.tks-tw{overflow-x:auto;margin:16px 0 8px;border-radius:10px}
table{
  border-collapse:collapse;width:100%;min-width:520px;
  border:1px solid var(--plum);font-size:.95rem;
}
caption{
  caption-side:top;text-align:left;font-size:.88rem;color:var(--plum-soft);
  padding:0 0 7px;
}
th,td{
  border:1px solid var(--plum);padding:8px 10px;text-align:center;
}
thead th{background:var(--surface-2);font-family:"Play","Trebuchet MS",sans-serif;font-size:.84rem;text-transform:uppercase;letter-spacing:.03em}
tbody tr:nth-child(even){background:var(--bg-soft)}

/* FAQ — стопка корешков */
details{
  border:2px dashed var(--line);border-radius:12px;
  background:var(--bg);margin:0 0 10px;padding:10px 16px;
}
details[open]{background:var(--bg-soft)}
summary{
  cursor:pointer;font-family:"Play","Trebuchet MS",sans-serif;
  font-size:1rem;color:var(--plum);list-style:none;
  padding-left:26px;position:relative;
}
summary::-webkit-details-marker{display:none}
summary::before{
  content:"";position:absolute;left:0;top:.42em;
  width:12px;height:12px;border-radius:50%;
  background:var(--surface-2);border:2px solid var(--pink);
}
details[open] summary::before{background:var(--pink)}
details p{margin:11px 0 4px;font-size:.98rem}

/* отзыв */
.tks-quote{
  border-left:6px solid var(--gold);background:var(--surface);
  border-radius:0 12px 12px 0;padding:14px 18px;margin:18px 0;
}
.tks-quote-who{display:block;margin-top:8px;font-size:.85rem;color:var(--plum-soft)}

/* CTA */
.tks-cta{
  text-align:center;background:var(--surface);border:2px dashed var(--pink);
  border-radius:16px;padding:22px 18px;margin:22px 0 6px;
}
.tks-cta p{margin-bottom:14px}

/* подвал */
.tks-foot{
  background:var(--surface-2);padding:26px 0 30px;font-size:.92rem;color:var(--plum-soft);
}
.tks-foot p{margin:0 0 9px}
.tks-age{
  font-family:"Play","Trebuchet MS",sans-serif;
  color:var(--plum);border:2px solid var(--plum);border-radius:20px;
  display:inline-block;padding:7px 16px;margin-top:6px;font-size:.88rem;
}

/* ---------- 640 px ---------- */

@media (max-width:640px){
  body{font-size:17px}
  .tks-head-in{padding:9px 14px 8px;gap:8px}
  .tks-word{font-size:1rem;letter-spacing:.03em}
  .tks-serial{display:none}
  .tks-btn,.tks-btn-ghost{padding:.5rem .72rem;font-size:.7rem;letter-spacing:.02em}
  .tks-stubs .tks-btn-ghost{margin-right:7px}
  .tks-stubs .tks-btn-ghost::after{right:-4px}
  .tks-wrap{padding:0 14px}
  h1{font-size:1.55rem}
  h2{font-size:1.2rem;padding-left:10px;border-left-width:5px}
  .tks-kpi{grid-template-columns:1fr 1fr}
  .tks-kpi div{border-bottom:2px dotted var(--line)}
  .tks-kpi div:nth-child(2n){border-right:0}
  .tks-kpi div:last-child{grid-column:1 / -1;border-bottom:0;border-right:0}
  .tks-grid2,.tks-grid3{grid-template-columns:1fr}
  .tks-ticket{padding:15px 16px}
  .tks-ticket::before,.tks-ticket::after{display:none}
  .tks-tw{overflow-x:auto}
  table{min-width:480px;font-size:.88rem}
  th,td{padding:6px 7px}
  .tks-art svg{max-width:100%;height:auto}
}