#tw-onboarding-slider,
#tw-onboarding-slider * {
	box-sizing: border-box;
}

#tw-onboarding-slider {
	position: fixed;
	right: 0;
	bottom: 24px;
	z-index: 9999;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: flex-end;
	font-family: "Courier New", Consolas, monospace;
	color: #b7ffcb;
	text-shadow:
		0 0 4px rgba(120, 255, 180, 0.18),
		0 0 10px rgba(120, 255, 180, 0.05);
	pointer-events: none;
}

#tw-onboarding-slider .tw-onboarding-slider__toggle,
#tw-onboarding-slider .tw-onboarding-slider__panel {
	pointer-events: auto;
}

#tw-onboarding-slider .tw-onboarding-slider__toggle {
	display: inline-flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	align-self: flex-end;
	gap: 8px;
	margin-top: 8px;
	min-width: 120px;
	height: 44px;
	border: 1px solid rgba(126, 255, 178, 0.22);
	border-right: 0;
	border-radius: 14px 0 0 14px;
	background:
		linear-gradient(180deg, rgba(18, 30, 23, 0.98) 0%, rgba(5, 12, 9, 0.98) 100%);
	color: #98ffb6;
	padding: 10px 14px;
	cursor: pointer;
	font-size: 11px;
	line-height: 1;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	box-shadow:
		0 0 0 1px rgba(112, 255, 165, 0.05) inset,
		0 0 20px rgba(0, 0, 0, 0.35),
		0 0 14px rgba(38, 255, 136, 0.08);
	transition:
		color 180ms ease,
		background 180ms ease,
		box-shadow 180ms ease;
}

#tw-onboarding-slider .tw-onboarding-slider__toggle:hover,
#tw-onboarding-slider .tw-onboarding-slider__toggle:focus-visible {
	color: #d7ffe4;
}

#tw-onboarding-slider .tw-onboarding-slider__toggle-text {
	margin-bottom: 0;
}

#tw-onboarding-slider .tw-onboarding-slider__toggle-icon {
	font-size: 12px;
	opacity: 0.85;
	transform: rotate(0deg);
	transition: transform 180ms ease, opacity 180ms ease;
}

#tw-onboarding-slider .tw-onboarding-slider__panel {
	position: relative;
	width: 340px;
	max-width: calc(100vw - 56px);
	margin-bottom: 0;
	overflow: hidden;
	border: 1px solid rgba(126, 255, 178, 0.22);
	border-right: 0;
	border-radius: 16px 0 0 16px;
	padding: 18px 18px 16px;
	background:
		linear-gradient(180deg, rgba(10, 18, 13, 0.985) 0%, rgba(4, 10, 7, 0.985) 100%);
	box-shadow:
		0 0 0 1px rgba(112, 255, 165, 0.06) inset,
		0 0 28px rgba(0, 0, 0, 0.38),
		0 0 22px rgba(33, 255, 125, 0.06);
	transition:
		transform 180ms ease,
		opacity 180ms ease,
		visibility 180ms ease;
	isolation: isolate;
	transform: translateY(0);
	transform-origin: bottom right;
	opacity: 1;
	visibility: visible;
}

#tw-onboarding-slider.is-collapsed .tw-onboarding-slider__panel {
	transform: translateY(100%);
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
}

#tw-onboarding-slider.is-collapsed .tw-onboarding-slider__toggle-icon {
	transform: rotate(90deg);
	opacity: 1;
}

#tw-onboarding-slider .tw-onboarding-slider__scanline {
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background:
		repeating-linear-gradient(
			to bottom,
			rgba(170, 255, 196, 0.028) 0px,
			rgba(170, 255, 196, 0.028) 1px,
			transparent 2px,
			transparent 4px
		);
	mix-blend-mode: screen;
	opacity: 0.78;
}

#tw-onboarding-slider .tw-onboarding-slider__panel::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background:
		linear-gradient(
			to bottom,
			transparent 0%,
			rgba(126, 255, 178, 0.08) 48%,
			rgba(126, 255, 178, 0.16) 50%,
			rgba(126, 255, 178, 0.08) 52%,
			transparent 100%
		);
	transform: translateY(-110%);
	opacity: 0.7;
}

#tw-onboarding-slider .tw-onboarding-slider__panel::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 3;
	pointer-events: none;
	background:
		radial-gradient(circle at top center, rgba(95, 255, 161, 0.11), transparent 42%),
		radial-gradient(circle at center, rgba(95, 255, 161, 0.03), transparent 70%);
	opacity: 0.9;
}

#tw-onboarding-slider .tw-onboarding-slider__header,
#tw-onboarding-slider .tw-onboarding-slider__list {
	position: relative;
	z-index: 4;
}

#tw-onboarding-slider .tw-onboarding-slider__eyebrow {
	margin: 0 0 6px;
	font-size: 11px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #7dffab;
	opacity: 0.92;
}

