/* ── Pocket Kings Masterclass — scoped page styles ─────────────────────
   Verbatim port of kings-styles.css, scoped under body.btf-kk-page.
   Mobile-first; component breakpoints live with their components.

   Structure: hero (with KK cards) → equity cliff (interactive bars) →
   replay (4-step, 2-col stage+note layout) → preflop (4-tab + vs-AA)
   → ace flop (probability panel + 3-tab scenarios) → takeaways (5 rules
   in 2-col grid) → summary (felt).
   ──────────────────────────────────────────────────────────────────── */

body.btf-kk-page {
	--btf-kk-forest:   var( --th-forest );
	--btf-kk-forest-2: var( --th-forest-2 );
	--btf-kk-forest-3: var( --th-forest-3 );
	--btf-kk-gold:     var( --th-gold );
	--btf-kk-gold-soft: var( --th-gold-soft );
	--btf-kk-cream:    var( --th-cream );
	--btf-kk-cream-2:  var( --th-cream-2 );
	--btf-kk-cream-3:  var( --th-cream-3 );
	--btf-kk-ink:      var( --th-ink );
	--btf-kk-ink-2:    var( --th-ink-2 );
	--btf-kk-muted:    var( --th-muted );
	--btf-kk-hair:     var( --th-hair );
	--btf-kk-red:      var( --th-red );
	--btf-kk-serif:    var( --th-serif );
	--btf-kk-sans:     var( --th-sans );
	--btf-kk-mono:     var( --th-mono );
}

/* ── Selection on dark backgrounds (gold) ─────────────────────────────── */
body.btf-kk-page .btf-kk-hero ::selection,
body.btf-kk-page .btf-kk-hero::selection,
body.btf-kk-page .btf-kk-hero-quote ::selection,
body.btf-kk-page .btf-kk-hero-quote::selection,
body.btf-kk-page .btf-kk-summary ::selection,
body.btf-kk-page .btf-kk-summary::selection,
body.btf-kk-page .btf-kk-replay-felt ::selection,
body.btf-kk-page .btf-kk-replay-felt::selection,
body.btf-kk-page .btf-kk-fix ::selection,
body.btf-kk-page .btf-kk-fix::selection,
body.btf-kk-page .btf-kk-pf-tab.active ::selection,
body.btf-kk-page .btf-kk-pf-tab.active::selection,
body.btf-kk-page .btf-kk-af-tab.active ::selection,
body.btf-kk-page .btf-kk-af-tab.active::selection,
body.btf-kk-page .btf-kk-replay-tab.active ::selection,
body.btf-kk-page .btf-kk-replay-tab.active::selection {
	background: rgba( 212, 180, 74, .4 );
	color: var( --on-dark );
}

/* ── Universal: shared sub-card heading style (mono uppercase label) ──── */
body.btf-kk-page .btf-kk-h {
	font-family: var( --btf-kk-mono );
	font-weight: 700;
	font-size: .68rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var( --btf-kk-muted );
	margin: 0 0 .55em;
}

/* ── Small data label (replaces eyebrow on non-section data fields) ────
   Same look as the eyebrow but without the brass dot prefix — used for
   "Pot", "Your hand", "Board", "Why", etc. inside sub-cards. */
body.btf-kk-page .btf-kk-lbl {
	display: inline-block;
	font-family: var( --btf-kk-mono );
	font-weight: 700;
	font-size: .66rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var( --btf-kk-muted );
	margin: 0 0 .5em;
}
body.btf-kk-page .btf-kk-lbl.on-felt {
	color: var( --btf-kk-gold-soft );
}

