:root {
	--fm-yellow: #ffca05;
	--fm-gold: #d79800;
	--fm-black: #050505;
	--fm-panel: #151515;
}

body.fomototo-home {
	margin: 0;
	padding: 0 !important;
	background: #f8c914 var(--fm-desktop-background, url('../fomototo/background-desktop.webp')) center top / cover fixed no-repeat;
	color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: 0;
	line-height: 1.45;
}

.fomototo-home *,
.fomototo-home *::before,
.fomototo-home *::after {
	box-sizing: border-box;
}

.fomototo-home a { text-decoration: none; }
.fomototo-home img { display: block; max-width: 100%; }
.fm-mobile-landing { display: none; }

.fm-desktop-site {
	width: min(1000px, calc(100% - 30px));
	margin: 0 auto;
	background: var(--fm-black);
	box-shadow: 0 0 28px rgba(0, 0, 0, .25);
}

.fm-topbar {
	height: 68px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 28px;
	background: linear-gradient(110deg, #7c650b, #a08112 52%, #80680d);
}

.fm-brand { width: 190px; }
.fm-brand img { width: 150px; height: auto; }

.fm-header-actions {
	display: grid;
	grid-template-columns: repeat(2, 172px);
	gap: 12px;
}

.fm-cta {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	overflow: hidden;
	border: 2px solid #ffda00;
	border-radius: 9px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 800;
	text-align: center;
	transition: transform .18s ease, filter .18s ease;
}
.fm-cta:hover { transform: translateY(-2px); filter: brightness(1.08); }
.fm-cta strong,
.fm-cta span { display: block; }
.fm-cta-download {
	background: linear-gradient(180deg, #fff43b, #ff9e00);
	box-shadow: 0 0 15px rgba(255, 194, 0, .8), inset 0 1px #fff9a7;
	color: #151000;
}
.fm-cta-play {
	background: linear-gradient(180deg, #2a2a2a, #050505);
	box-shadow: 0 0 15px rgba(255, 207, 0, .5), inset 0 1px #686868;
	color: #ffe11a;
}
.fm-header-actions .fm-cta { min-height: 48px; flex-direction: column; gap: 0; }
.fm-header-actions .fm-cta strong { font-size: 15px; }
.fm-header-actions .fm-cta span { font-size: 9px; letter-spacing: 1px; }

.fm-ticker {
	height: 30px;
	display: grid;
	grid-template-columns: 250px 1fr;
	align-items: center;
	background: #ffe206;
	color: #181100;
	font-size: 12px;
	overflow: hidden;
}
.fm-ticker strong { padding-left: 36px; }
.fm-ticker div { overflow: hidden; white-space: nowrap; }
.fm-ticker span { display: inline-block; padding-left: 100%; animation: fm-ticker 18s linear infinite; }
@keyframes fm-ticker { to { transform: translateX(-100%); } }

.fm-quick-actions {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 14px;
	padding: 14px 18px;
	border-bottom: 2px solid #a27c00;
	background: linear-gradient(180deg, #151515, #030303);
}
.fm-quick-actions .fm-cta { min-height: 66px; padding: 8px 18px; }
.fm-quick-actions .fm-cta b { font-size: 30px; line-height: 1; }
.fm-quick-actions .fm-cta strong { font-size: 19px; }
.fm-quick-actions .fm-cta span { font-size: 10px; font-weight: 600; }
.fm-quick-actions .fm-cta-copy { display: flex; flex-direction: column; align-items: flex-start; }

.fm-main-grid { display: grid; grid-template-columns: 250px minmax(0, 1fr); align-items: start; }
.fm-sidebar { min-height: 735px; padding: 10px 18px 20px; background: #030303; }
.fm-menu,
.fm-quick-menu {
	margin: 0;
	padding: 0;
	list-style: none;
}
.fm-menu li,
.fm-quick-menu li { margin: 0 !important; }
.fm-sidebar nav a {
	display: flex;
	align-items: center;
	gap: 14px;
	height: 39px;
	padding: 0 8px;
	border-bottom: 1px solid #d7b900;
	color: #fff;
	font-size: 13px;
}
.fm-sidebar nav a:hover { color: var(--fm-yellow); }
.fm-sidebar nav b { width: 18px; color: #fff; text-align: center; }
.fm-link-stack { display: grid; gap: 8px; margin: 13px 0; }
.fm-link-stack a {
	min-height: 37px;
	display: flex;
	align-items: center;
	padding: 0 12px;
	border: 1px solid #8d7900;
	border-radius: 7px;
	box-shadow: inset 0 0 10px #2a2a2a, 0 0 7px rgba(255, 215, 0, .35);
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1px;
}
.fm-side-box { margin-top: 10px; overflow: hidden; border: 1px solid #bfa700; border-radius: 14px; }
.fm-side-box h2 {
	margin: 0;
	padding: 11px 12px;
	border-bottom: 1px solid #bfa700;
	color: #fff;
	font-size: 13px;
	font-weight: 700;
	text-align: center;
}
.fm-side-box .fm-date { margin: 0; padding: 10px; color: #fff; font-size: 11px; }
.fm-side-box .fm-date span { float: right; letter-spacing: 7px; }
.fm-news { max-height: 180px; overflow-y: auto; border-radius: 10px; }
.fm-news a { display: block; padding: 9px 10px; color: #fff; font-size: 11px; }
.fm-news a:hover { color: var(--fm-yellow); }
.fm-news small { display: block; margin-top: 2px; font-size: 9px; }

.fm-showcase { min-width: 0; padding: 0 7px 16px; background: #020202; }
.fm-hero { position: relative; overflow: hidden; aspect-ratio: 840 / 480; background: #120626; }
.fm-hero img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.64); }
.fm-hero::after { content: ''; position: absolute; inset: 0; z-index: 1; background: rgba(0, 0, 0, .24); pointer-events: none; }
.fm-hero-copy {
	position: absolute;
	z-index: 2;
	inset: 0 auto 0 0;
	width: 72%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 45px 35px;
	background: linear-gradient(90deg, rgba(4, 2, 10, .995) 0%, rgba(17, 4, 36, .985) 82%, transparent 100%);
	text-shadow: 0 3px 10px #000;
}
.fm-hero-copy strong { color: #ffd51b; font-size: 32px; line-height: 1.05; }
.fm-hero-copy span { max-width: 310px; margin-top: 15px; color: #fff; font-size: 15px; font-weight: 700; }
.fm-promos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; padding: 10px 0; }
.fm-promos div { position: relative; overflow: hidden; border: 2px solid #b48b14; border-radius: 8px; background: #080808; }
.fm-promos img { width: 100%; aspect-ratio: 263 / 129; object-fit: cover; filter: brightness(.1) saturate(.5) blur(.7px); }
.fm-promo-copy {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 10px;
	text-align: center;
	text-shadow: 0 2px 6px #000;
}
.fm-promo-copy strong { color: #ffd928; font-size: 16px; line-height: 1.05; }
.fm-promo-copy span { margin-top: 5px; color: #fff; font-size: 9px; font-weight: 700; }

.fm-markets { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; margin: 1px 0 15px; }
.fm-markets article {
	position: relative;
	overflow: hidden;
	min-height: 170px;
	border: 2px solid #8d6716;
	background: linear-gradient(#45bfca 0 48%, #18262d 48% 100%);
}
.fm-markets article::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, transparent 0 18%, rgba(255,255,255,.22) 18% 20%, transparent 20% 43%, rgba(255,255,255,.22) 43% 45%, transparent 45% 68%, rgba(255,255,255,.22) 68% 70%, transparent 70%);
}
.fm-markets img { width: 100%; height: 100%; object-fit: cover; opacity: .18; filter: saturate(.3); }
.fm-market-lines { position: absolute; inset: 58px 16px auto; display: grid; gap: 8px; }
.fm-market-lines i { display: block; height: 4px; background: rgba(231,248,247,.78); box-shadow: 22px 0 rgba(231,248,247,.78), 47px 0 rgba(231,248,247,.78), 75px 0 rgba(231,248,247,.78); }
.fm-markets h3 {
	position: absolute;
	left: 8px;
	right: 8px;
	bottom: 7px;
	margin: 0;
	padding: 5px;
	border-radius: 50%;
	background: linear-gradient(#f7bf00, #7d4c00);
	color: #111;
	font-size: 14px;
	font-style: italic;
	font-weight: 900;
	text-align: center;
	text-shadow: 1px 1px #fff6a5;
}

.fm-socials,
.fm-banks { display: grid; gap: 6px; padding: 8px; background: linear-gradient(100deg, #171717, #090909); }
.fm-socials { grid-template-columns: repeat(4, 1fr); border-block: 2px solid #9c7b17; }
.fm-socials a { display: block; }
.fm-socials img { width: 100%; }
.fm-banks { grid-template-columns: repeat(5, 1fr); padding-top: 10px; }
.fm-banks div {
	overflow: hidden;
	aspect-ratio: 177 / 60;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	border: 1px solid #826214;
	border-radius: 5px;
	background: linear-gradient(180deg, #252525, #050505);
	box-shadow: inset 0 0 12px rgba(255, 207, 0, .2);
}
.fm-banks img { width: 100%; height: 100%; object-fit: cover; }
.fm-banks strong { color: #ffdf20; font-size: 15px; line-height: 1; text-align: center; }
.fm-banks span { margin-top: 5px; color: #4cff22; font-size: 8px; font-weight: 900; letter-spacing: 1px; }
.fm-bank-key { margin: 3px 0 0; color: #fff; font-size: 10px; text-align: center; }
.fm-bank-key i { display: inline-block; width: 10px; height: 10px; border-radius: 50%; vertical-align: -1px; }
.fm-bank-key .online { background: #3cff00; }
.fm-bank-key .warning { background: #ffd800; }
.fm-bank-key .offline { background: #ff1b24; }

.fm-content { padding: 32px 18px 26px; background: #181818; color: #e9e9e9; }
.fm-content h1,
.fm-content h2,
.fm-content h3 { color: #fff; font-family: Arial, Helvetica, sans-serif; font-weight: 800; letter-spacing: 0; }
.fm-content h1 { margin: 0 0 12px; font-size: 29px; line-height: 1.2; }
.fm-content h2 { margin: 30px 0 8px; font-size: 24px; line-height: 1.2; }
.fm-content h3 { margin: 18px 0 5px; font-size: 18px; }
.fm-content p { margin: 0 0 10px; color: #d0d0d0; font-size: 12px; line-height: 1.65; }
.fm-content strong,
.fm-footer a { color: #ffbd00; }
.fm-footer { padding: 18px; background: #050505; color: #eee; font-size: 10px; text-align: center; }

@media (max-width: 767px) {
	body.fomototo-home {
		min-height: 100vh;
		background: #090702 var(--fm-mobile-background, url('../fomototo/hero-mobile.webp')) center / cover fixed no-repeat;
	}
	.fm-desktop-site {
		display: block;
		width: 100%;
		margin: 0;
		box-shadow: none;
	}
	.fm-mobile-landing {
		width: 100%;
		min-height: 100svh;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 16px;
		background: rgba(0, 0, 0, .9);
	}
	.fm-mobile-card {
		width: 100%;
		max-width: 550px;
		overflow: hidden;
		border: 1px solid #fc9004;
		border-radius: 8px;
		background: rgba(0, 0, 0, .13);
		box-shadow: 0 0 13px #f5a400;
		animation: fm-glow 1.8s infinite alternate;
	}
	@keyframes fm-glow { to { box-shadow: 0 0 24px #fbb506; } }
	.fm-mobile-logo {
		height: 114px;
		display: flex;
		align-items: center;
		justify-content: center;
		border-bottom: 1px solid rgba(255,255,255,.65);
		background: rgba(24, 16, 4, .34);
	}
	.fm-mobile-logo img { width: min(250px, 68vw); }
	.fm-mobile-download {
		height: 66px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		margin: 0;
		border-top: 1px solid rgba(255,255,255,.72);
		border-bottom: 1px solid rgba(255,255,255,.72);
		background: linear-gradient(180deg, #fff52c, #ff9f00);
		box-shadow: 0 0 16px rgba(255, 190, 0, .75);
		color: #110d00;
		font-family: 'Segoe UI', Arial, sans-serif;
		font-weight: 900;
	}
	.fm-mobile-download strong { font-size: 18px; }
	.fm-mobile-download span { font-size: 10px; letter-spacing: 2px; }
	.fm-mobile-art {
		position: relative;
		overflow: hidden;
		margin: 15px;
		border-radius: 12px;
		aspect-ratio: 1;
	}
	.fm-mobile-art::after {
		content: '';
		position: absolute;
		top: 0;
		left: -100%;
		width: 45%;
		height: 100%;
		background: linear-gradient(90deg, transparent, rgba(255,247,17,.72), transparent);
		animation: fm-flash 2.2s linear infinite;
	}
	@keyframes fm-flash { to { left: 155%; } }
	.fm-mobile-art img { width: 100%; height: 100%; object-fit: cover; object-position: 56% center; filter: brightness(.58); animation: fm-wave 3s ease-in-out infinite; }
	@keyframes fm-wave { 50% { transform: scale(1.018) skewX(1deg); } }
	.fm-mobile-art-copy {
		position: absolute;
		z-index: 3;
		inset: auto 0 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		min-height: 42%;
		padding: 22px 16px;
		background: linear-gradient(180deg, rgba(0,0,0,.58), rgba(0,0,0,.98) 28%);
		text-align: center;
		text-shadow: 0 3px 8px #000;
	}
	.fm-mobile-art-copy strong { color: #ffd21a; font-size: 30px; line-height: 1; }
	.fm-mobile-art-copy span { margin-top: 8px; color: #fff; font-size: 13px; font-weight: 800; letter-spacing: 1px; }
	.fm-mobile-card h1 {
		margin: 0;
		padding: 14px 12px 18px;
		border-top: 1px solid rgba(255,255,255,.7);
		color: #fff;
		font-family: Arial, sans-serif;
		font-size: 16px;
		font-weight: 700;
		line-height: 1.4;
		text-align: center;
	}
	.fm-topbar {
		height: auto;
		flex-direction: column;
		gap: 13px;
		padding: 18px 15px;
	}
	.fm-brand { width: 170px; }
	.fm-brand img { width: 170px; margin: auto; }
	.fm-header-actions { width: 100%; grid-template-columns: repeat(2, 1fr); }
	.fm-header-actions .fm-cta { min-height: 50px; }
	.fm-ticker {
		height: 60px;
		grid-template-columns: 1fr;
		align-content: center;
		gap: 3px;
	}
	.fm-ticker strong { padding: 0; text-align: center; }
	.fm-quick-actions { grid-template-columns: 1fr; padding: 14px; }
	.fm-quick-actions .fm-cta { min-height: 72px; }
	.fm-main-grid { grid-template-columns: minmax(0, 1fr); }
	.fm-showcase { order: 1; padding: 0 10px 16px; }
	.fm-sidebar { order: 2; min-height: 0; padding: 12px 16px 24px; }
	.fm-promos { grid-template-columns: 1fr; }
	.fm-promo-copy strong { font-size: 24px; }
	.fm-promo-copy span { font-size: 12px; }
	.fm-hero-copy { width: 76%; padding: 24px 18px; }
	.fm-hero-copy strong { font-size: 23px; }
	.fm-hero-copy span { margin-top: 9px; font-size: 12px; }
	.fm-markets { grid-template-columns: repeat(2, 1fr); }
	.fm-socials { grid-template-columns: repeat(2, 1fr); }
	.fm-banks { grid-template-columns: repeat(2, 1fr); }
	.fm-content { padding: 28px 16px; }
	.fm-content h1 { font-size: 25px; }
	.fm-content h2 { font-size: 21px; }
}

@media (prefers-reduced-motion: reduce) {
	.fm-ticker span,
	.fm-mobile-card,
	.fm-mobile-download,
	.fm-mobile-art::after,
	.fm-mobile-art img { animation: none !important; }
}