#tw-onboarding-slider .tw-onboarding-slider__title {
	margin: 0 0 8px;
	font-size: 22px;
	line-height: 1.1;
	color: #e7ffee;
	font-weight: 700;
	text-shadow:
		0 0 6px rgba(126, 255, 178, 0.15),
		0 0 14px rgba(126, 255, 178, 0.05);
}

#tw-onboarding-slider .tw-onboarding-slider__desc {
	margin: 0 0 16px;
	max-width: 32ch;
	font-size: 13px;
	line-height: 1.55;
	color: rgba(197, 255, 216, 0.76);
}

#tw-onboarding-slider .tw-onboarding-slider__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 12px;
}

#tw-onboarding-slider .tw-onboarding-slider__item {
	position: relative;
	display: grid;
	grid-template-columns: 14px 1fr;
	gap: 12px;
	padding: 12px;
	border: 1px solid rgba(126, 255, 178, 0.14);
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.015);
	box-shadow: 0 0 0 1px rgba(126, 255, 178, 0.02) inset;
}

#tw-onboarding-slider .tw-onboarding-slider__status {
	width: 14px;
	height: 14px;
	margin-top: 4px;
	border: 1px solid rgba(126, 255, 178, 0.45);
	border-radius: 999px;
	background:
		radial-gradient(circle, rgba(126, 255, 178, 0.28) 0%, rgba(16, 47, 27, 0.95) 72%);
	box-shadow:
		0 0 8px rgba(126, 255, 178, 0.14),
		0 0 14px rgba(126, 255, 178, 0.05);
}

#tw-onboarding-slider .tw-onboarding-slider__item.is-done {
	border-color: rgba(126, 255, 178, 0.28);
	background:
		linear-gradient(180deg, rgba(18, 40, 26, 0.42) 0%, rgba(9, 22, 14, 0.42) 100%);
}

#tw-onboarding-slider .tw-onboarding-slider__item.is-done .tw-onboarding-slider__status {
	position: relative;
	background:
		radial-gradient(circle, #c9ffd8 0%, #7cffaa 32%, #1f8a4c 70%, #0f2819 100%);
	box-shadow:
		0 0 8px rgba(126, 255, 178, 0.25),
		0 0 14px rgba(126, 255, 178, 0.18),
		0 0 22px rgba(126, 255, 178, 0.08);
}

#tw-onboarding-slider .tw-onboarding-slider__item.is-done .tw-onboarding-slider__status::after {
	content: "✓";
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 10px;
	font-weight: 700;
	color: #07150c;
	text-shadow: none;
}

#tw-onboarding-slider .tw-onboarding-slider__body strong {
	display: block;
	margin: 0 0 4px;
	font-size: 15px;
	line-height: 1.3;
	color: #f0fff5;
}

#tw-onboarding-slider .tw-onboarding-slider__body p {
	margin: 0 0 8px;
	font-size: 13px;
	line-height: 1.5;
	color: rgba(204, 255, 221, 0.72);
}

#tw-onboarding-slider .tw-onboarding-slider__body a {
	color: #8effb8;
	text-decoration: none;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.03em;
}

#tw-onboarding-slider .tw-onboarding-slider__body a:hover,
#tw-onboarding-slider .tw-onboarding-slider__body a:focus {
	color: #e2ffee;
	text-decoration: underline;
}

#tw-onboarding-slider .tw-onboarding-slider__item.is-done .tw-onboarding-slider__body strong {
	position: relative;
	display: inline-block;
	color: rgba(220, 255, 231, 0.72);
	opacity: 0.82;
}

#tw-onboarding-slider .tw-onboarding-slider__item.is-done .tw-onboarding-slider__body strong::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 54%;
	height: 1px;
	background: linear-gradient(
		90deg,
		rgba(126, 255, 178, 0.05) 0%,
		rgba(126, 255, 178, 0.65) 18%,
		rgba(220, 255, 231, 0.9) 50%,
		rgba(126, 255, 178, 0.65) 82%,
		rgba(126, 255, 178, 0.05) 100%
	);
	box-shadow:
		0 0 4px rgba(126, 255, 178, 0.18),
		0 0 8px rgba(126, 255, 178, 0.08);
	pointer-events: none;
}

#tw-onboarding-slider .tw-onboarding-slider__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 12px;
	margin-top: 8px;
}

#tw-onboarding-slider .tw-onboarding-slider__actions a {
	color: #8effb8;
	text-decoration: none;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.03em;
}

#tw-onboarding-slider .tw-onboarding-slider__actions a:hover,
#tw-onboarding-slider .tw-onboarding-slider__actions a:focus {
	color: #e2ffee;
	text-decoration: underline;
}

