/* Homepage on phones. The desktop slideshow hero is hidden below 640px
   (uk-visible@s), so .m-hero is the phone's first screen; everything else
   here tightens the leaderboard and sections for a 360–430px viewport. */

.m-hero { display: none; }

@media (max-width: 639px) {
	/* ── Hero ──────────────────────────────────────────────────────────── */
	.m-hero {
		display: block; position: relative; overflow: hidden;
		padding: 40px 18px 26px;
		background:
			radial-gradient(120% 80% at 100% 0%, rgba(252, 180, 45, 0.16), transparent 60%),
			radial-gradient(90% 70% at 0% 100%, rgba(59, 210, 151, 0.08), transparent 60%),
			#0a0f1c;
		border-bottom: 1px solid rgba(255, 255, 255, 0.06);
	}
	.m-hero-eyebrow {
		display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 999px;
		font-size: 0.72rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
		color: #FCB42D; background: rgba(252, 180, 45, 0.1); border: 1px solid rgba(252, 180, 45, 0.25);
	}
	.m-dot { width: 7px; height: 7px; border-radius: 50%; background: #3BD297; box-shadow: 0 0 0 3px rgba(59, 210, 151, 0.22); animation: m-pulse 2.2s ease-in-out infinite; }
	@keyframes m-pulse { 50% { box-shadow: 0 0 0 6px rgba(59, 210, 151, 0); } }
	.m-hero-title { margin: 16px 0 10px; font-size: 2.05rem; line-height: 1.08; font-weight: 800; letter-spacing: -0.025em; color: #fff; }
	.m-hero-title span { display: block; background: linear-gradient(135deg, #FCB42D, #ffd36b); -webkit-background-clip: text; background-clip: text; color: transparent; }
	.m-hero-lead { margin: 0 0 18px; font-size: 0.98rem; line-height: 1.55; color: #c3c9d6; }
	.m-hero-stats {
		display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin-bottom: 18px;
		border-radius: 14px; overflow: hidden; background: rgba(255, 255, 255, 0.07); border: 1px solid rgba(255, 255, 255, 0.07);
	}
	.m-hero-stats > div { display: flex; flex-direction: column; gap: 3px; padding: 11px 12px; background: #111627; }
	.m-hero-stats span { font-size: 0.62rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: #8c95a8; white-space: nowrap; }
	.m-hero-stats b { font-size: 1.06rem; font-weight: 800; color: #fff; font-variant-numeric: tabular-nums; white-space: nowrap; }
	.m-hero-stats > div:first-child b { color: #FCB42D; }
	.m-hero-cta { display: grid; gap: 10px; }
	.m-btn {
		display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; border-radius: 14px;
		font-weight: 800; font-size: 1rem; text-decoration: none !important; color: #e8ecf5 !important;
		background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.1); transition: transform 0.1s;
	}
	.m-btn:active { transform: scale(0.98); }
	.m-btn-gold { color: #0a0f1c !important; background: linear-gradient(135deg, #FCB42D, #ffd36b); border: 0; box-shadow: 0 14px 30px -14px rgba(252, 180, 45, 0.75); }
	.m-hero-trust { list-style: none; margin: 16px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; }
	.m-hero-trust li { font-size: 0.78rem; color: #8c95a8; display: inline-flex; align-items: center; gap: 6px; }
	.m-hero-trust i { color: #3BD297; font-size: 0.75rem; }

	/* ── "This week" block: the hero already said it — keep it compact ── */
	#lb-hero { padding-top: 22px !important; padding-bottom: 6px !important; }
	#lb-hero .lb-title { font-size: 1.55rem !important; margin-bottom: 6px !important; }
	#lb-hero .lb-subtitle { font-size: 0.86rem !important; margin-bottom: 14px !important; }
	#lb-hero .lb-agg-row { gap: 8px !important; }
	#lb-hero .lb-agg { padding: 12px !important; }
	#lb-hero .lb-agg-icon { display: none !important; }
	#lb-hero .lb-agg-label { font-size: 0.6rem !important; margin-bottom: 2px !important; }
	#lb-hero .lb-agg-value { font-size: 1.15rem !important; }

	/* ── Leader card ───────────────────────────────────────────────────── */
	#champ-hero { padding: 22px 16px 18px !important; }
	#champ-hero .champ-watermark { font-size: 7rem !important; right: 0 !important; }
	#champ-hero .champ-profit { font-size: 2rem !important; }
	#champ-hero .champ-stat-grid { gap: 6px !important; }
	#champ-hero .champ-stat { padding: 10px 6px !important; }

	/* ── Runners-up: side by side, essentials only ─────────────────────── */
	.runners-grid { grid-template-columns: 1fr 1fr !important; gap: 10px !important; }
	.runner-card { padding: 14px 12px !important; min-width: 0; min-height: 0 !important; }
	.runner-card .runner-prize { margin-top: 4px !important; }
	.runner-card .runner-rank-watermark { font-size: 4.2rem !important; top: -6px !important; right: -4px !important; opacity: 0.5; }
	.runner-card .runner-stat-grid { display: none !important; }
	.runner-card .runner-name { font-size: 0.95rem !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	.runner-card .runner-meta .rr-stars { display: none !important; }
	.runner-card .runner-profit { font-size: 1.3rem !important; }
	.runner-card .runner-roi { font-size: 0.7rem !important; padding: 3px 8px !important; }
	.runner-card .runner-profit-block { margin: 10px 0 !important; }
	.runner-card .runner-prize { padding: 9px 10px !important; gap: 8px !important; }
	.runner-card .runner-prize-icon, .runner-card .runner-prize-pct { display: none !important; }

	/* ── Leaderboard table: rank · trader · R:R · return · prize ────────── */
	/* Auto layout on phones: rank, R:R and prize shrink to their content and the
	   trader column (width:100% + max-width:0 → ellipsis) takes all the rest. */
	.lb-table { table-layout: auto !important; }
	.lb-table thead th { width: auto !important; }
	.lb-table .cell-rank, .lb-table .cell-rr, .lb-table .cell-prize { width: 1% !important; white-space: nowrap; }
	.lb-table thead th:nth-child(3) { font-size: 0 !important; }
	.lb-table thead th:nth-child(3)::after { content: "R:R"; font-size: 10px; }
	/* Return hidden on phones — R:R (what ranks you) and the prize stay */
	.lb-table thead th:nth-child(4), .lb-table .cell-return { display: none !important; }
	.lb-table .cell-rank { padding-left: 8px !important; padding-right: 2px !important; }
	.lb-table .rank-badge { min-width: 0 !important; width: 32px !important; height: 28px !important; padding: 0 !important; font-size: 0.78rem !important; }
	.lb-table .cell-trader { max-width: 0; width: 100%; }
	.lb-table .trader-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 0.86rem !important; }
	.lb-table .trader-country { font-size: 0.7rem !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	.lb-table .cell-rr > div > div + div,
	.lb-table .cell-return > div > div + div,
	.lb-table .cell-prize > div > div { display: none !important; }
	.lb-table .cell-prize span { padding: 3px 8px !important; font-size: 11.5px !important; }
	.lb-table .cell-prize i { display: none; }
	.lb-table td, .lb-table th { padding-left: 4px !important; padding-right: 4px !important; }

	/* ── Long-form sections: a calmer vertical rhythm ──────────────────── */
	main .uk-section { padding-top: 44px; padding-bottom: 44px; }
}

@media (prefers-reduced-motion: reduce) {
	.m-dot { animation: none; }
}