/* =========================================================================
   Learn pages (/how-to-play-roulette/). Loaded after rw.css.
   ========================================================================= */

/* ---------- Section rhythm: tighter than the site default ---------- */

.rw-learn .rw-section {
	padding: 52px 0;
}

/* ---------- Hero card ---------- */

.rw-home .lp-quick__list {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin: 16px 0 20px;
	padding: 0;
	list-style: none;
	counter-reset: lpq;
}

.rw-home .lp-quick__list li {
	position: relative;
	padding-left: 38px;
	color: var(--rw-on-dark);
	font-size: 15px;
	line-height: 1.5;
	counter-increment: lpq;
}

.lp-quick__list li::before {
	content: counter(lpq);
	position: absolute;
	top: 0;
	left: 0;
	display: grid;
	place-items: center;
	width: 26px;
	height: 26px;
	background: var(--rw-gold);
	border-radius: 50%;
	color: var(--rw-ink);
	font-family: var(--rw-display);
	font-size: 14px;
	font-weight: 800;
}

.lp-quick__list strong {
	color: #FFFFFF;
}

/* ---------- Jump links ---------- */

.lp-jump {
	padding: 16px 0;
	background: var(--rw-paper);
	border-bottom: 1px solid var(--rw-line);
}

.rw-home .lp-jump .rw-chips {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.rw-home .lp-jump .rw-chips a {
	padding: 8px 14px;
	font-size: 14px;
}

/* ---------- Round steps ---------- */

.rw-home .lp-steps {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 14px;
	margin: 28px 0 0;
	padding: 0;
	list-style: none;
}

.lp-steps li {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 22px 20px;
	background: var(--rw-white);
	border: 1px solid var(--rw-line);
	border-radius: var(--rw-radius);
}

.lp-steps li:not(:last-child)::after {
	content: "";
	position: absolute;
	top: 38px;
	right: -11px;
	width: 8px;
	height: 8px;
	border-top: 2px solid var(--rw-gold);
	border-right: 2px solid var(--rw-gold);
	transform: rotate(45deg);
}

.lp-steps__n {
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	background: var(--rw-ink);
	border-radius: 50%;
	color: var(--rw-gold);
	font-family: var(--rw-display);
	font-size: 16px;
	font-weight: 800;
}

.rw-home .lp-steps h3 {
	margin: 4px 0 0;
	color: var(--rw-ink);
	font-family: var(--rw-display);
	font-size: 18px;
	font-weight: 800;
	line-height: 1.2;
}

.rw-home .lp-steps p {
	color: var(--rw-text-2);
	font-size: 14.5px;
	line-height: 1.55;
}

/* ---------- Shared controls ---------- */

.lp-field__label {
	color: var(--rw-muted);
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.lp-chips {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

.rw-home .lp-chip,
.rw-home .lp-seg button {
	min-height: 40px;
	margin: 0;
	padding: 8px 14px;
	background: var(--rw-white);
	border: 1px solid var(--rw-line);
	border-radius: 999px;
	color: var(--rw-text);
	font-family: var(--rw-body);
	font-size: 14.5px;
	font-weight: 700;
	line-height: 1.2;
	cursor: pointer;
	transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.rw-home .lp-chip:hover,
.rw-home .lp-chip:focus,
.rw-home .lp-seg button:hover,
.rw-home .lp-seg button:focus {
	background: var(--rw-white);
	border-color: var(--rw-ink);
	color: var(--rw-ink);
}

.rw-home .lp-chip[aria-pressed="true"],
.rw-home .lp-seg button[aria-pressed="true"] {
	background: var(--rw-ink);
	border-color: var(--rw-ink);
	color: #FFFFFF;
}

.rw-home .lp-chip:focus-visible,
.rw-home .lp-seg button:focus-visible {
	outline: 3px solid var(--rw-gold);
	outline-offset: 2px;
}

.rw-home .lp-chip[hidden] {
	display: none;
}

.lp-seg {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 6px;
}

/* ---------- Bet explorer ---------- */

.lp-ex {
	margin-top: 28px;
	padding: 24px;
	background: var(--rw-paper);
	border: 1px solid var(--rw-line);
	border-radius: 20px;
}

.lp-ex__controls {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(0, 1.4fr) auto;
	gap: 18px 24px;
	align-items: start;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--rw-line);
}

.lp-ex__group {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
}

.lp-ex__main {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: 24px;
	align-items: start;
	margin-top: 22px;
}

/* The table: 14 columns (0, twelve number columns, 2 to 1) and 8 rows
   (three number lanes split in halves so 0 and 00 can share column 1,
   then dozens, then the even-money boxes). */
.lp-board {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) repeat(12, minmax(0, 1fr)) minmax(0, 1.15fr);
	grid-template-rows: repeat(6, 26px) 46px 46px;
	gap: 3px;
	padding: 12px;
	background: #145C3E;
	background: radial-gradient(120% 140% at 50% 0, #1E7A52 0, #145C3E 70%);
	border: 6px solid #3B2A17;
	border-radius: 16px;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08), 0 18px 36px -24px rgba(14, 16, 19, .7);
	user-select: none;
	-webkit-tap-highlight-color: transparent;
}

.lp-board > button {
	grid-column: var(--c);
	grid-row: var(--r);
}

.rw-home .lp-cell,
.rw-home .lp-out {
	position: relative;
	display: grid;
	place-items: center;
	min-width: 0;
	margin: 0;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, .55);
	border-radius: 4px;
	color: #FFFFFF;
	font-family: var(--rw-display);
	font-size: 15px;
	font-weight: 800;
	line-height: 1;
	cursor: pointer;
	transition: opacity .18s ease, box-shadow .18s ease, transform .18s ease, background-color .18s ease;
}

.rw-home .lp-cell--red {
	background: #C8102E;
}

.rw-home .lp-cell--black {
	background: #16191E;
}

.rw-home .lp-cell--zero {
	grid-column: 1 / 2;
	grid-row: 1 / 7;
	background: #1E7A52;
	border-radius: 22px 4px 4px 22px;
	font-size: 18px;
}

.rw-home .lp-board.is-us .lp-cell--zero {
	grid-row: 4 / 7;
	border-radius: 4px 4px 4px 22px;
}

.rw-home .lp-board.is-us .lp-cell--00 {
	grid-row: 1 / 4;
	border-radius: 22px 4px 4px 4px;
}

.rw-home .lp-cell[hidden],
.rw-home .lp-out[hidden] {
	display: none;
}

.rw-home .lp-out {
	background: rgba(255, 255, 255, .04);
	font-family: var(--rw-body);
	font-size: 13.5px;
	font-weight: 800;
	letter-spacing: .02em;
}

.rw-home .lp-out--col-top,
.rw-home .lp-out--col-mid,
.rw-home .lp-out--col-bot {
	font-size: 12px;
}

.lp-diamond {
	display: block;
	width: 26px;
	height: 26px;
	background: #C8102E;
	border: 1.5px solid rgba(255, 255, 255, .8);
	transform: scaleX(1.25) rotate(45deg) scale(.72);
}

.lp-out--black .lp-diamond {
	background: #16191E;
}

.rw-home .lp-cell:hover,
.rw-home .lp-out:hover,
.rw-home .lp-cell:focus,
.rw-home .lp-out:focus {
	color: #FFFFFF;
	box-shadow: 0 0 0 2px var(--rw-gold);
}

.rw-home .lp-cell:focus-visible,
.rw-home .lp-out:focus-visible {
	z-index: 3;
	outline: 3px solid var(--rw-gold);
	outline-offset: 1px;
}

/* Lit state: covered numbers glow, the rest step back. */
.lp-board.has-bet .lp-cell:not(.is-on),
.lp-board.has-bet .lp-out:not(.is-sel) {
	opacity: .38;
}

.rw-home .lp-board .lp-cell.is-on {
	z-index: 1;
	box-shadow: 0 0 0 2px var(--rw-gold), 0 0 16px rgba(212, 168, 75, .55);
}

.rw-home .lp-board .lp-out.is-sel {
	z-index: 1;
	background: rgba(212, 168, 75, .22);
	box-shadow: 0 0 0 2px var(--rw-gold);
}

.lp-marker {
	position: absolute;
	z-index: 4;
	top: 0;
	left: 0;
	width: 30px;
	height: 30px;
	margin: -15px 0 0 -15px;
	background: radial-gradient(circle, #F3E6C4 0 34%, #D4A84B 35% 56%, #FFFFFF 57% 63%, #D4A84B 64%);
	border: 2px dashed rgba(255, 255, 255, .9);
	border-radius: 50%;
	box-shadow: 0 4px 10px rgba(0, 0, 0, .45);
	pointer-events: none;
	transition: transform .25s cubic-bezier(.2, .8, .2, 1);
}

.lp-marker[hidden] {
	display: none;
}

.rw-home .lp-ex__hints {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
	margin: 16px 0 0;
	padding: 0;
	list-style: none;
}

.rw-home .lp-ex__hints li {
	padding: 12px 14px;
	background: var(--rw-white);
	border: 1px solid var(--rw-line);
	border-radius: 12px;
	color: var(--rw-text-2);
	font-size: 14px;
	line-height: 1.45;
}

.lp-ex__hints strong {
	color: var(--rw-ink);
}

/* Result card */
.lp-card {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 22px;
	background: var(--rw-ink);
	border-radius: 18px;
	color: var(--rw-on-dark);
}

.rw-home .lp-card__k {
	color: var(--rw-gold);
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.rw-home .lp-card__name {
	margin: 0;
	color: #FFFFFF;
	font-family: var(--rw-display);
	font-size: 26px;
	font-weight: 800;
	letter-spacing: -.01em;
	line-height: 1.1;
}

.rw-home .lp-card__place {
	color: var(--rw-on-dark);
	font-size: 14.5px;
	line-height: 1.5;
}

.rw-home .lp-card__facts {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
	margin: 4px 0 0;
}

.lp-card__facts div {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
	padding: 12px;
	background: var(--rw-ink-3);
	border: 1px solid var(--rw-ink-line);
	border-radius: 12px;
}

.lp-card__facts dt {
	color: var(--rw-on-dark-2);
	font-size: 11.5px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.lp-card__facts dd {
	margin: 0;
	color: #FFFFFF;
	font-family: var(--rw-display);
	font-size: 22px;
	font-weight: 800;
	line-height: 1.15;
	overflow-wrap: anywhere;
}

.lp-card__facts div:first-child dd {
	font-family: var(--rw-body);
	font-size: 16px;
	line-height: 1.4;
}

.lp-card__facts small {
	color: var(--rw-on-dark-3);
	font-size: 12.5px;
	line-height: 1.35;
}

.rw-home .lp-card__edge {
	color: var(--rw-on-dark-2);
	font-size: 14px;
	line-height: 1.5;
}

.lp-card__edge strong {
	color: #FFFFFF;
}

.lp-card__edge.is-bad strong {
	color: #FF7A8A;
}

.rw-home .lp-card__link {
	align-self: flex-start;
	color: var(--rw-gold);
	font-size: 14.5px;
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.rw-home .lp-card__link:hover {
	color: #FFFFFF;
}

/* ---------- Chip placement ---------- */

.lp-layout {
	margin: 28px 0 0;
	padding: 14px;
	background: var(--rw-white);
	border: 1px solid var(--rw-line);
	border-radius: 18px;
}

.lp-layout img,
.lp-shot img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 10px;
}

.rw-home .lp-layout figcaption,
.rw-home .lp-shot figcaption {
	margin-top: 12px;
	color: var(--rw-text-2);
	font-size: 14.5px;
	line-height: 1.5;
}

.lp-shot figcaption strong {
	display: block;
	margin-bottom: 2px;
	color: var(--rw-ink);
	font-family: var(--rw-display);
	font-size: 17px;
}

.lp-shots {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 14px;
	margin-top: 16px;
}

.lp-shot {
	margin: 0;
	padding: 10px 10px 14px;
	background: var(--rw-white);
	border: 1px solid var(--rw-line);
	border-radius: 14px;
}

.lp-tips {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
	margin-top: 20px;
}

.rw-home .lp-tips p {
	padding: 16px 18px;
	background: var(--rw-white);
	border-left: 3px solid var(--rw-gold);
	border-radius: 0 12px 12px 0;
	color: var(--rw-text-2);
	font-size: 15px;
	line-height: 1.55;
}

/* ---------- Payouts ---------- */

.rw-home .rw-table.lp-paytable {
	min-width: 720px;
}

.lp-paytable td strong {
	color: var(--rw-ink);
}

.lp-sum {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
	gap: 28px;
	align-items: center;
	margin-top: 34px;
	padding: 26px;
	background: var(--rw-paper);
	border: 1px solid var(--rw-line);
	border-radius: 18px;
}

.rw-home .lp-sum__k {
	color: var(--rw-gold-text);
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.rw-home .lp-sum__copy h3 {
	margin: 6px 0 10px;
	color: var(--rw-ink);
	font-family: var(--rw-display);
	font-size: 23px;
	font-weight: 800;
	line-height: 1.2;
}

.rw-home .lp-sum__copy p:not(.lp-sum__k) {
	color: var(--rw-text-2);
	font-size: 15.5px;
	line-height: 1.6;
}

.rw-home .lp-sum__math {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
	margin: 0;
}

.lp-sum__math div {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 14px;
	background: var(--rw-white);
	border: 1px solid var(--rw-line);
	border-radius: 12px;
}

.lp-sum__math div.is-net {
	background: var(--rw-green-soft);
	border-color: rgba(30, 122, 82, .35);
}

.lp-sum__math dt {
	color: var(--rw-muted);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.lp-sum__math dd {
	margin: 0;
	color: var(--rw-ink);
	font-family: var(--rw-display);
	font-size: 32px;
	font-weight: 800;
	line-height: 1.05;
}

.lp-sum__math .is-net dd {
	color: var(--rw-green-ink);
}

.lp-sum__math .is-loss dd {
	color: var(--rw-bad);
}

.lp-sum__math span {
	color: var(--rw-muted);
	font-size: 13px;
	line-height: 1.4;
}

/* ---------- House edge chart ---------- */

.lp-edge {
	margin: 28px 0 0;
	padding: 26px 28px 22px;
	background: radial-gradient(900px 380px at 100% 0, rgba(200, 16, 46, .14), transparent 60%), radial-gradient(700px 300px at 0 100%, rgba(212, 168, 75, .08), transparent 60%), var(--rw-ink);
	border: 1px solid #23272E;
	border-radius: 20px;
	color: var(--rw-on-dark);
}

.lp-glance__head {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-bottom: 18px;
}

.lp-glance__k {
	color: var(--rw-gold);
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.lp-glance__t {
	color: #FFFFFF;
	font-family: var(--rw-display);
	font-size: clamp(21px, 2.4vw, 28px);
	font-weight: 800;
	letter-spacing: -.015em;
	line-height: 1.15;
}

.rw-home .lp-edge__rows {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.lp-edge__row {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 2fr) 128px;
	gap: 18px;
	align-items: center;
	padding: 12px 14px;
	background: rgba(255, 255, 255, .03);
	border: 1px solid var(--rw-ink-line);
	border-radius: 12px;
}

.lp-edge__name {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.lp-edge__name strong {
	color: #FFFFFF;
	font-size: 15.5px;
}

.lp-edge__name span,
.lp-edge__out span {
	color: var(--rw-on-dark-3);
	font-size: 12.5px;
	line-height: 1.35;
}

.lp-edge__bar {
	height: 12px;
	background: rgba(255, 255, 255, .06);
	border-radius: 999px;
	overflow: hidden;
}

.lp-edge__bar span {
	display: block;
	height: 100%;
	border-radius: inherit;
}

.lp-edge--best .lp-edge__bar span {
	background: #2FAE73;
}

.lp-edge--good .lp-edge__bar span {
	background: var(--rw-gold);
}

.lp-edge--bad .lp-edge__bar span {
	background: #E0485F;
}

.lp-edge--worst .lp-edge__bar span {
	background: repeating-linear-gradient(45deg, #C8102E 0 6px, #A30D25 6px 12px);
}

.lp-edge__out {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
	text-align: right;
}

.lp-edge__out strong {
	color: #FFFFFF;
	font-family: var(--rw-display);
	font-size: 24px;
	font-weight: 800;
	line-height: 1.05;
}

.rw-home .lp-glance__note {
	margin-top: 14px;
	color: var(--rw-on-dark-3);
	font-size: 13px;
	line-height: 1.5;
}

.lp-tablecards {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin-top: 22px;
}

.lp-tablecard {
	padding: 22px;
	background: var(--rw-white);
	border: 1px solid var(--rw-line);
	border-radius: var(--rw-radius);
}

.lp-tablecard:first-child {
	border-color: rgba(30, 122, 82, .45);
	box-shadow: inset 0 3px 0 var(--rw-green);
}

.rw-home .lp-tablecard__k {
	color: var(--rw-gold-text);
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.lp-tablecard:first-child .lp-tablecard__k {
	color: var(--rw-green-ink);
}

.rw-home .lp-tablecard h3 {
	margin: 6px 0 8px;
	color: var(--rw-ink);
	font-family: var(--rw-display);
	font-size: 20px;
	font-weight: 800;
	line-height: 1.2;
}

.rw-home .lp-tablecard p:not(.lp-tablecard__k) {
	color: var(--rw-text-2);
	font-size: 15px;
	line-height: 1.6;
}

/* ---------- Online vs table ---------- */

.lp-advice {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
	margin-top: 26px;
}

.lp-advice > div {
	padding: 22px;
	background: var(--rw-paper);
	border-radius: var(--rw-radius);
}

.rw-home .lp-advice h3 {
	margin: 0 0 8px;
	color: var(--rw-ink);
	font-family: var(--rw-display);
	font-size: 19px;
	font-weight: 800;
	line-height: 1.2;
}

.rw-home .lp-advice p {
	color: var(--rw-text-2);
	font-size: 15px;
	line-height: 1.6;
}

/* ---------- Picks ---------- */

.rw-home .lp-picks {
	margin-top: 26px;
}

/* ---------- Mistakes and practice ---------- */

.lp-mistakes {
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
	gap: 28px;
	align-items: start;
	margin-top: 26px;
}

.rw-home .lp-mistakes__list {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: lpm;
}

.rw-home .lp-mistakes__list li {
	position: relative;
	padding: 16px 18px 16px 62px;
	background: var(--rw-paper);
	border-radius: 14px;
	color: var(--rw-text-2);
	font-size: 15.5px;
	line-height: 1.55;
	counter-increment: lpm;
}

.lp-mistakes__list li::before {
	content: counter(lpm);
	position: absolute;
	top: 16px;
	left: 18px;
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	background: var(--rw-white);
	border: 2px solid var(--rw-red);
	border-radius: 50%;
	color: var(--rw-red);
	font-family: var(--rw-display);
	font-size: 15px;
	font-weight: 800;
}

.lp-mistakes__list strong {
	color: var(--rw-ink);
}

.lp-plan {
	position: sticky;
	top: 90px;
	padding: 24px;
	background: var(--rw-ink);
	border-radius: 18px;
	color: var(--rw-on-dark);
}

.rw-home .lp-plan__k {
	color: var(--rw-gold);
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.rw-home .lp-plan h3 {
	margin: 6px 0 14px;
	color: #FFFFFF;
	font-family: var(--rw-display);
	font-size: 23px;
	font-weight: 800;
	line-height: 1.15;
}

.rw-home .lp-plan ol {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0 0 20px;
	padding: 0;
	list-style: none;
}

.rw-home .lp-plan li {
	padding: 12px 14px;
	background: var(--rw-ink-3);
	border: 1px solid var(--rw-ink-line);
	border-radius: 12px;
	font-size: 14.5px;
	line-height: 1.5;
}

.lp-plan strong {
	color: var(--rw-gold);
}

.rw-home .lp-plan a:not(.rw-btn) {
	color: #FFFFFF;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ---------- Glossary ---------- */

.rw-home .lp-glossary {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 32px;
	margin: 24px 0 0;
}

.lp-glossary div {
	padding: 16px 0;
	border-bottom: 1px solid var(--rw-line);
}

.lp-glossary dt {
	color: var(--rw-ink);
	font-family: var(--rw-display);
	font-size: 17px;
	font-weight: 800;
}

.lp-glossary dd {
	margin: 4px 0 0;
	color: var(--rw-text-2);
	font-size: 15px;
	line-height: 1.55;
}

.rw-home .lp-sources {
	margin-top: 22px;
	color: var(--rw-muted);
	font-size: 14px;
	line-height: 1.7;
}

/* ---------- Responsive ---------- */

@media (max-width: 1080px) {
	.rw-home .lp-steps {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.lp-steps li::after {
		display: none;
	}

	.lp-ex__controls {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}

	.lp-ex__group:last-child {
		grid-column: 1 / -1;
	}

	.lp-ex__main {
		grid-template-columns: minmax(0, 1fr);
	}

	.lp-card {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
		gap: 10px 22px;
	}

	.lp-card > * {
		grid-column: 1;
	}

	.rw-home .lp-card__facts {
		grid-column: 2;
		grid-row: 1 / span 5;
		margin: 0;
	}

	.lp-shots {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 860px) {
	.rw-home .lp-steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.lp-sum,
	.lp-mistakes,
	.lp-advice,
	.lp-tablecards {
		grid-template-columns: minmax(0, 1fr);
	}

	.lp-plan {
		position: static;
	}

	.lp-edge__row {
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 8px 14px;
	}

	.lp-edge__bar {
		grid-column: 1 / -1;
		grid-row: 2;
	}

	.lp-shots {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Phones: the table stands upright, like looking down the layout from 0. */
@media (max-width: 720px) {
	.lp-ex {
		padding: 16px;
		border-radius: 16px;
	}

	.lp-ex__controls {
		grid-template-columns: minmax(0, 1fr);
	}

	.lp-ex__main {
		gap: 16px;
		margin-top: 16px;
	}

	.lp-board {
		grid-template-columns: repeat(6, minmax(0, 1fr));
		grid-template-rows: 42px repeat(12, 34px) 38px 40px 40px 40px;
		width: 100%;
		max-width: 340px;
		margin: 0 auto;
		padding: 8px;
		border-width: 5px;
	}

	.lp-board > button {
		grid-column: var(--mc);
		grid-row: var(--mr);
	}

	.rw-home .lp-cell--zero,
	.rw-home .lp-board.is-us .lp-cell--zero {
		grid-column: 1 / 7;
		grid-row: 1 / 2;
		border-radius: 22px 22px 4px 4px;
	}

	.rw-home .lp-board.is-us .lp-cell--zero {
		grid-column: 1 / 4;
		border-radius: 22px 4px 4px 4px;
	}

	.rw-home .lp-board.is-us .lp-cell--00 {
		grid-column: 4 / 7;
		grid-row: 1 / 2;
		border-radius: 4px 22px 4px 4px;
	}

	.rw-home .lp-ex__hints {
		display: none;
	}

	.lp-card {
		display: flex;
		order: -1;
	}

	.rw-home .lp-card__facts {
		margin-top: 4px;
	}

	.lp-tips {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (max-width: 640px) {
	.rw-home .lp-steps {
		grid-template-columns: minmax(0, 1fr);
	}

	.lp-steps li {
		display: grid;
		grid-template-columns: 34px minmax(0, 1fr);
		gap: 4px 14px;
		padding: 18px;
	}

	.lp-steps li > :not(.lp-steps__n) {
		grid-column: 2;
	}

	.lp-steps__n {
		grid-row: 1 / span 2;
	}

	.rw-home .lp-steps h3 {
		margin: 4px 0 0;
	}

	.lp-card {
		padding: 18px;
	}

	.lp-edge,
	.lp-sum {
		padding: 18px 14px;
		border-radius: 16px;
	}

	.lp-edge__out strong {
		font-size: 20px;
	}

	.lp-sum__math dd {
		font-size: 24px;
	}

	.rw-home .lp-sum__math {
		gap: 6px;
	}

	.lp-sum__math div {
		padding: 10px;
	}

	.lp-shots {
		grid-template-columns: minmax(0, 1fr);
	}

	.rw-home .lp-glossary {
		grid-template-columns: minmax(0, 1fr);
	}

	.rw-home .lp-jump .rw-chips {
		flex-wrap: nowrap;
		margin-right: -16px;
		padding-right: 16px;
		overflow-x: auto;
		scrollbar-width: none;
	}

	.rw-home .lp-jump .rw-chips li {
		flex: 0 0 auto;
	}

	.lp-seg {
		display: flex;
	}
}

@media (prefers-reduced-motion: reduce) {
	.lp-marker,
	.rw-home .lp-cell,
	.rw-home .lp-out {
		transition: none;
	}
}

/* =========================================================================
   Bets and payouts page (/roulette-bets-payouts/)
   ========================================================================= */

/* ---------- Hero cheat sheet ---------- */

.rw-home .lp-cheat__list {
	display: flex;
	flex-direction: column;
	margin: 14px 0 20px;
}

.lp-cheat__list div {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	padding: 9px 0;
	border-bottom: 1px solid var(--rw-ink-line);
}

.lp-cheat__list div:last-child {
	border-bottom: 0;
}

.lp-cheat__list dt {
	color: var(--rw-on-dark);
	font-size: 15px;
}

.lp-cheat__list dd {
	margin: 0;
	color: var(--rw-gold);
	font-family: var(--rw-display);
	font-size: 17px;
	font-weight: 800;
	white-space: nowrap;
}

/* ---------- Chart ---------- */

.rw-home .rw-table.lp-chart {
	min-width: 860px;
}

.lp-tag {
	display: inline-block;
	margin-left: 6px;
	padding: 2px 8px;
	background: var(--rw-green-soft);
	border-radius: 999px;
	color: var(--rw-green-ink);
	font-size: 11.5px;
	font-weight: 800;
	letter-spacing: .02em;
	vertical-align: 1px;
	white-space: nowrap;
}

.lp-tag--bad {
	background: #FBE7EA;
	color: var(--rw-bad);
}

/* ---------- Payout vs odds ---------- */

.lp-split {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
	gap: 36px;
	align-items: start;
	margin-top: 22px;
}

.rw-home .lp-split__copy p {
	margin-bottom: 16px;
	color: var(--rw-text-2);
	font-size: 16.5px;
	line-height: 1.7;
}

.rw-home .lp-split .lp-edge {
	margin: 0;
}

.lp-freq__row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) 64px;
	gap: 16px;
	align-items: center;
	padding: 10px 14px;
	background: rgba(255, 255, 255, .03);
	border: 1px solid var(--rw-ink-line);
	border-radius: 12px;
}

.lp-freq__row .lp-edge__bar span {
	background: var(--rw-gold);
}

.lp-freq__row .lp-edge__out strong {
	font-size: 21px;
}

/* ---------- Round builder ---------- */

.lp-rb__controls {
	grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr);
}

.lp-rb__controls .lp-ex__group > .lp-field__label + .lp-seg + .lp-field__label {
	margin-top: 8px;
}

.rw-home .lp-rb__hint {
	color: var(--rw-muted);
	font-size: 13.5px;
	line-height: 1.45;
}

.lp-board--rb {
	grid-template-rows: repeat(6, 30px) 46px 46px;
}

.rw-home .lp-board--rb .lp-cell {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 4px;
}

.lp-cell__n {
	line-height: 1;
}

.rw-home .lp-net {
	display: block;
	min-width: 0;
	max-width: calc(100% - 4px);
	padding: 2px 5px;
	border-radius: 999px;
	font-family: var(--rw-body);
	font-size: 10.5px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: clip;
}

.rw-home .lp-net:empty {
	display: none;
}

.rw-home .lp-net.is-up {
	background: #2FAE73;
	color: #FFFFFF;
}

.rw-home .lp-net.is-down {
	background: rgba(0, 0, 0, .5);
	color: #FFB3BE;
}

.rw-home .lp-net.is-even {
	background: rgba(255, 255, 255, .85);
	color: var(--rw-ink);
}

.rw-home .lp-board--rb .lp-cell.is-up {
	box-shadow: inset 0 0 0 2px #2FAE73;
}

.rw-home .lp-board--rb .lp-cell.is-hit {
	z-index: 2;
	box-shadow: 0 0 0 3px #FFFFFF, 0 0 22px rgba(255, 255, 255, .7);
	transform: scale(1.06);
}

.rw-home .lp-board--rb .lp-cell[hidden] {
	display: none;
}

.lp-board--rb .lp-marker {
	display: grid;
	place-items: center;
	width: 22px;
	height: 22px;
	margin: -11px 0 0 -11px;
	background: radial-gradient(circle, #FFFFFF 0 46%, #D4A84B 47%);
	border: 2px dashed rgba(255, 255, 255, .95);
	color: var(--rw-ink);
	font-family: var(--rw-body);
	font-size: 9.5px;
	font-weight: 800;
	line-height: 1;
	border-width: 1.5px;
	transition: none;
}

.lp-rb__outcomes {
	margin-top: 18px;
	padding: 16px 18px;
	background: var(--rw-white);
	border: 1px solid var(--rw-line);
	border-radius: 14px;
}

.rw-home .lp-rb__outcomes ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 10px 0 0;
	padding: 0;
	list-style: none;
}

.lp-rb__outcomes li {
	display: flex;
	flex-direction: column;
	gap: 1px;
	min-width: 104px;
	padding: 8px 12px;
	border-radius: 10px;
	border: 1px solid var(--rw-line);
	background: var(--rw-paper);
}

.lp-rb__outcomes li.is-up {
	background: var(--rw-green-soft);
	border-color: rgba(30, 122, 82, .3);
}

.lp-rb__outcomes li.is-down {
	background: #FBEFF1;
	border-color: rgba(163, 13, 37, .2);
}

.lp-rb__outcomes strong {
	color: var(--rw-ink);
	font-family: var(--rw-display);
	font-size: 18px;
	font-weight: 800;
	line-height: 1.15;
}

.lp-rb__outcomes li.is-up strong {
	color: var(--rw-green-ink);
}

.lp-rb__outcomes li.is-down strong {
	color: var(--rw-bad);
}

.lp-rb__outcomes span {
	color: var(--rw-muted);
	font-size: 12.5px;
}

.lp-rb__facts div:last-child dd {
	font-size: 19px;
}

.lp-rb__facts dd span {
	white-space: nowrap;
}

.rw-home .lp-rb__legend {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 18px;
	margin: 14px 0 0;
	padding: 0;
	list-style: none;
	color: var(--rw-muted);
	font-size: 13.5px;
}

.lp-rb__legend li {
	display: inline-flex;
	align-items: center;
	gap: 7px;
}

.lp-rb__legend i {
	width: 22px;
	height: 12px;
	border-radius: 999px;
}

.lp-rb__legend i.is-up {
	background: #2FAE73;
}

.lp-rb__legend i.is-even {
	background: #FFFFFF;
	border: 1px solid var(--rw-line);
}

.lp-rb__legend i.is-down {
	background: #3A1E24;
}

.rw-home .lp-rb__facts {
	margin: 0;
}

.lp-rb__facts div:first-child dd {
	font-family: var(--rw-display);
	font-size: 22px;
	line-height: 1.15;
}

.lp-rb__slash {
	color: var(--rw-on-dark-3);
	font-weight: 400;
}

[data-rb-best] {
	color: #4FD39A;
}

[data-rb-worst] {
	color: #FF8A99;
}

.lp-rb__slip {
	padding-top: 12px;
	border-top: 1px solid var(--rw-ink-line);
}

.rw-home .lp-rb__slip-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 8px;
	color: var(--rw-on-dark-2);
	font-size: 11.5px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.rw-home .lp-rb__clear,
.rw-home .lp-rb__x {
	margin: 0;
	padding: 4px 8px;
	background: transparent;
	border: 1px solid var(--rw-ink-line);
	border-radius: 999px;
	color: var(--rw-on-dark);
	font-family: var(--rw-body);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1.2;
	text-transform: none;
	cursor: pointer;
}

.rw-home .lp-rb__clear:hover,
.rw-home .lp-rb__clear:focus,
.rw-home .lp-rb__x:hover,
.rw-home .lp-rb__x:focus {
	background: var(--rw-ink-3);
	border-color: var(--rw-gold);
	color: #FFFFFF;
}

.rw-home .lp-rb__bets {
	display: flex;
	flex-direction: column;
	gap: 6px;
	max-height: 220px;
	margin: 0;
	padding: 0;
	overflow-y: auto;
	list-style: none;
}

.lp-rb__bets li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 8px 10px;
	background: var(--rw-ink-3);
	border-radius: 10px;
}

.lp-rb__bets li.is-empty {
	color: var(--rw-on-dark-3);
	font-size: 14px;
}

.lp-rb__bet {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.lp-rb__bet strong {
	color: #FFFFFF;
	font-size: 14px;
}

.lp-rb__bet span {
	color: var(--rw-on-dark-3);
	font-size: 12.5px;
}

.rw-home .lp-rb__result {
	padding: 10px 12px;
	background: var(--rw-ink-3);
	border-left: 3px solid var(--rw-gold);
	border-radius: 0 10px 10px 0;
	color: var(--rw-on-dark);
	font-size: 14px;
	line-height: 1.5;
}

.lp-rb__result[hidden] {
	display: none;
}

.lp-rb__result strong {
	color: #FFFFFF;
}

/* ---------- Inside bets ---------- */

.lp-bets {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
	margin-top: 26px;
}

.lp-bet {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 18px;
	align-items: center;
	padding: 14px;
	background: var(--rw-paper);
	border-radius: var(--rw-radius);
}

.rw-home .lp-bet--cta {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 8px;
	padding: 26px;
	background: var(--rw-ink);
	color: var(--rw-on-dark);
	text-decoration: none;
	transition: transform .15s ease;
}

.rw-home .lp-bet--cta:hover {
	color: var(--rw-on-dark);
	transform: translateY(-2px);
}

.lp-bet--cta .lp-bet__k {
	color: var(--rw-gold);
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.lp-bet--cta strong {
	color: #FFFFFF;
	font-family: var(--rw-display);
	font-size: 22px;
	font-weight: 800;
	line-height: 1.2;
}

.lp-bet--cta span {
	font-size: 15px;
	line-height: 1.55;
}

.lp-bet--cta .lp-bet__go {
	color: var(--rw-gold);
	font-weight: 800;
}

.lp-chart td:nth-child(3) {
	white-space: nowrap;
}

.lp-bet__img {
	margin: 0;
}

.lp-bet__img img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 10px;
}

.rw-home .lp-bet h3 {
	margin: 0 0 6px;
	color: var(--rw-ink);
	font-family: var(--rw-display);
	font-size: 19px;
	font-weight: 800;
	line-height: 1.2;
}

.rw-home .lp-bet p {
	color: var(--rw-text-2);
	font-size: 14.5px;
	line-height: 1.55;
}

.rw-home .lp-bet__facts {
	margin-top: 8px;
	color: var(--rw-red) !important;
	font-size: 13.5px !important;
	font-weight: 800;
}

/* ---------- Outside bets ---------- */

.lp-wide {
	display: grid;
	gap: 16px;
	margin-top: 26px;
}

.rw-home .lp-wide .lp-layout {
	margin: 0;
}

.lp-layout figcaption strong {
	color: var(--rw-ink);
}

/* ---------- Worked examples ---------- */

.lp-worked {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
	margin-top: 24px;
}

.lp-worked__card {
	padding: 22px;
	background: var(--rw-white);
	border: 1px solid var(--rw-line);
	border-radius: var(--rw-radius);
}

.rw-home .lp-worked__card h3 {
	margin: 0 0 8px;
	color: var(--rw-ink);
	font-family: var(--rw-display);
	font-size: 20px;
	font-weight: 800;
	line-height: 1.2;
}

.rw-home .lp-worked__card > p {
	color: var(--rw-text-2);
	font-size: 15px;
	line-height: 1.6;
}

.rw-home .lp-worked__card .rw-table-wrap {
	margin-top: 14px;
}

.rw-home .rw-table.lp-mini {
	min-width: 0;
}

.lp-mini td.is-up {
	color: var(--rw-green-ink);
	font-weight: 800;
}

.lp-mini td.is-down {
	color: var(--rw-bad);
	font-weight: 800;
}

.rw-home .lp-worked__note {
	margin-top: 12px;
	font-size: 14.5px !important;
}

/* ---------- Responsive ---------- */

@media (max-width: 1080px) {
	.lp-rb__controls {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	}

	.lp-rb__controls .lp-ex__group:first-child {
		grid-column: 1 / -1;
	}

	.lp-rb__controls .lp-ex__group:last-child {
		grid-column: auto;
	}

	.lp-rb__card {
		display: flex;
	}

	.lp-split {
		grid-template-columns: minmax(0, 1fr);
		gap: 20px;
	}

	.lp-bets {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (max-width: 860px) {
	.lp-worked {
		grid-template-columns: minmax(0, 1fr);
	}
}

@media (max-width: 720px) {
	.lp-rb__controls {
		grid-template-columns: minmax(0, 1fr);
	}

	.lp-board--rb {
		grid-template-rows: 44px repeat(12, 42px) 38px 40px 40px 40px;
	}

	.lp-rb__card {
		order: 0;
	}

	.rw-home .lp-board--rb .lp-cell {
		gap: 3px;
		font-size: 14px;
	}

	.rw-home .lp-net {
		font-size: 10px;
	}

	.lp-rb__outcomes {
		padding: 14px;
	}

	.lp-rb__outcomes li {
		flex: 1 1 calc(50% - 4px);
		min-width: 0;
	}

	.lp-freq__row {
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 8px 14px;
	}

	.lp-freq__row .lp-edge__bar {
		grid-column: 1 / -1;
		grid-row: 2;
	}
}

@media (max-width: 640px) {
	.lp-bet {
		grid-template-columns: minmax(0, 1fr);
		gap: 12px;
	}
}