/* CRT animation */
@media (prefers-reduced-motion: no-preference) {
	#tw-onboarding-slider .tw-onboarding-slider__panel {
		animation: tw-crt-flicker 0.18s infinite;
	}

	#tw-onboarding-slider .tw-onboarding-slider__panel::before {
		animation: tw-crt-refresh 8.5s linear infinite;
	}

	#tw-onboarding-slider .tw-onboarding-slider__scanline {
		animation: tw-crt-scanlines 7s linear infinite;
	}

	#tw-onboarding-slider .tw-onboarding-slider__item.is-done .tw-onboarding-slider__status {
		animation: tw-crt-pulse 2.4s ease-in-out infinite;
	}

	#tw-onboarding-slider .tw-onboarding-slider__title,
	#tw-onboarding-slider .tw-onboarding-slider__eyebrow {
		animation: tw-crt-text-glow 3.6s ease-in-out infinite;
	}
}

@keyframes tw-crt-flicker {
	0% { opacity: 0.985; }
	10% { opacity: 0.975; }
	20% { opacity: 0.988; }
	30% { opacity: 0.978; }
	40% { opacity: 0.992; }
	50% { opacity: 0.982; }
	60% { opacity: 0.989; }
	70% { opacity: 0.976; }
	80% { opacity: 0.994; }
	90% { opacity: 0.983; }
	100% { opacity: 0.987; }
}

@keyframes tw-crt-refresh {
	0% {
		transform: translateY(-110%);
		opacity: 0;
	}
	8% {
		opacity: 0.18;
	}
	12% {
		opacity: 0.55;
	}
	18% {
		opacity: 0.12;
	}
	100% {
		transform: translateY(120%);
		opacity: 0;
	}
}

@keyframes tw-crt-scanlines {
	0% {
		transform: translateY(0);
	}
	100% {
		transform: translateY(4px);
	}
}

@keyframes tw-crt-pulse {
	0%, 100% {
		box-shadow:
			0 0 8px rgba(126, 255, 178, 0.25),
			0 0 14px rgba(126, 255, 178, 0.18),
			0 0 22px rgba(126, 255, 178, 0.08);
		filter: brightness(1);
	}
	50% {
		box-shadow:
			0 0 10px rgba(126, 255, 178, 0.34),
			0 0 18px rgba(126, 255, 178, 0.22),
			0 0 28px rgba(126, 255, 178, 0.12);
		filter: brightness(1.08);
	}
}

@keyframes tw-crt-text-glow {
	0%, 100% {
		text-shadow:
			0 0 6px rgba(126, 255, 178, 0.14),
			0 0 14px rgba(126, 255, 178, 0.05);
	}
	50% {
		text-shadow:
			0 0 8px rgba(126, 255, 178, 0.2),
			0 0 18px rgba(126, 255, 178, 0.08);
	}
}

@media (prefers-reduced-motion: reduce) {
	#tw-onboarding-slider .tw-onboarding-slider__panel,
	#tw-onboarding-slider .tw-onboarding-slider__panel::before,
	#tw-onboarding-slider .tw-onboarding-slider__scanline,
	#tw-onboarding-slider .tw-onboarding-slider__item.is-done .tw-onboarding-slider__status,
	#tw-onboarding-slider .tw-onboarding-slider__title,
	#tw-onboarding-slider .tw-onboarding-slider__eyebrow {
		animation: none !important;
	}
}

@media (max-width: 640px) {
	#tw-onboarding-slider {
		bottom: 16px;
	}

	#tw-onboarding-slider .tw-onboarding-slider__panel {
		width: min(300px, calc(100vw - 52px));
		padding: 16px;
	}

#tw-onboarding-slider .tw-onboarding-slider__toggle {
	min-width: 108px;
	height: 40px;
	padding: 8px 12px;
}

	#tw-onboarding-slider .tw-onboarding-slider__title {
		font-size: 19px;
	}
}
#tw-onboarding-slider.is-dismissed {
	display: none !important;
}

#tw-onboarding-slider .tw-onboarding-slider__dismiss {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 6;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border: 1px solid rgba(126, 255, 178, 0.18);
	border-radius: 999px;
	background: rgba(6, 16, 10, 0.72);
	color: #9fffbf;
	cursor: pointer;
	font-size: 16px;
	line-height: 1;
	box-shadow:
		0 0 0 1px rgba(126, 255, 178, 0.03) inset,
		0 0 8px rgba(0, 0, 0, 0.18);
	transition:
		color 180ms ease,
		border-color 180ms ease,
		background 180ms ease,
		transform 180ms ease;
}

#tw-onboarding-slider .tw-onboarding-slider__dismiss:hover,
#tw-onboarding-slider .tw-onboarding-slider__dismiss:focus-visible {
	color: #e7ffee;
	border-color: rgba(126, 255, 178, 0.38);
	background: rgba(10, 24, 16, 0.92);
	transform: scale(1.04);
}