.agone-landing {
	--surface-1: #020a4e;
	--surface-2: #032872;
	--surface-3: #6c7df2;
	--text-main: #dbe7ff;
	--text-muted: #c4d3f5;
	--button-start: #4e64e5;
	--button-end: #6f47e7;
	--counter-start: #5cb5ff;
	--counter-end: #f161d6;

	/* width: 1440px; */
	height: 800px; 
	max-width: 100%;
	margin-top: 100px !important;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
	border: 0;
	padding: 114px 24px 68px;
	box-sizing: border-box;
	position: relative;
	overflow: hidden;
	opacity: 1;
	background: linear-gradient(145.53deg, #000A3E 40.89%, #0E77FF 157.51%);
	font-family: "Segoe UI", "Trebuchet MS", sans-serif;
}

.agone-landing::after {
	content: "";
	position: absolute;
	width: 191px;
	height: 100px;
	right: 24px;
	bottom: 24px;
	opacity: 1;
	transform: none;
	transform-origin: center;
	background: conic-gradient(from -86.34deg at 51.64% 19.73%, #2962F5 0deg, #B650F1 185.4deg, #39CBD0 360deg);
	filter: blur(250px);
	pointer-events: none;
	z-index: 0;
}

.agone-content-frame-1 {
	width: min(100%, 902px);
	height: 100%;
	min-height: 0;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	gap: 24px;
	align-items: center;
	position: relative;
	z-index: 1;
}

.agone-landing .agone-landing-header,
.agone-landing .agone-landing-content,
.agone-landing .agone-landing-footer {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.agone-landing .agone-landing-header {
	justify-content: flex-start;
	flex: 0 0 auto;
}

.agone-landing .agone-landing-content {
	flex: 1 1 auto;
	min-height: 0;
	justify-content: flex-start;
	gap: 24px;
	color: var(--text-main);
}

.agone-landing .agone-landing-footer {
	justify-content: flex-end;
	flex: 0 0 auto;
	margin-top: auto;
	padding: 12px 0 20px;
}

.agone-content-frame-2 {
	width: 100%;
	min-height: 0;
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 24px;
	color: var(--text-main);
}

.agone-brand {
	margin-top: 6px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.agone-logo-image {
	display: block;
	width: 250px;
	height: 52px;
	object-fit: contain;
	opacity: 1;
}

.agone-copy-block {
	max-width: 780px;
	text-align: center;
}

.agone-copy-block h1 {
	margin: 0;
	width: 799px;
	height: 68px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: 'Google Sans Flex', sans-serif;
	font-size: 68px;
	font-weight: 700;
	line-height: 100%;
	letter-spacing: 5%;
	text-align: center;
	text-transform: uppercase;
	opacity: 1;
	background: linear-gradient(150.41deg, #B6D7FE 24.57%, #F2F7FF 71.6%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.agone-copy-block p {
	margin: 18px 0 0;
	font-size: clamp(17px, 2.2vw, 31px);
	line-height: 1.38;
	color: var(--text-main);
}

.agone-waitlist {
	width: 100%;
	max-width: 560px;
	display: flex;
	justify-content: center;
	gap: 10px;
	padding: 0 12px;
	box-sizing: border-box;
	margin: 0 auto;
}

.agone-waitlist-field {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
	position: relative;
}

.agone-waitlist input {
	width: 100%;
	min-width: 0;
	height: 52px;
	border: 2px solid transparent;
	border-radius: 5px;
	padding: 0 42px 0 16px;
	color: #1f2b51;
	font-size: 15px;
}

.agone-waitlist-field.agone-invalid input {
	border-color: #ff3b30;
}

.agone-error-icon {
	display: none;
	position: absolute;
	right: 14px;
	top: 15px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	border: 2px solid #ff3b30;
	color: #ff3b30;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	align-items: center;
	justify-content: center;
}

.agone-waitlist-field.agone-invalid .agone-error-icon {
	display: inline-flex;
}

.agone-validation-message {
	margin: 0;
	min-height: 15px;
	font-size: 12px;
	line-height: 1.25;
	color: #FBD6D7;
}

.agone-success-message {
	margin: -4px 0 0;
	min-height: 20px;
	font-size: 14px;
	line-height: 1.3;
	color: #b9ffd0;
	text-align: center;
}

.agone-success-message:empty {
	display: none;
	min-height: 0;
	margin: 0;
}

.agone-waitlist input::placeholder {
	color: #8391aa;
}

.agone-waitlist button {
	height: 52px;
	border: 0;
	border-radius: 5px;
	padding: 0 25px;
	color: #ffffff;
	font-size: 15px;
	font-weight: 700;
	white-space: nowrap;
	background: linear-gradient(95deg, var(--button-start), var(--button-end));
}

.agone-subtext {
	margin: 0;
	color: var(--Color-Primary-100, rgba(163, 203, 254, 1));
	font-size: clamp(14px, 1.4vw, 20px);
	text-align: center;
}

.agone-counter {
	width: 191px;
	min-height: 100px;
	text-align: center;
}

.agone-counter-value {
	font-size: 56px;
	line-height: 1;
	font-weight: 800;
	letter-spacing: -1.5px;
	background: linear-gradient(90deg, var(--counter-start), var(--counter-end));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.agone-star {
	width: 22px;
	height: 22px;
	margin-left: 6px;
	vertical-align: super;
	object-fit: contain;
}

.agone-counter-label {
	margin-top: 8px;
	color: var(--text-muted);
	font-size: 15px;
	line-height: 1.25;
}

@media (max-width: 900px) {
	.agone-landing {
		min-height: 100vh;
		padding-top: 64px;
		padding-bottom: 44px;
	}

	.agone-content-frame-1 {
		gap: 34px;
	}

	.agone-content-frame-2 {
		min-height: auto;
		gap: 22px;
	}

	.agone-logo-image {
		width: 250px;
		height: 52px;
	}

	.agone-waitlist {
		flex-direction: column;
	}

	.agone-waitlist-field,
	.agone-waitlist button {
		width: 100%;
	}

	.agone-counter-value {
		font-size: 46px;
	}
}

/* Toast Notification Styles */
.agone-toast-container {
	position: fixed;
	top: 20px;
	right: 20px;
	z-index: 9999;
	pointer-events: none;
}

.agone-toast {
	width: 337px;
	min-width: 300px;
	height: 73px;
	padding: 16px;
	border-radius: 8px;
	border: 1px solid var(--Border-Success-Lighter, #0CD46C);
	background: var(--Surface-Success-Lightest, #F4FFF8);
	display: flex;
	align-items: center;
	gap: 16px;
	box-shadow: 0 4px 12px rgba(13, 212, 108, 0.15);
	opacity: 0;
	transform: translateX(400px);
	transition: all 0.3s ease-in-out;
	pointer-events: auto;
	animation: toastSlideOut 0.3s ease-in-out forwards;
}

.agone-toast.agone-toast-show {
	opacity: 1;
	transform: translateX(0);
	animation: toastSlideIn 0.3s ease-in-out forwards;
}

.agone-toast.agone-toast-hide {
	opacity: 0;
	transform: translateX(400px);
	animation: toastSlideOut 0.3s ease-in-out forwards;
}

.agone-toast-success {
	--Border-Success-Lighter: #0CD46C;
	--Surface-Success-Lightest: #F4FFF8;
}

.agone-toast-icon {
	flex-shrink: 0;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--Border-Success-Lighter, #0CD46C);
	color: #ffffff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	font-size: 14px;
}

.agone-toast-content {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.agone-toast-title {
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	color: #1a3a1a;
	margin: 0;
}

.agone-toast-description {
	font-size: 12px;
	font-weight: 400;
	line-height: 1.3;
	color: #4a6a4a;
	margin: 0;
}

.agone-toast-close {
	flex-shrink: 0;
	width: 24px;
	height: 24px;
	border: none;
	background: transparent;
	color: var(--Border-Success-Lighter, #0CD46C);
	cursor: pointer;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: opacity 0.2s ease;
}

.agone-toast-close:hover {
	opacity: 0.7;
}

.agone-toast-close:active {
	opacity: 0.5;
}

@keyframes toastSlideIn {
	from {
		opacity: 0;
		transform: translateX(400px);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes toastSlideOut {
	from {
		opacity: 1;
		transform: translateX(0);
	}
	to {
		opacity: 0;
		transform: translateX(400px);
	}
}

@media (max-width: 600px) {
	.agone-toast-container {
		top: 16px;
		right: 16px;
		left: 16px;
	}

	.agone-toast {
		width: 100%;
		max-width: 100%;
		min-width: unset;
	}
}