/* ── Card glyphs (proper playing-card visual) ─────────────────────────── */
body.btf-kk-page .btf-kk-card {
	display: inline-grid;
	grid-template-rows: auto auto;
	justify-content: center;
	align-content: center;
	background: #fff;
	border: 1px solid #d3cec3;
	border-radius: 6px;
	box-shadow: 0 1px 3px rgba( 0, 0, 0, .12 );
	font-family: var( --btf-kk-serif );
	font-weight: 500;
	text-align: center;
	line-height: 1;
}
body.btf-kk-page .btf-kk-card.sz-lg {
	width: 48px;
	height: 68px;
}
body.btf-kk-page .btf-kk-card.clr-r { color: #b3261e; }
body.btf-kk-page .btf-kk-card.clr-k { color: #1d1d1d; }
body.btf-kk-page .btf-kk-card b {
	font-weight: 500;
	letter-spacing: -.04em;
	font-size: 1.4rem;
	line-height: 1;
}
body.btf-kk-page .btf-kk-card i {
	font-style: normal;
	font-size: .95rem;
	line-height: 1.2;
	margin-top: 2px;
}

/* ── Hero ─────────────────────────────────────────────────────────────── */
body.btf-kk-page .btf-kk-hero-cta {
	display: flex;
	gap: .8rem;
	flex-wrap: wrap;
	margin-top: 1.5rem;
}
body.btf-kk-page .btf-kk-hero-quote {
	background: rgba( 255, 255, 255, .04 );
	border: 1px solid rgba( 255, 255, 255, .1 );
	border-radius: 14px;
	padding: 1.6rem 1.6rem 1.4rem;
	color: var( --btf-kk-cream );
	position: relative;
	font-family: var( --btf-kk-serif );
}
body.btf-kk-page .btf-kk-hero-cards {
	display: flex;
	gap: .5rem;
	margin-bottom: 1.4rem;
	justify-content: center;
	padding-top: 1.2rem;
}
body.btf-kk-page .btf-kk-hero-cards .btf-kk-card {
	width: 80px;
	height: 112px;
	box-shadow: 0 8px 20px rgba( 0, 0, 0, .25 );
}
body.btf-kk-page .btf-kk-hero-cards .btf-kk-card:first-child { transform: rotate( -3deg ); }
body.btf-kk-page .btf-kk-hero-cards .btf-kk-card:last-child {
	transform: rotate( 3deg );
	margin-left: -10px;
}
body.btf-kk-page .btf-kk-hero-cards .btf-kk-card b { font-size: 2.4rem; }
body.btf-kk-page .btf-kk-hero-cards .btf-kk-card i { font-size: 1.5rem; }
body.btf-kk-page .btf-kk-hq-mark {
	position: absolute;
	top: -.2em;
	left: .6rem;
	font-family: var( --btf-kk-serif );
	font-size: 5rem;
	line-height: 1;
	color: var( --btf-kk-gold-soft );
	opacity: .7;
	pointer-events: none;
}
body.btf-kk-page .prose .btf-kk-hero .btf-kk-hero-quote p,
body.btf-kk-page .btf-kk-hero .btf-kk-hero-quote p {
	font-size: 1.18rem;
	line-height: 1.55;
	margin: 0 0 1rem;
	color: rgba( 255, 255, 255, .92 );
	position: relative;
	z-index: 1;
}
body.btf-kk-page .btf-kk-hero-quote p em {
	color: var( --btf-kk-gold-soft );
	font-style: italic;
}
body.btf-kk-page .btf-kk-hero-quote footer {
	margin-top: 1rem;
	font-family: var( --btf-kk-mono );
	font-size: .72rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var( --btf-kk-gold-soft );
}

/* ── Editorial sections wrapper ───────────────────────────────────────── */
body.btf-kk-page .btf-kk-section {
	padding: 4rem 0 3rem;
	scroll-margin-top: 80px;
}
@media ( max-width: 800px ) {
	body.btf-kk-page .btf-kk-section { padding: 3rem 0 2rem; }
}
body.btf-kk-page .btf-kk-section > .wrap > .btf-th-eyebrow {
	margin-bottom: .9rem;
}
body.btf-kk-page .prose .btf-kk-section h2.btf-th-display,
body.btf-kk-page .btf-kk-section h2.btf-th-display {
	margin: 0 0 .55em;
}
body.btf-kk-page .prose .btf-kk-section .btf-th-lede,
body.btf-kk-page .btf-kk-section .btf-th-lede {
	margin: 0 0 2rem;
	color: var( --btf-kk-ink-2 );
}

/* ── 01 Equity cliff ──────────────────────────────────────────────────── */
body.btf-kk-page .btf-kk-eq {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: 1.2rem;
	align-items: stretch;
}
@media ( max-width: 820px ) { body.btf-kk-page .btf-kk-eq { grid-template-columns: 1fr; } }
body.btf-kk-page .btf-kk-eq-chart {
	background: var( --btf-kk-cream-2 );
	border: 1px solid var( --btf-kk-hair );
	border-radius: 14px;
	padding: 1.6rem 1.8rem;
	display: flex;
	flex-direction: column;
	gap: .7rem;
}
body.btf-kk-page .btf-kk-eq-row {
	background: transparent;
	border: 0;
	padding: 0;
	cursor: pointer;
	font: inherit;
	color: var( --btf-kk-ink );
	display: grid;
	grid-template-columns: 110px 1fr;
	gap: 1rem;
	align-items: center;
	border-radius: 8px;
	transition: opacity .15s;
	opacity: .62;
	text-align: left;
}
body.btf-kk-page .btf-kk-eq-row.active { opacity: 1; }
body.btf-kk-page .btf-kk-eq-row:hover { opacity: .85; }
body.btf-kk-page .btf-kk-eq-players {
	font-family: var( --btf-kk-mono );
	font-size: .76rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var( --btf-kk-ink-2 );
	text-align: right;
}
body.btf-kk-page .btf-kk-eq-bar-track {
	position: relative;
	display: block;
	height: 34px;
	background: var( --btf-kk-cream-3 );
	border-radius: 7px;
	overflow: hidden;
}
body.btf-kk-page .btf-kk-eq-bar {
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	border-radius: 7px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	padding-right: .6rem;
	transition: width .4s cubic-bezier( .2, .7, .2, 1 );
	min-width: 44px;
}
body.btf-kk-page .btf-kk-eq-bar.good { background: linear-gradient( 90deg, var( --btf-kk-forest-3 ), var( --btf-kk-forest ) ); }
body.btf-kk-page .btf-kk-eq-bar.ok   { background: linear-gradient( 90deg, var( --btf-kk-gold-soft ), var( --btf-kk-gold ) ); }
body.btf-kk-page .btf-kk-eq-bar.bad  { background: linear-gradient( 90deg, #a8514f, var( --btf-kk-red ) ); }
body.btf-kk-page .btf-kk-eq-bar-val {
	font-family: var( --btf-kk-mono );
	font-size: .82rem;
	font-weight: 600;
	color: #fff;
}
body.btf-kk-page .btf-kk-eq-bar.ok .btf-kk-eq-bar-val { color: #4a3a12; }
body.btf-kk-page .btf-kk-eq-50 {
	position: absolute;
	left: 50%;
	top: -2px;
	bottom: -2px;
	width: 2px;
	background: repeating-linear-gradient( 180deg, var( --btf-kk-ink-2 ) 0 4px, transparent 4px 8px );
	opacity: .5;
}
body.btf-kk-page .btf-kk-eq-axis {
	display: flex;
	justify-content: space-between;
	font-family: var( --btf-kk-mono );
	font-size: .64rem;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var( --btf-kk-muted );
	padding-left: 110px;
	margin-top: .2rem;
}
body.btf-kk-page .btf-kk-eq-axis-mid { margin-left: -3rem; }

body.btf-kk-page .btf-kk-eq-detail[data-kk-hidden="true"] { display: none; }
body.btf-kk-page .btf-kk-eq-detail {
	background: var( --btf-kk-cream-2 );
	border: 1px solid var( --btf-kk-hair );
	border-radius: 14px;
	padding: 1.6rem 1.8rem;
	border-left-width: 3px;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}
body.btf-kk-page .btf-kk-eq-detail.good { border-left-color: var( --btf-kk-forest ); }
body.btf-kk-page .btf-kk-eq-detail.ok   { border-left-color: var( --btf-kk-gold ); }
body.btf-kk-page .btf-kk-eq-detail.bad  { border-left-color: var( --btf-kk-red ); }
body.btf-kk-page .btf-kk-eq-detail-num {
	font-family: var( --btf-kk-serif );
	font-size: 3rem;
	font-weight: 300;
	letter-spacing: -.03em;
	line-height: 1;
	color: var( --btf-kk-ink );
	margin-bottom: .7rem;
}
body.btf-kk-page .btf-kk-eq-detail.bad  .btf-kk-eq-detail-num { color: var( --btf-kk-red ); }
body.btf-kk-page .btf-kk-eq-detail.good .btf-kk-eq-detail-num { color: var( --btf-kk-forest ); }
body.btf-kk-page .btf-kk-eq-detail-num small {
	font-family: var( --btf-kk-mono );
	font-size: .72rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var( --btf-kk-muted );
	margin-left: .3em;
}
body.btf-kk-page .btf-kk-eq-detail p {
	margin: 0;
	font-size: .98rem;
	line-height: 1.6;
	color: var( --btf-kk-ink-2 );
}

/* ── Callouts (pitfall variant = red tint with dark icon pill) ────────── */
body.btf-kk-page .btf-kk-callout {
	display: flex;
	gap: 1rem;
	align-items: flex-start;
	padding: 1.1rem 1.3rem;
	border-radius: 10px;
	margin: 1.4rem 0 0;
	font-size: .94rem;
	line-height: 1.55;
}
body.btf-kk-page .btf-kk-callout.pitfall {
	background: rgba( 139, 36, 36, .08 );
	border: 1px solid rgba( 139, 36, 36, .18 );
	color: var( --btf-kk-ink );
}
body.btf-kk-page .btf-kk-callout-icon {
	font-family: var( --btf-kk-mono );
	font-size: .68rem;
	letter-spacing: .14em;
	font-weight: 700;
	padding: .25rem .55rem;
	border-radius: 3px;
	flex-shrink: 0;
	margin-top: .15em;
	text-transform: uppercase;
	background: var( --btf-kk-red );
	color: #fff;
	align-self: flex-start;
}
body.btf-kk-page .btf-kk-callout-body { display: block; }
body.btf-kk-page .btf-kk-callout-body b,
body.btf-kk-page .btf-kk-callout-body strong { font-weight: 700; }
@media ( max-width: 540px ) {
	body.btf-kk-page .btf-kk-callout {
		flex-direction: column;
		gap: .55rem;
	}
}

/* ── 02 Hand replay ───────────────────────────────────────────────────── */
body.btf-kk-page .btf-kk-replay {
	background: var( --btf-kk-cream-2 );
	border: 1px solid var( --btf-kk-hair );
	border-radius: 16px;
	padding: 1.6rem;
}
body.btf-kk-page .btf-kk-replay-step[data-kk-hidden="true"] { display: none; }
body.btf-kk-page .btf-kk-replay-main {
	display: grid;
	grid-template-columns: 1.5fr 1fr;
	gap: 1.1rem;
}
@media ( max-width: 860px ) { body.btf-kk-page .btf-kk-replay-main { grid-template-columns: 1fr; } }
body.btf-kk-page .btf-kk-replay-stage {
	background: var( --btf-kk-cream );
	border: 1px solid var( --btf-kk-hair );
	border-radius: 12px;
	padding: 1.3rem 1.4rem;
}
body.btf-kk-page .btf-kk-replay-top {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 1rem;
	margin-bottom: 1.1rem;
}
body.btf-kk-page .btf-kk-replay-steps {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem;
}
body.btf-kk-page .btf-kk-replay-tab {
	background: var( --btf-kk-cream-2 );
	border: 1px solid var( --btf-kk-hair );
	border-radius: 6px;
	padding: .35rem .6rem;
	cursor: pointer;
	font-family: var( --btf-kk-mono );
	font-size: .68rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var( --btf-kk-ink-2 );
	display: flex;
	align-items: center;
	gap: .4em;
	transition: all .15s;
}
body.btf-kk-page .btf-kk-replay-tab-n {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: var( --btf-kk-cream-3 );
	color: var( --btf-kk-muted );
	display: grid;
	place-items: center;
	font-size: .6rem;
	font-weight: 600;
}
body.btf-kk-page .btf-kk-replay-tab.done .btf-kk-replay-tab-n {
	background: var( --btf-kk-forest );
	color: var( --btf-kk-cream );
}
body.btf-kk-page .btf-kk-replay-tab.active {
	background: var( --btf-kk-forest );
	border-color: var( --btf-kk-forest );
	color: var( --btf-kk-cream );
}
body.btf-kk-page .btf-kk-replay-tab.active .btf-kk-replay-tab-n {
	background: var( --btf-kk-gold-soft );
	color: var( --btf-kk-forest-2 );
}
body.btf-kk-page .btf-kk-replay-pot {
	text-align: right;
	flex-shrink: 0;
}
body.btf-kk-page .btf-kk-replay-pot .btf-kk-lbl { margin-bottom: .15em; display: inline-block; }
body.btf-kk-page .btf-kk-replay-pot b {
	font-family: var( --btf-kk-serif );
	font-size: 1.6rem;
	font-weight: 500;
	letter-spacing: -.02em;
	color: var( --btf-kk-forest );
	display: block;
}

body.btf-kk-page .btf-kk-replay-felt {
	display: flex;
	gap: 1.6rem;
	padding: 1.2rem;
	background: var( --btf-kk-forest );
	border-radius: 10px;
	margin-bottom: 1.1rem;
	flex-wrap: wrap;
}
/* (felt label color handled by .btf-kk-lbl.on-felt) */
body.btf-kk-page .btf-kk-replay-hole,
body.btf-kk-page .btf-kk-replay-board {
	display: flex;
	flex-direction: column;
	gap: .5rem;
}
body.btf-kk-page .btf-kk-replay-board { flex: 1; min-width: 0; }
body.btf-kk-page .btf-kk-replay-cards {
	display: flex;
	gap: .4rem;
	align-items: center;
	min-height: 70px;
	flex-wrap: wrap;
}
body.btf-kk-page .btf-kk-replay-cards .btf-kk-card { width: 48px; height: 68px; }
body.btf-kk-page .btf-kk-replay-cards .btf-kk-card b { font-size: 1.4rem; }
body.btf-kk-page .btf-kk-replay-cards .btf-kk-card i { font-size: .95rem; }
body.btf-kk-page .btf-kk-replay-preflop {
	font-family: var( --btf-kk-serif );
	font-style: italic;
	color: rgba( 243, 238, 226, .6 );
	font-size: .95rem;
}

body.btf-kk-page .btf-kk-replay-log p { margin: 0 0 .7rem; }
body.btf-kk-page .btf-kk-replay-log p:last-child { margin-bottom: 0; }
body.btf-kk-page .btf-kk-replay-action {
	font-size: 1.02rem;
	line-height: 1.6;
	color: var( --btf-kk-ink );
}
body.btf-kk-page .btf-kk-replay-result {
	font-size: .95rem;
	line-height: 1.55;
	color: var( --btf-kk-ink-2 );
}
body.btf-kk-page .btf-kk-replay-result b { color: var( --btf-kk-ink ); }

body.btf-kk-page .btf-kk-replay-note {
	border-radius: 12px;
	padding: 1.3rem 1.4rem;
	border: 1px solid var( --btf-kk-hair );
	align-self: start;
}
body.btf-kk-page .btf-kk-replay-note.bad {
	background: rgba( 139, 36, 36, .07 );
	border-color: rgba( 139, 36, 36, .25 );
}
body.btf-kk-page .btf-kk-replay-note.ok { background: var( --btf-kk-cream ); }
body.btf-kk-page .btf-kk-replay-note-tag {
	font-family: var( --btf-kk-mono );
	font-size: .66rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	font-weight: 600;
	color: var( --btf-kk-red );
	display: block;
	margin-bottom: .5rem;
}
body.btf-kk-page .btf-kk-replay-note.ok .btf-kk-replay-note-tag { color: var( --btf-kk-forest ); }
body.btf-kk-page .btf-kk-replay-note p {
	margin: 0;
	font-family: var( --btf-kk-serif );
	font-size: 1.05rem;
	line-height: 1.55;
	color: var( --btf-kk-ink );
}

body.btf-kk-page .btf-kk-replay-nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-top: 1.2rem;
	padding-top: 1.2rem;
	border-top: 1px solid var( --btf-kk-hair );
}
body.btf-kk-page .btf-kk-replay-counter {
	font-family: var( --btf-kk-mono );
	font-size: .78rem;
	letter-spacing: .08em;
	color: var( --btf-kk-muted );
}
body.btf-kk-page .btf-kk-replay-nav button[disabled] { opacity: .4; cursor: not-allowed; }

/* Separate row for the fix-toggle button — always visible, click reveals
   the disciplined-line fix panel below. Replaces the old Next-swap UX. */
body.btf-kk-page .btf-kk-replay-fix-row {
	display: flex;
	justify-content: center;
	margin-top: 1rem;
}
body.btf-kk-page .btf-kk-replay-fix-row[hidden] { display: none; }
body.btf-kk-page .btf-kk-replay-fix-row .btf-kk-replay-fix {
	font-family: var( --btf-kk-mono );
	font-size: .72rem;
	letter-spacing: .12em;
	text-transform: uppercase;
	font-weight: 700;
	color: var( --btf-kk-ink );
	border: 1px solid var( --btf-kk-hair );
	background: var( --btf-kk-cream );
	padding: .7em 1.4em;
	border-radius: 6px;
	cursor: pointer;
	transition: all .15s;
}
body.btf-kk-page .btf-kk-replay-fix-row .btf-kk-replay-fix:hover {
	border-color: var( --btf-kk-ink-2 );
	background: var( --btf-kk-cream-3 );
}
body.btf-kk-page .btf-kk-replay-fix-row .btf-kk-replay-fix[aria-expanded="true"] {
	background: var( --btf-kk-cream-3 );
	border-color: var( --btf-kk-ink-2 );
}

body.btf-kk-page .btf-kk-fix {
	margin-top: 1.2rem;
	background: var( --btf-kk-forest );
	color: var( --btf-kk-cream );
	border-radius: 12px;
	padding: 1.6rem 1.8rem;
}
body.btf-kk-page .btf-kk-fix[hidden] { display: none; }
body.btf-kk-page .btf-kk-fix-eyebrow {
	display: inline-block;
	font-family: var( --btf-kk-mono );
	font-size: .72rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var( --btf-kk-gold-soft );
	margin-bottom: .35rem;
}
body.btf-kk-page .btf-kk-fix .btf-kk-fix-h,
body.btf-kk-page .btf-kk-fix h4.btf-th-display.btf-kk-fix-h {
	font-size: 1.5rem;
	margin: .15em 0 1.1rem;
	color: var( --btf-kk-cream );
}
body.btf-kk-page .btf-kk-fix-grid {
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: .9rem;
}
@media ( max-width: 760px ) { body.btf-kk-page .btf-kk-fix-grid { grid-template-columns: 1fr; } }
body.btf-kk-page .btf-kk-fix-card {
	background: rgba( 243, 238, 226, .06 );
	border: 1px solid rgba( 243, 238, 226, .13 );
	border-radius: 10px;
	padding: 1.2rem 1.3rem;
}
body.btf-kk-page .btf-kk-fix-n {
	font-family: var( --btf-kk-mono );
	font-size: .7rem;
	letter-spacing: .12em;
	color: var( --btf-kk-gold-soft );
	font-weight: 600;
	display: block;
	margin-bottom: .5rem;
}
body.btf-kk-page .btf-kk-fix-card b {
	font-family: var( --btf-kk-serif );
	font-weight: 500;
	font-size: 1.12rem;
	letter-spacing: -.01em;
	color: var( --btf-kk-cream );
	display: block;
	margin-bottom: .4rem;
}
body.btf-kk-page .btf-kk-fix-card p {
	margin: 0;
	font-size: .92rem;
	line-height: 1.5;
	color: rgba( 243, 238, 226, .8 ) !important;
}

/* ── 03 Preflop tabs + card ───────────────────────────────────────────── */
body.btf-kk-page .btf-kk-pf-tabs {
	display: grid;
	grid-template-columns: repeat( 4, 1fr );
	gap: .5rem;
	margin-bottom: 1.4rem;
}
@media ( max-width: 760px ) { body.btf-kk-page .btf-kk-pf-tabs { grid-template-columns: 1fr 1fr; } }
body.btf-kk-page .btf-kk-pf-tab {
	background: var( --btf-kk-cream-2 );
	border: 1px solid var( --btf-kk-hair );
	border-radius: 10px;
	padding: 1rem 1.1rem;
	cursor: pointer;
	text-align: left;
	display: flex;
	flex-direction: column;
	gap: .35em;
	font: inherit;
	color: var( --btf-kk-ink );
	transition: all .15s;
	border-top-width: 3px;
}
body.btf-kk-page .btf-kk-pf-tab.good { border-top-color: var( --btf-kk-forest ); }
body.btf-kk-page .btf-kk-pf-tab.ok   { border-top-color: var( --btf-kk-gold ); }
body.btf-kk-page .btf-kk-pf-tab.bad  { border-top-color: var( --btf-kk-red ); }
body.btf-kk-page .btf-kk-pf-tab:hover { border-color: var( --btf-kk-ink-2 ); }
body.btf-kk-page .btf-kk-pf-tab.active {
	background: var( --btf-kk-forest );
	color: var( --btf-kk-cream );
	border-color: var( --btf-kk-forest );
}
body.btf-kk-page .btf-kk-pf-tab b {
	font-family: var( --btf-kk-serif );
	font-weight: 500;
	font-size: 1.08rem;
	letter-spacing: -.01em;
}
body.btf-kk-page .btf-kk-pf-tab-action {
	font-family: var( --btf-kk-mono );
	font-size: .68rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var( --btf-kk-muted );
}
body.btf-kk-page .btf-kk-pf-tab.active .btf-kk-pf-tab-action { color: var( --btf-kk-gold-soft ); }

body.btf-kk-page .btf-kk-pf-card[data-kk-hidden="true"] { display: none; }
body.btf-kk-page .btf-kk-pf-card {
	background: var( --btf-kk-cream-2 );
	border: 1px solid var( --btf-kk-hair );
	border-radius: 14px;
	padding: 1.8rem 2rem;
	border-left-width: 3px;
}
body.btf-kk-page .btf-kk-pf-card.good { border-left-color: var( --btf-kk-forest ); }
body.btf-kk-page .btf-kk-pf-card.ok   { border-left-color: var( --btf-kk-gold ); }
body.btf-kk-page .btf-kk-pf-card.bad  { border-left-color: var( --btf-kk-red ); }
body.btf-kk-page .btf-kk-pf-card-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var( --btf-kk-hair );
	flex-wrap: wrap;
}
body.btf-kk-page .btf-kk-pf-card h3.btf-th-display.btf-kk-pf-card-title {
	margin: 0;
	font-size: 1.5rem;
}
body.btf-kk-page .btf-kk-pf-pill {
	font-family: var( --btf-kk-mono );
	font-size: .7rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	font-weight: 600;
	padding: .35em .7em;
	border-radius: 4px;
	white-space: nowrap;
}
body.btf-kk-page .btf-kk-pf-pill.good { background: rgba( 29, 52, 38, .12 ); color: var( --btf-kk-forest ); }
body.btf-kk-page .btf-kk-pf-pill.ok   { background: rgba( 201, 162, 74, .2 );  color: #7d5e1a; }
body.btf-kk-page .btf-kk-pf-pill.bad  { background: rgba( 139, 36, 36, .12 ); color: var( --btf-kk-red ); }
body.btf-kk-page .btf-kk-pf-body {
	margin: 0 0 1.2rem;
	font-size: 1.05rem;
	line-height: 1.6;
	color: var( --btf-kk-ink );
	max-width: 70ch;
}
body.btf-kk-page .btf-kk-pf-detail {
	margin-top: 1.4rem;
	background: var( --btf-kk-cream );
	border: 1px solid var( --btf-kk-hair );
	border-radius: 10px;
	padding: 1.1rem 1.3rem;
}
body.btf-kk-page .btf-kk-pf-detail .btf-kk-lbl { margin-bottom: .55em; }
body.btf-kk-page .btf-kk-pf-detail p { margin: 0; }
body.btf-kk-page .btf-kk-pf-detail p {
	margin: .35em 0 0;
	font-size: .96rem;
	line-height: 1.6;
	color: var( --btf-kk-ink-2 );
}

/* ── KK vs AA stat block ──────────────────────────────────────────────── */
body.btf-kk-page .btf-kk-vsaa-wrap {
	margin-top: 2rem;
	padding-top: 1.8rem;
	border-top: 1px solid var( --btf-kk-hair );
}
body.btf-kk-page .btf-kk-vsaa-h {
	margin: 0 0 1.6rem;
	font-size: 1.5rem;
}
body.btf-kk-page .btf-kk-vsaa {
	display: grid;
	grid-template-columns: repeat( 4, 1fr );
	gap: 1rem;
	margin: 1.6rem 0 1.6rem;
}
@media ( max-width: 760px ) { body.btf-kk-page .btf-kk-vsaa { grid-template-columns: 1fr 1fr; } }
body.btf-kk-page .btf-kk-vsaa-stat {
	background: var( --btf-kk-cream-2 );
	border: 1px solid var( --btf-kk-hair );
	border-radius: 14px;
	padding: 1.5rem 1.4rem;
	border-top-width: 3px;
	text-align: center;
}
body.btf-kk-page .btf-kk-vsaa-stat.good { border-top-color: var( --btf-kk-forest ); }
body.btf-kk-page .btf-kk-vsaa-stat.ok   { border-top-color: var( --btf-kk-gold ); }
body.btf-kk-page .btf-kk-vsaa-stat.bad  { border-top-color: var( --btf-kk-red ); }
body.btf-kk-page .btf-kk-vsaa-num {
	font-family: var( --btf-kk-serif );
	font-size: 2.3rem;
	font-weight: 300;
	letter-spacing: -.03em;
	line-height: 1;
	color: var( --btf-kk-ink );
	margin-bottom: .5rem;
}
body.btf-kk-page .btf-kk-vsaa-stat.good .btf-kk-vsaa-num { color: var( --btf-kk-forest ); }
body.btf-kk-page .btf-kk-vsaa-stat.bad  .btf-kk-vsaa-num { color: var( --btf-kk-red ); }
body.btf-kk-page .btf-kk-vsaa-stat p {
	margin: 0;
	font-size: .88rem;
	line-height: 1.45;
	color: var( --btf-kk-ink-2 );
}
body.btf-kk-page .btf-kk-vsaa-foot {
	margin: 1.2rem 0 0;
	font-family: var( --btf-kk-serif );
	font-size: 1.08rem;
	line-height: 1.6;
	color: var( --btf-kk-ink );
	max-width: 80ch;
}

/* ── 04 Ace on flop ───────────────────────────────────────────────────── */
body.btf-kk-page .btf-kk-af {
	display: flex;
	flex-direction: column;
	gap: 1.2rem;
}
body.btf-kk-page .btf-kk-af-prob {
	display: grid;
	grid-template-columns: 1fr 1.4fr;
	gap: 1.2rem;
	background: var( --btf-kk-cream-2 );
	border: 1px solid var( --btf-kk-hair );
	border-radius: 14px;
	padding: 1.6rem 1.8rem;
	align-items: center;
}
@media ( max-width: 760px ) { body.btf-kk-page .btf-kk-af-prob { grid-template-columns: 1fr; } }
body.btf-kk-page .btf-kk-af-prob-big {
	text-align: center;
	border-right: 1px solid var( --btf-kk-hair );
	padding-right: 1.2rem;
}
@media ( max-width: 760px ) {
	body.btf-kk-page .btf-kk-af-prob-big {
		border-right: 0;
		border-bottom: 1px solid var( --btf-kk-hair );
		padding: 0 0 1.2rem;
	}
}
body.btf-kk-page .btf-kk-af-prob-num {
	font-family: var( --btf-kk-serif );
	font-size: 3.6rem;
	font-weight: 300;
	letter-spacing: -.03em;
	line-height: 1;
	color: var( --btf-kk-red );
	margin-bottom: .5rem;
}
body.btf-kk-page .btf-kk-af-prob-big p {
	margin: 0;
	font-size: .95rem;
	line-height: 1.5;
	color: var( --btf-kk-ink-2 );
}
body.btf-kk-page .btf-kk-af-prob-sub {
	display: flex;
	flex-direction: column;
	gap: .6rem;
}
body.btf-kk-page .btf-kk-af-prob-row {
	display: flex;
	align-items: baseline;
	gap: .8rem;
	font-size: .98rem;
	color: var( --btf-kk-ink-2 );
}
body.btf-kk-page .btf-kk-af-prob-pct {
	font-family: var( --btf-kk-serif );
	font-size: 1.3rem;
	font-weight: 500;
	color: var( --btf-kk-ink );
	min-width: 64px;
}
body.btf-kk-page .btf-kk-af-prob-note {
	margin: .3rem 0 0;
	font-family: var( --btf-kk-serif );
	font-style: italic;
	font-size: .98rem;
	line-height: 1.55;
	color: var( --btf-kk-ink );
	padding-top: .7rem;
	border-top: 1px solid var( --btf-kk-hair );
}

body.btf-kk-page .btf-kk-af-tabs {
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: .5rem;
	margin-bottom: 1rem;
}
@media ( max-width: 700px ) { body.btf-kk-page .btf-kk-af-tabs { grid-template-columns: 1fr; } }
body.btf-kk-page .btf-kk-af-tab {
	background: var( --btf-kk-cream-2 );
	border: 1px solid var( --btf-kk-hair );
	border-radius: 10px;
	padding: .9rem 1rem;
	cursor: pointer;
	font: inherit;
	color: var( --btf-kk-ink );
	font-family: var( --btf-kk-serif );
	font-weight: 500;
	font-size: 1rem;
	letter-spacing: -.01em;
	text-align: left;
	transition: all .15s;
	border-left-width: 3px;
}
body.btf-kk-page .btf-kk-af-tab.good { border-left-color: var( --btf-kk-forest ); }
body.btf-kk-page .btf-kk-af-tab.ok   { border-left-color: var( --btf-kk-gold ); }
body.btf-kk-page .btf-kk-af-tab.bad  { border-left-color: var( --btf-kk-red ); }
body.btf-kk-page .btf-kk-af-tab:hover { border-color: var( --btf-kk-ink-2 ); }
body.btf-kk-page .btf-kk-af-tab.active {
	background: var( --btf-kk-forest );
	color: var( --btf-kk-cream );
	border-color: var( --btf-kk-forest );
}

body.btf-kk-page .btf-kk-af-card[data-kk-hidden="true"] { display: none; }
body.btf-kk-page .btf-kk-af-card {
	background: var( --btf-kk-cream-2 );
	border: 1px solid var( --btf-kk-hair );
	border-radius: 14px;
	padding: 1.6rem 1.8rem;
	border-left-width: 3px;
}
body.btf-kk-page .btf-kk-af-card.good { border-left-color: var( --btf-kk-forest ); }
body.btf-kk-page .btf-kk-af-card.ok   { border-left-color: var( --btf-kk-gold ); }
body.btf-kk-page .btf-kk-af-card.bad  { border-left-color: var( --btf-kk-red ); }
body.btf-kk-page .btf-kk-af-card-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1rem;
	flex-wrap: wrap;
}
body.btf-kk-page .btf-kk-af-flop {
	display: flex;
	gap: .4rem;
}
body.btf-kk-page .btf-kk-af-flop .btf-kk-card {
	width: 52px;
	height: 74px;
}
body.btf-kk-page .btf-kk-af-flop .btf-kk-card b { font-size: 1.5rem; }
body.btf-kk-page .btf-kk-af-flop .btf-kk-card i { font-size: 1rem; }
body.btf-kk-page .btf-kk-af-action {
	font-family: var( --btf-kk-mono );
	font-size: .72rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	font-weight: 600;
	padding: .4em .8em;
	border-radius: 4px;
}
body.btf-kk-page .btf-kk-af-action.good { background: rgba( 29, 52, 38, .12 ); color: var( --btf-kk-forest ); }
body.btf-kk-page .btf-kk-af-action.ok   { background: rgba( 201, 162, 74, .2 );  color: #7d5e1a; }
body.btf-kk-page .btf-kk-af-action.bad  { background: rgba( 139, 36, 36, .12 ); color: var( --btf-kk-red ); }
body.btf-kk-page .btf-kk-af-card p {
	margin: 0;
	font-size: 1.02rem;
	line-height: 1.6;
	color: var( --btf-kk-ink-2 );
}

/* ── 05 Takeaways ─────────────────────────────────────────────────────── */
body.btf-kk-page .btf-kk-takes {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: .7rem;
	margin-top: 1.8rem;
}
@media ( max-width: 760px ) { body.btf-kk-page .btf-kk-takes { grid-template-columns: 1fr; } }
body.btf-kk-page .btf-kk-take {
	display: grid;
	grid-template-columns: 48px 1fr;
	gap: 1rem;
	padding: 1.2rem 1.4rem;
	background: var( --btf-kk-cream-2 );
	border: 1px solid var( --btf-kk-hair );
	border-radius: 12px;
}
body.btf-kk-page .btf-kk-take-icon {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	font-family: var( --btf-kk-mono );
	font-weight: 700;
	font-size: 1rem;
	align-self: start;
	margin-top: .15em;
}
body.btf-kk-page .btf-kk-take-icon.good { background: var( --btf-kk-forest ); color: var( --btf-kk-cream ); }
body.btf-kk-page .btf-kk-take-icon.bad  { background: var( --btf-kk-red );    color: var( --btf-kk-cream ); }
body.btf-kk-page .btf-kk-take h4.btf-th-display {
	font-size: 1.15rem;
	margin: 0 0 .35em;
}
body.btf-kk-page .btf-kk-take p {
	margin: 0;
	font-size: .95rem;
	line-height: 1.55;
	color: var( --btf-kk-ink-2 );
}

/* ── Summary — dark felt ──────────────────────────────────────────────── */
body.btf-kk-page .btf-kk-summary {
	background: var( --btf-kk-forest );
	color: var( --on-dark );
	padding: 4rem 0;
	margin-top: 2rem;
	scroll-margin-top: 80px;
}
body.btf-kk-page .btf-kk-sm-eyebrow {
	display: inline-block;
	font-family: var( --btf-kk-mono );
	font-size: .72rem;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var( --btf-kk-gold-soft );
	font-weight: 600;
	margin-bottom: 1rem;
}
body.btf-kk-page .btf-kk-sm-display {
	font-family: var( --btf-kk-serif );
	font-weight: 400;
	color: var( --on-dark );
	font-size: clamp( 1.6rem, 3vw, 2.4rem );
	letter-spacing: -.02em;
	margin: 0 0 2rem;
	line-height: 1.15;
}
body.btf-kk-page .btf-kk-sm-display em {
	color: var( --btf-kk-gold-soft );
	font-style: italic;
}
body.btf-kk-page .btf-kk-summary-grid {
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: 1rem;
}
@media ( max-width: 880px ) {
	body.btf-kk-page .btf-kk-summary-grid { grid-template-columns: 1fr; }
}
body.btf-kk-page .btf-kk-summary-card {
	background: rgba( 255, 255, 255, .04 );
	border: 1px solid rgba( 255, 255, 255, .1 );
	border-radius: 14px;
	padding: 1.8rem;
}
body.btf-kk-page .btf-kk-summary-num {
	display: inline-block;
	font-family: var( --btf-kk-serif );
	font-size: 2.4rem;
	font-weight: 500;
	color: var( --btf-kk-gold-soft );
	letter-spacing: -.02em;
	line-height: 1;
	margin-bottom: .6rem;
}
body.btf-kk-page .btf-kk-summary-card h4.btf-th-display {
	color: var( --on-dark );
	font-size: 1.2rem;
	margin: 0 0 .5em;
}
body.btf-kk-page .btf-kk-summary .btf-kk-summary-card p {
	margin: 0;
	color: rgba( 255, 255, 255, .8 );
	font-size: .98rem;
	line-height: 1.55;
}

/* ── [hidden] / SSR fallbacks ─────────────────────────────────────────── */
body.btf-kk-page [data-kk-hidden="true"] { display: none; }