/* Chicken Road DO — «Ночная дорога».
   Золото только для кнопок, активного пункта меню, подсветки строки и подложки «совет»;
   цвета уровней (Fácil/Medio/Duro/Hardcore) только для пилюль и графиков уровней. */
:root {
	--ink: #FFFFFF;
	--text: #B5B5B5;
	--muted: #7A7A7A;
	--bg: #000000;
	--alt: #0D0D0D;
	--card: #0D0D0D;
	--line: #262626;
	--pill: #141414;
	--field: linear-gradient(135deg, #2E3150, #3F4462);
	--field-c: #3F4462;
	--link: #9AA3E0;
	--link-h: #FFFFFF;
	--gold: linear-gradient(180deg, #F8D03D, #F4BC41);
	--y: #E9C042;
	--y-h: #E9C042;
	--coin: #C59741;
	--easy: #5DB36A;
	--mid: #4C8DF6;
	--hard: #F28C28;
	--hc: #E5484D;
	--good: #5DB36A;
	--bad: #E5484D;
	--info-bg: #161827;
	--tip-bg: #1F1A0A;
	--warn-bg: #22110C;
	--warn: #F28C28;
	--r: 16px;
	--wrap: 1200px;
	--prose: 760px;
	--sec: 64px;
	--head: 72px;
	--f-h: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
	--f-t: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
	color-scheme: dark;
}
*, *::before, *::after { box-sizing: border-box; }
html { overflow-x: clip; scroll-padding-top: calc(var(--head) + 16px); -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--text); font: 400 17px/1.65 var(--f-t); -webkit-font-smoothing: antialiased; overflow-x: clip; }
img, svg { max-width: 100%; height: auto; }
a { color: var(--link); }
a:hover { color: var(--link-h); }
h1, h2, h3, h4 { font-family: var(--f-h); color: var(--ink); margin: 0; text-wrap: balance; letter-spacing: -.01em; }
.cr-skip { position: absolute; left: -999px; top: 8px; z-index: 200; background: var(--y); color: var(--ink); padding: 8px 14px; border-radius: 8px; font-weight: 700; }
.cr-skip:focus { left: 12px; }
:focus-visible { outline: 3px solid rgba(91, 63, 214, .45); outline-offset: 2px; }
.cr-wrap { max-width: var(--wrap); margin-inline: auto; padding-inline: max(20px, env(safe-area-inset-left, 0px)) max(20px, env(safe-area-inset-right, 0px)); }
.cr-i { width: 22px; height: 22px; flex: none; display: inline-block; vertical-align: middle; }
td, .cr-metric b, .cr-mult, .cr-bar b, .cr-ladder b, .cr-seg span, .cr-bell span { font-variant-numeric: tabular-nums; }

/* кнопки */
.cr-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 14px 26px; border-radius: 12px; font: 700 14px/1 var(--f-t); letter-spacing: .06em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: background .15s, transform .15s; white-space: nowrap; }
.cr-btn--cta { background: var(--gold); color: #111 !important; border: 0; }
.cr-btn--cta:hover { background: var(--y); }
.cr-btn--cta:active { transform: translateY(1px); }
.cr-btn--ghost { background: transparent; color: #fff !important; border: 2px solid #fff; }
.cr-btn--ghost:hover { background: #fff; color: #111 !important; }
.cr-btn--dark { background: #1D1D1D; color: #fff !important; border: 1px solid var(--line); }
.cr-btn--dark:hover { background: #2A2A2A; }
.cr-btn--sm { min-height: 42px; padding: 11px 18px; font-size: 13px; }
.cr-btn[data-pending] { cursor: not-allowed; }
.cr-tri { font-size: 11px; }

/* шапка */
.cr-head { position: sticky; top: 0; z-index: 60; background: #000; border-bottom: 1px solid #141414; }
.cr-head__in { height: var(--head); display: flex; align-items: center; gap: 28px; }
.cr-logo { display: inline-flex; align-items: center; gap: 9px; text-decoration: none; color: #fff !important; font: 800 20px/1 var(--f-h); letter-spacing: -.01em; }
.cr-logo img { width: 36px; height: 36px; }
.cr-logo b { font-weight: 800; color: #fff; margin-left: 4px; }
.cr-logo em { font-style: normal; font-size: 12px; letter-spacing: .06em; background: #1D1D1D; border: 1px solid var(--line); color: #fff; padding: 4px 6px; border-radius: 6px; margin-left: 2px; }
.cr-nav { margin-left: auto; }
.cr-nav ul { list-style: none; margin: 0; padding: 4px; display: flex; gap: 2px; background: var(--pill); border: 1px solid #2A2A2A; border-radius: 999px; }
.cr-nav a { display: block; padding: 9px 13px; color: var(--text); text-decoration: none; font: 600 14.5px/1 var(--f-t); position: relative; border-radius: 999px; white-space: nowrap; }
.cr-nav a::after { content: ""; position: absolute; left: 13px; right: 13px; bottom: 3px; height: 2px; border-radius: 2px; background: var(--y); transform: scaleX(0); transition: transform .18s; }
.cr-nav a:hover, .cr-nav a[aria-current] { color: #fff; }
.cr-nav a:hover::after, .cr-nav a[aria-current]::after { transform: scaleX(1); }
.cr-burger { display: none; }

/* hero */
.cr-hero { padding: 40px 0 44px; background: #000; position: relative; isolation: isolate; }
.cr-hero:not(.cr-hero--home)::before { content: ""; position: absolute; inset: 0 0 0 auto; width: 46%; z-index: -1; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='62' height='30'%3E%3Crect x='30' y='0' width='2' height='16' rx='1' fill='%232A2D45'/%3E%3C/svg%3E") repeat; -webkit-mask: linear-gradient(100deg, transparent 5%, #000 70%); mask: linear-gradient(100deg, transparent 5%, #000 70%); }
.cr-hero--home { background: var(--field); padding: 48px 0 56px; }
.cr-hero__in { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; align-items: center; }
.has-art .cr-hero__in { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); }
.cr-hero__txt { min-width: 0; }
.cr-hero h1 { font-size: 44px; line-height: 1.1; font-weight: 800; letter-spacing: -.025em; max-width: 760px; }
.cr-hero__txt > p, .cr-hero__txt > .cr-note { margin: 18px 0 0; max-width: 640px; font-size: 18px; color: #C9C9D6; }
.cr-hero__txt > .cr-note { font-size: 16px; }
.cr-hero__cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.cr-hero__terms { font-size: 13px !important; color: var(--muted) !important; margin-top: 12px !important; }
.cr-hero__art { min-width: 0; display: grid; place-items: center; }
.cr-crumbs ol { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-wrap: wrap; font-size: 14px; color: var(--muted); }
.cr-crumbs li + li::before { content: "/"; margin: 0 9px; color: #C3C6CE; }
.cr-crumbs a { color: var(--muted); text-decoration: none; }
.cr-crumbs a:hover { color: var(--link); text-decoration: underline; }

/* доска Plinko */

/* переключатель «Jugar por dinero real» */

/* телефон / скриншоты */
.cr-phone { width: min(100%, 230px); aspect-ratio: 9 / 16; margin: 0; border-radius: 30px; border: 8px solid #1D1D1D; box-shadow: 0 0 0 1px #333; background: var(--field); display: grid; place-content: center; justify-items: center; gap: 10px; color: #C9C9D6; font: 600 14px/1.3 var(--f-t); text-align: center; padding: 16px; }
.cr-phone .cr-i, .cr-shot .cr-i { width: 34px; height: 34px; color: var(--link); }
.cr-shot { aspect-ratio: 16 / 9; margin: 16px 0; border-radius: var(--r); background: var(--field); border: 1px dashed #4A4F70; display: grid; place-content: center; justify-items: center; color: #C9C9D6; font: 600 15px/1.3 var(--f-t); }
.cr-shot span, .cr-phone span { display: grid; justify-items: center; gap: 8px; }
.cr-shot small, .cr-phone small { font: 500 12px/1.3 ui-monospace, Menlo, monospace; color: var(--muted); }
.cr-shot.has-img, .cr-phone.has-img { border: 0; background: none; padding: 0; overflow: hidden; }
.cr-shot.has-img img, .cr-phone.has-img img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* партнёрская полоса */
.cr-strip { margin-top: 28px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 24px; background: var(--field); border-radius: var(--r); padding: 20px 26px; }
.cr-hero--home + .cr-wrap .cr-strip { margin-top: 24px; border: 1px solid #4A4F70; }
.cr-strip img { width: 110px; height: auto; display: block; }
.cr-strip__b { display: grid; gap: 4px; min-width: 0; }
.cr-strip__b b { font: 800 21px/1.2 var(--f-h); color: #fff; }
.cr-strip__b small { font-size: 13px; color: #A9ADC8; }

/* оглавление */
.cr-toc { margin: 20px auto 0; border: 1px solid var(--line); background: var(--card); border-radius: var(--r); padding: 18px 22px; max-width: var(--prose); }
.cr-toc b { font: 700 14px/1 var(--f-t); text-transform: uppercase; letter-spacing: .08em; color: var(--ink); }
.cr-toc ol { margin: 12px 0 0; padding-left: 22px; columns: 2; column-gap: 32px; font-size: 15.5px; }
.cr-toc li { break-inside: avoid; margin-bottom: 6px; }
.cr-toc a { text-decoration: none; }
.cr-toc a:hover { text-decoration: underline; }

/* секции и текст */
.cr-sec { padding-block: var(--sec); }
.cr-sec--alt { background: var(--alt); }
main > .cr-wrap + .cr-sec { margin-top: 24px; }
.cr-prose > * { max-width: var(--prose); margin-inline: auto; }
.cr-prose > * + * { margin-top: 16px; }
.cr-prose > .cr-table, .cr-prose > .cr-cards, .cr-prose > .cr-compare, .cr-prose > .cr-pc, .cr-prose > .cr-game, .cr-prose > .cr-bell, .cr-prose > .cr-ladder, .cr-prose > .cr-risk3, .cr-prose > .cr-steps:not(.cr-steps--v), .cr-prose > .cr-faq { max-width: var(--wrap); }
.cr-prose > .cr-faq { max-width: var(--prose); }
.cr-prose h2 { font-size: 30px; line-height: 1.2; font-weight: 700; margin-bottom: 22px; }
.cr-prose h3 { font-size: 21px; line-height: 1.3; font-weight: 700; margin-top: 32px; }
.cr-prose h4 { font-size: 18px; line-height: 1.3; font-weight: 700; }
.cr-prose p { margin-bottom: 0; }
.cr-prose strong, .cr-prose b { color: var(--ink); font-weight: 600; }
.cr-prose a:not(.cr-btn) { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }

/* списки */
.cr-ul, .cr-ol { list-style: none; padding: 0; }
.cr-ul > li, .cr-ol > li { position: relative; padding-left: 30px; }
.cr-ul > li + li, .cr-ol > li + li { margin-top: 9px; }
.cr-ul > li::before { content: ""; position: absolute; left: 5px; top: .5em; width: 12px; height: 12px; border-radius: 50%; background: var(--field-c); box-shadow: 0 0 0 2px #6B7099; }
.cr-ol { counter-reset: n; }
.cr-ol > li { counter-increment: n; padding-left: 42px; }
.cr-ol > li::before { content: counter(n); position: absolute; left: 0; top: -1px; width: 29px; height: 29px; border-radius: 50%; background: var(--gold); color: #111; font: 800 14px/29px var(--f-t); text-align: center; box-shadow: inset 0 0 0 2px var(--coin); }
.cr-ul--check > li::before, .cr-ul--warn > li::before { top: .15em; left: 0; width: 21px; height: 21px; border-radius: 50%; color: #fff; font: 800 12px/21px var(--f-t); text-align: center; }
.cr-ul--check > li::before { content: "✓"; background: var(--good); box-shadow: none; }
.cr-ul--warn > li::before { content: "!"; background: var(--warn); box-shadow: none; }

/* шаги */
.cr-steps { list-style: none; padding: 0; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 18px; }
.cr-steps > li { position: relative; display: grid; gap: 12px; align-content: start; font-size: 15.5px; line-height: 1.5; margin: 0; }
.cr-steps__n { width: 42px; height: 42px; border-radius: 50%; background: var(--gold); color: #111; display: grid; place-items: center; font: 800 18px/1 var(--f-h); position: relative; z-index: 1; box-shadow: inset 0 0 0 3px var(--coin); }
.cr-steps__n .cr-i { width: 22px; height: 22px; }
.cr-steps > li::after { content: ""; position: absolute; top: 20px; left: 52px; right: -10px; height: 2px; background: repeating-linear-gradient(90deg, #3A3A3A 0 8px, transparent 8px 16px); }
.cr-steps > li:last-child::after { display: none; }
.cr-steps b { display: block; color: var(--ink); font-weight: 700; }
.cr-steps--v { grid-auto-flow: row; gap: 0; }
.cr-steps--v > li { grid-template-columns: 42px minmax(0, 1fr); gap: 16px; padding-bottom: 22px; }
.cr-steps--v > li::after { top: 46px; left: 20px; right: auto; bottom: 2px; width: 2px; height: auto; background: repeating-linear-gradient(180deg, #3A3A3A 0 8px, transparent 8px 16px); }
.cr-steps--v > li:last-child { padding-bottom: 0; }
.cr-steps--v b { display: inline; }

/* подложки */
.cr-note { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 14px; padding: 18px 20px; border-radius: 12px; border-left: 4px solid; }
.cr-note > div > * + * { margin-top: 10px; }
.cr-note--info { background: var(--info-bg); border-color: var(--link); }
.cr-note--info .cr-note__i { color: var(--link); }
.cr-note--tip { background: var(--tip-bg); border-color: var(--y); }
.cr-note--tip .cr-note__i { color: var(--y); }
.cr-note--warn { background: var(--warn-bg); border-color: var(--warn); }
.cr-note--warn .cr-note__i { color: var(--warn); }

/* таблицы */
.cr-table { overflow-x: auto; border-radius: 12px; border: 1px solid var(--line); -webkit-overflow-scrolling: touch; background: var(--alt); }
.cr-table table { width: 100%; border-collapse: collapse; font-size: 15.5px; line-height: 1.45; }
.cr-cols-2 table { min-width: 420px; }
.cr-cols-3 table { min-width: 480px; }
.cr-cols-4 table { min-width: 560px; }
.cr-cols-5 table, .cr-cols-6 table { min-width: 720px; }
.cr-table th { background: var(--field-c); color: #fff; font: 600 14px/1.3 var(--f-t); text-align: left; padding: 13px 16px; white-space: nowrap; }
.cr-table th .cr-i { width: 18px; height: 18px; margin-right: 4px; vertical-align: -4px; }
.cr-table td { padding: 12px 16px; border-top: 1px solid var(--line); color: #E6E6E6; vertical-align: middle; }
.cr-table tbody tr:nth-child(odd) td { background: #0D0D0D; }
.cr-table tbody tr:nth-child(even) td { background: #141414; }
.cr-table tr.is-hl td { background: #2A2410 !important; font-weight: 700; color: #fff; }
.cr-table tr.is-hl td:first-child { box-shadow: inset 4px 0 0 var(--y); }
.cr-table td:first-child { font-weight: 600; }
.cr-table.is-center th:not(:first-child), .cr-table.is-center td:not(:first-child) { text-align: center; }
.cr-table.is-center td:not(:first-child) .cr-chips { justify-content: center; }
.cr-sticky th:first-child, .cr-sticky td:first-child { position: sticky; left: 0; z-index: 1; }
.cr-sticky td:first-child { box-shadow: 1px 0 0 var(--line); }

/* пилюли, множители, полосы */
.cr-pill { display: inline-flex; align-items: center; justify-content: center; min-width: 46px; padding: 5px 11px; border-radius: 999px; font: 700 13px/1.1 var(--f-t); background: #1D1D1D; color: #fff; white-space: nowrap; }
.cr-pill--easy { background: var(--easy); color: #fff; }
.cr-pill--mid { background: var(--mid); color: #fff; }
.cr-pill--hard { background: var(--hard); color: #111; }
.cr-pill--hc { background: var(--hc); color: #fff; }
.cr-pill--yes { background: rgba(93, 179, 106, .16); color: #7FD08B; box-shadow: inset 0 0 0 1px rgba(93, 179, 106, .45); }
.cr-pill--no { background: rgba(229, 72, 77, .14); color: #FF8A8E; box-shadow: inset 0 0 0 1px rgba(229, 72, 77, .45); }
.cr-mult { display: inline-block; padding: 5px 11px; border-radius: 999px; background: var(--field-c); color: #fff; font: 700 13.5px/1.1 var(--f-t); box-shadow: inset 0 0 0 2px var(--coin); }

/* метрики */
.cr-metric { display: inline-grid; gap: 3px; padding: 12px 18px; border-radius: 12px; background: var(--card); border: 1px solid var(--line); vertical-align: middle; margin: 0 10px 6px 0; }
.cr-metric b { font: 800 28px/1 var(--f-h); color: #fff; letter-spacing: -.01em; }
.cr-metric.is-bad b { color: var(--bad); }
.cr-metrics { display: flex; flex-wrap: wrap; gap: 12px; }
.cr-metrics .cr-metric { margin: 0; flex: 1 1 180px; }
.cr-metric small { font-size: 13px; color: var(--muted); font-weight: 500; }
.cr-note .cr-metric { float: right; margin: 0 0 8px 16px; }

/* чипы */
.cr-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.cr-chip { display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 12px 0 5px; background: #141414; border: 1px solid var(--line); border-radius: 10px; font: 600 14px/1 var(--f-t); color: #fff; white-space: nowrap; vertical-align: middle; }
.cr-chip > i { display: inline-grid; place-items: center; min-width: 24px; height: 24px; padding: 0 3px; border-radius: 7px; background: var(--c); color: #fff; font: 800 11px/1 var(--f-t); font-style: normal; }
.cr-chip > i.is-long { font-size: 9.5px; }
.cr-chip--mark { padding: 0 5px; }
.cr-chip > .cr-i { width: 20px; height: 20px; color: var(--link); margin-left: 4px; }

/* сравнение, плюсы/минусы, карточки */
.cr-compare, .cr-pc { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.cr-compare > div, .cr-pc__col, .cr-card { min-width: 0; background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 22px; }
.cr-compare > div > * + * { margin-top: 10px; }
.cr-compare > div:first-child { border-top: 3px solid #fff; }
.cr-compare > div:last-child { border-top: 3px solid var(--field-c); }
.cr-pc__col h4 { margin-bottom: 12px; }
.cr-pc__col p { display: flex; gap: 10px; align-items: flex-start; margin: 8px 0 0; }
.cr-pc__col .cr-i { width: 22px; height: 22px; padding: 4px; border-radius: 50%; color: #fff; margin-top: 2px; stroke-width: 2.6; }
.is-pro { border-top: 3px solid var(--good) !important; }
.is-pro .cr-i { background: var(--good); }
.is-con { border-top: 3px solid var(--bad) !important; }
.is-con .cr-i { background: var(--bad); }
.cr-cards { display: grid; gap: 16px; }
.cr-cards--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 900px !important; }
.cr-card h4 { margin: 12px 0 6px; }
.cr-card p { margin: 0; font-size: 15.5px; line-height: 1.55; }
.cr-card__i { width: 44px; height: 44px; border-radius: 12px; background: var(--field); color: #fff; display: grid; place-items: center; }

/* блок игры */
.cr-game { border-top: 1px solid var(--line); padding-top: 8px; max-width: var(--prose) !important; }
.cr-game h3 { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.cr-game > * + * { margin-top: 14px; }
.cr-game__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 22px; align-items: start; }
.cr-game__txt > * + * { margin-top: 12px; }
.cr-game__row.is-single { grid-template-columns: minmax(0, 1fr); }
.cr-game .cr-shot { margin: 0; }

/* CTA в тексте, цитата */
.cr-ctablock { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; background: var(--field); color: #fff; border-radius: var(--r); padding: 20px 24px; }
.cr-ctablock p { margin: 0; color: #fff; font-weight: 600; }
.cr-quote { margin: 24px auto 0; padding: 24px 28px; border-left: 4px solid var(--field-c); background: var(--alt); border-radius: 0 var(--r) var(--r) 0; }
.cr-quote p { margin: 0; font: 700 21px/1.4 var(--f-h); color: #fff; }

/* графики: колокол, распределение, лестница */
.cr-ladder { margin: 20px auto 0; background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 20px 20px 12px; }
.cr-ladder ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; align-items: end; height: 220px; }
.cr-ladder li { height: 100%; display: grid; grid-template-rows: 1fr auto; gap: 6px; min-width: 0; }
.cr-ladder i { align-self: end; height: var(--h); min-height: 6px; border-radius: 6px 6px 0 0; background: linear-gradient(180deg, var(--hc), #7A2326); }
.cr-ladder li:nth-child(-n+3) i { background: #3A3D58; }
.cr-ladder b { font: 700 13px/1 var(--f-t); color: #fff; text-align: center; }
.cr-ladder figcaption { font-size: 13px; color: var(--muted); margin-top: 10px; }

/* FAQ */
.cr-faq { display: grid; gap: 10px; }
.cr-faq__it { border: 1px solid var(--line); border-radius: 12px; background: var(--card); }
.cr-faq__it summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 20px; }
.cr-faq__it summary::-webkit-details-marker { display: none; }
.cr-faq__it summary h3 { margin: 0; font-size: 18px; }
.cr-faq__pm { position: relative; width: 30px; height: 30px; border-radius: 50%; background: #1D1D1D; flex: none; }
.cr-faq__pm::before, .cr-faq__pm::after { content: ""; position: absolute; left: 9px; right: 9px; top: 14px; height: 2px; background: #fff; border-radius: 2px; transition: transform .2s; }
.cr-faq__pm::after { transform: rotate(90deg); }
.cr-faq__it[open] .cr-faq__pm::after { transform: none; }
.cr-faq__a { padding: 0 20px 18px; }
.cr-faq__a p { margin: 0; }

/* футер */
.cr-foot { border-top: 1px solid var(--line); padding: 48px 0 calc(28px + var(--float, 0px)); background: #141414; font-size: 15px; }
.cr-foot__top { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); gap: 32px; }
.cr-foot__brand p { margin: 12px 0 0; max-width: 360px; color: var(--text); }
.cr-foot h4 { font: 800 13px/1 var(--f-t); letter-spacing: .1em; text-transform: uppercase; color: #fff; }
.cr-foot ul { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 9px; }
.cr-foot a:not(.cr-logo) { color: var(--text); text-decoration: none; }
.cr-foot a:not(.cr-logo):hover { color: #fff; }
.cr-foot__rg { margin: 16px 0 0; font-weight: 600; }
.cr-foot__badges { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 28px; }
.cr-b18 { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 2px solid #fff; font: 800 14px/1 var(--f-h); color: #fff; flex: none; vertical-align: middle; }
.cr-hero .cr-b18 { margin-right: 10px; }
.cr-brg { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border: 1px solid var(--line); border-radius: 999px; font-size: 13.5px; font-weight: 600; color: #fff; }
.cr-brg .cr-i { width: 16px; height: 16px; }
.cr-foot__disc { margin: 22px 0 0; font-size: 13.5px; color: var(--muted); max-width: 820px; }
.cr-foot__copy { margin: 8px 0 0; font-size: 13.5px; color: var(--muted); }

/* демо игр: обложка → iframe по клику; вкладки на /demo/ */
.cr-demo { margin: 0; display: grid; gap: 8px; min-width: 0; }
.cr-demo__cover, .cr-demo iframe { aspect-ratio: 16 / 9; width: 100%; border-radius: var(--r); display: block; }
.cr-demo iframe { border: 0; background: #111; }
.cr-demo__cover { position: relative; overflow: hidden; background: var(--field); border: 1px solid #4A4F70; display: grid; place-items: center; }
.cr-demo__cover .cr-road { position: absolute; inset: 50% auto auto 50%; transform: translate(-50%, -50%); width: 96%; max-width: none; opacity: .35; }
.cr-demo__cap { position: relative; display: grid; justify-items: center; gap: 4px; text-align: center; padding: 14px 18px; background: rgba(0, 0, 0, .78); border: 1px solid var(--line); border-radius: 14px; }
.cr-demo__cap b { font: 800 20px/1.1 var(--f-h); color: var(--ink); }
.cr-demo__cap small { font-size: 13px; color: var(--muted); margin-bottom: 6px; }
.cr-demo figcaption { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; font-size: 13px; color: var(--muted); }
.cr-demo figcaption a { color: var(--link); }
.cr-demo-stage { padding: 8px 0 12px; }
.cr-demo-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.cr-demo-tab { display: grid; gap: 2px; text-align: left; padding: 10px 16px; border: 1.5px solid var(--line); border-radius: 12px; background: var(--card); cursor: pointer; font: 700 15px/1.2 var(--f-t); color: var(--ink); }
.cr-demo-tab small { font: 500 12px/1 var(--f-t); color: var(--muted); }
.cr-demo-tab.is-on { border-color: var(--y); box-shadow: inset 0 -3px 0 var(--y); }
.cr-demo-stage .cr-demo__cover, .cr-demo-stage .cr-demo iframe { max-height: 680px; }
.cr-bar { display: inline-grid; grid-template-columns: minmax(70px, 120px) auto; gap: 10px; align-items: center; }
.cr-bar i { height: 8px; border-radius: 6px; background: linear-gradient(90deg, var(--hard) var(--w), #2A2A2A var(--w)); }
.cr-bar b { font-weight: 700; color: var(--ink); }
.cr-at { margin-left: 6px; color: var(--text); font-weight: 600; white-space: nowrap; }
.cr-demo-note { margin: 10px 0 0; font-size: 13px; color: var(--muted); }
.cr-split__art .cr-demo { width: 100%; }

/* floating bar */
.cr-float { position: fixed; z-index: 70; left: 0; right: 0; bottom: 0; display: flex; align-items: center; gap: 16px; background: #141414; color: #fff; border-top: 1px solid var(--line); padding: 10px max(16px, calc((100% - 1160px) / 2)) calc(10px + env(safe-area-inset-bottom, 0px)); }
.cr-float[hidden] { display: none; }
.cr-float img { width: 84px; height: auto; flex: none; }
.cr-float__b { flex: 1; min-width: 0; font: 600 15px/1.3 var(--f-t); }

.cr-demo-flag { position: fixed; z-index: 90; left: 12px; bottom: calc(80px + env(safe-area-inset-bottom, 0px)); background: var(--hc); color: #fff; font: 700 12px/1 var(--f-t); padding: 8px 11px; border-radius: 999px; letter-spacing: .02em; }

/* адаптив */
@media (max-width: 1060px) {
	.cr-nav a { padding: 16px 0; font-size: 19px; border-bottom: 1px solid var(--line); border-radius: 0; color: #fff; }
	.cr-head__in { gap: 16px; }
}
@media (max-width: 960px) {
	:root { --sec: 48px; --head: 64px; }
	.cr-burger { display: inline-grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 10px; background: #141414; color: #fff; cursor: pointer; margin-left: 8px; }
	.cr-burger .is-c { display: none; }
	.cr-burger[aria-expanded="true"] .is-o { display: none; }
	.cr-burger[aria-expanded="true"] .is-c { display: block; }
	.cr-head__in > .cr-btn { margin-left: auto; }
	body.is-rg .cr-burger { margin-left: auto; }
	.cr-nav { position: fixed; inset: var(--head) 0 0 0; background: #000; padding: 12px max(20px, env(safe-area-inset-left, 0px)); margin: 0; transform: translateY(-8px); visibility: hidden; opacity: 0; transition: opacity .18s, transform .18s, visibility .18s; overflow-y: auto; }
	.cr-nav.is-open { transform: none; visibility: visible; opacity: 1; }
	.cr-nav ul { flex-direction: column; gap: 0; background: none; border: 0; padding: 0; border-radius: 0; }
	.cr-nav a { padding: 16px 0; font-size: 19px; border-bottom: 1px solid var(--line); border-radius: 0; color: #fff; }
	.cr-nav a::after { left: 0; right: auto; width: 32px; bottom: 8px; }
	.has-art .cr-hero__in { grid-template-columns: minmax(0, 1fr); }
	.cr-hero__art { order: 2; }
	.cr-steps { grid-auto-flow: row; gap: 0; }
	.cr-steps > li { grid-template-columns: 42px minmax(0, 1fr); gap: 16px; padding-bottom: 22px; }
	.cr-steps > li::after { top: 46px; left: 20px; right: auto; bottom: 2px; width: 2px; height: auto; background: repeating-linear-gradient(180deg, #3A3A3A 0 8px, transparent 8px 16px); }
	.cr-steps > li:last-child { padding-bottom: 0; }
	.cr-steps b { display: inline; }
	.cr-foot__top { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
	.cr-foot__brand { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
	:root { --sec: 40px; }
	body { font-size: 16.5px; }
	.cr-head__in > .cr-btn { display: none; }
	.cr-burger { display: inline-grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 10px; background: #141414; color: #fff; cursor: pointer; margin-left: 8px; }
	.cr-logo { font-size: 21px; }
	.cr-hero { padding: 26px 0 32px; }
	.cr-hero h1 { font-size: 30px; }
	.cr-hero__txt > p { font-size: 17px; }
	.cr-hero__cta .cr-btn { flex: 1 1 100%; }
	.cr-prose h2 { font-size: 24px; }
	.cr-prose h3 { font-size: 19px; }
	.cr-strip { grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 18px; }
	.cr-strip .cr-btn { width: 100%; }
	.cr-toc ol { columns: 1; }
	.cr-compare, .cr-pc, .cr-cards--2, .cr-cards--2w, .cr-game__row, .cr-split, .cr-demo3, .cr-withlogo { grid-template-columns: minmax(0, 1fr); }
	.cr-hbar { grid-template-columns: 90px minmax(0, 1fr); }
	.cr-hbar b { grid-column: 2; font-size: 12.5px; margin-top: -6px; }
	.cr-game__row .cr-shot, .cr-game__row .cr-demo { order: -1; }
	.cr-demo__cap b { font-size: 17px; }
	.cr-demo__cap { padding: 10px 12px; }
	.cr-demo__cap .cr-btn { min-height: 40px; padding: 10px 14px; font-size: 12.5px; }
	.cr-note { grid-template-columns: minmax(0, 1fr); gap: 8px; padding: 16px; }
	.cr-note .cr-metric { float: none; display: inline-grid; margin: 0 0 6px; }
	.cr-prose p > .cr-metric { display: flex; flex-direction: column; width: max-content; margin: 0 0 10px; }
	.cr-ladder { padding: 14px 10px 10px; }
	.cr-ladder ol { gap: 4px; height: 180px; }
	.cr-ladder b { font-size: 10px; }
	.cr-ctablock .cr-btn { width: 100%; }
	.cr-quote p { font-size: 19px; }
	.cr-foot__top { grid-template-columns: minmax(0, 1fr); gap: 24px; }
	.cr-float { gap: 10px; padding: 8px 8px 8px 12px; }
	.cr-float img { width: 64px; }
	.cr-float__b { font-size: 13px; }
	.cr-float .cr-btn { padding-inline: 12px; }
	.cr-float .cr-tri { display: none; }
}
/* дорога (hero) */
.cr-road { width: 100%; max-width: 520px; }
.cr-road__bg { fill: #23263B; stroke: #4A4F70; }
.cr-road__dash { stroke: #4A4F70; stroke-width: 2; stroke-dasharray: 14 12; }
.cr-road__hole { fill: #14162A; stroke: #5A6085; stroke-width: 2; }
.cr-road__coin { fill: #3F4462; stroke: #C59741; stroke-width: 3; }
.cr-road text { fill: #fff; font: 700 11.5px var(--f-t); }
.cr-road__car rect { fill: #E5484D; }
.cr-road__car:nth-of-type(2n) rect { fill: #4C8DF6; }
.cr-road__car .cr-road__glass { fill: #111; opacity: .55; }

/* тепловая карта */
.cr-heat { display: inline-block; min-width: 64px; padding: 5px 8px; border-radius: 8px; background: hsl(var(--hue) 55% 18%); color: hsl(var(--hue) 75% 70%); font-weight: 700; }
.cr-heatmap th .cr-pill { font-size: 12px; }
.cr-flag { display: inline-block; margin-left: 6px; padding: 3px 7px; border-radius: 6px; background: var(--warn-bg); color: var(--warn); font: 700 11px/1 var(--f-t); text-transform: uppercase; letter-spacing: .06em; }
.cr-flagrows tr:nth-last-child(-n+2) td { background: var(--warn-bg) !important; }
.cr-flagrows tr:nth-last-child(-n+2) td:first-child { box-shadow: inset 4px 0 0 var(--warn); }

/* горизонтальные бары */
.cr-hbars { display: grid; gap: 10px; margin-top: 18px !important; max-width: var(--wrap) !important; }
.cr-hbar { display: grid; grid-template-columns: 110px minmax(0, 1fr) 90px; gap: 14px; align-items: center; }
.cr-hbar__t { height: 14px; border-radius: 8px; background: #1D1D1D; overflow: hidden; }
.cr-hbar__t i { display: block; height: 100%; width: var(--w); border-radius: 8px; }
.cr-hbar__t .is-easy { background: var(--easy); }
.cr-hbar__t .is-mid { background: var(--mid); }
.cr-hbar__t .is-hard { background: var(--hard); }
.cr-hbar__t .is-hc { background: var(--hc); }
.cr-hbar b { color: #fff; font-weight: 600; font-size: 14px; }

/* линия «множитель игры vs 98%» */
.cr-lc { margin: 20px auto 0; background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 16px; max-width: var(--wrap) !important; }
.cr-lc svg { width: 100%; height: auto; display: block; }
.cr-lc text { fill: var(--muted); font: 600 11px var(--f-t); }
.cr-lc__g { stroke: #222; }
.cr-lc__fair { fill: none; stroke: var(--link); stroke-width: 2.5; stroke-dasharray: 6 5; }
.cr-lc__game { fill: none; stroke: var(--hard); stroke-width: 3; }
.cr-lc__df { fill: var(--link); }
.cr-lc__dg { fill: var(--hard); }
.cr-lc figcaption { display: flex; gap: 18px; flex-wrap: wrap; font-size: 13.5px; margin-top: 8px; }
.cr-lc figcaption span { display: inline-flex; align-items: center; gap: 7px; }
.cr-lc figcaption span::before { content: ""; width: 18px; height: 3px; border-radius: 2px; }
.cr-lc .is-game::before { background: var(--hard); }
.cr-lc .is-fair::before { background: var(--link); }

/* формула, сплит, демо-тройка, логотип рядом со списком, карточки 2 в ряд + последняя на всю ширину */
.cr-formula code { font: 600 15px/1.5 ui-monospace, "SF Mono", Menlo, monospace; color: #DCE0FF; word-break: break-word; }
.cr-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; align-items: center; max-width: var(--wrap) !important; }
.cr-split__art { display: grid; place-items: center; background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 28px; }
.cr-demo3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; max-width: var(--wrap) !important; }
.cr-demo3__it { display: grid; gap: 10px; min-width: 0; }
.cr-demo3__it .cr-shot { margin: 0; }
.cr-demo3__it .cr-metric { margin: 0; }
.cr-withlogo { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 22px; align-items: center; background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 20px 24px; }
.cr-withlogo img { width: 110px; height: auto; }
.cr-cards--2w { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 900px !important; }
.cr-cards--2w > :last-child:nth-child(odd) { grid-column: 1 / -1; }
.cr-ul--plain > li { padding-left: 0; }
.cr-ul--plain > li::before { display: none; }
.cr-ul--plain > li .cr-chips { margin-top: 8px; }
.cr-prose > .cr-metrics { max-width: var(--prose); }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }
@media (max-width: 640px) {
	.cr-withlogo { grid-template-columns: minmax(0, 1fr); gap: 14px; padding: 18px; }
	.cr-split, .cr-cards--2w { grid-template-columns: minmax(0, 1fr); }
	.cr-split__art { padding: 12px; }
	.cr-withlogo img { width: 96px; }
}
