* {
        	margin: 0;
        	padding: 0;
        	box-sizing: border-box;
        }

        body {
        	font-family: 'Courier New', monospace;
        	background-color: #2c2c2c;
        	color: #f0f0f0;
        	line-height: 1.6;
        	image-rendering: pixelated;
        	image-rendering: -moz-crisp-edges;
        	image-rendering: crisp-edges;
        }

        .pixel-btn,
        .pixel-nav a {
        	image-rendering: pixelated;
        	image-rendering: -moz-crisp-edges;
        	image-rendering: crisp-edges;
        	transition: all 0.1s;
        }

        .pixel-btn:hover,
        .pixel-nav a:hover {
        	transform: scale(1.05);
        }

        header {
        	/* max-width: 1200px; */
        	background-color: #1a1a1a;
        	padding: 0;
        	position: sticky;
        	top: 0;
        	z-index: 1000;
        	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
        }

        .header-content {
        	max-width: 1200px;
        	margin: 0 auto;
        	display: flex;
        	justify-content: space-between;
        	align-items: center;
        	padding: 15px 20px;
        	width: 100%;
        	flex-wrap: nowrap;
        	min-width: 0;
        	border-bottom: 4px solid #00ff00;
        }

        .logo-container {
        	display: flex;
        	align-items: center;
        	gap: 15px;
        	flex-shrink: 0;
        }

        .logo-container a {
        	display: inline-block;
        	line-height: 0;
        	text-decoration: none;
        	color: inherit;
        	transition: none !important;
        	-webkit-tap-highlight-color: transparent;
        	outline: none;
        }

        .logo-container a:active {
        	transform: none !important;
        	opacity: 1 !important;
        	background: none !important;
        }

        .logo-container a:focus {
        	outline: none;
        }

        .logo {
        	width: 64px;
        	height: 64px;
        	image-rendering: pixelated;
        }

        .site-title {
        	font-size: 28px;
        	font-weight: bold;
        	color: #00ff00;
        	text-shadow: 3px 3px 0 #000;
        	letter-spacing: 1px;
        }

        .pixel-nav {
        	display: flex;
        	gap: 15px;
        	flex-wrap: nowrap;
        	min-width: 0;
        }

        .pixel-nav a {
        	color: #f0f0f0;
        	text-decoration: none;
        	font-size: 14px;
        	font-weight: bold;
        	padding: 6px 10px;
        	background-color: #333;
        	border: 2px solid #555;
        	border-radius: 4px;
        	text-transform: uppercase;
        	letter-spacing: 0.5px;
        	white-space: nowrap;
        	transition: all 0.2s ease;
        }

        .pixel-nav a:hover {
        	background-color: #00ff00;
        	color: #000;
        	border-color: #00cc00;
        }

        .menu-toggle {
        	display: none;
        	background-color: #333;
        	border: 2px solid #555;
        	color: #f0f0f0;
        	padding: 10px 15px;
        	font-size: 18px;
        	cursor: pointer;
        	border-radius: 4px;
        }

        main {
        	min-height: calc(100vh - 140px);
        	padding: 20px;
        	background-color: #222;
        	background-image:
        		linear-gradient(45deg, #1a1a1a 25%, transparent 25%),
        		linear-gradient(-45deg, #1a1a1a 25%, transparent 25%),
        		linear-gradient(45deg, transparent 75%, #1a1a1a 75%),
        		linear-gradient(-45deg, transparent 75%, #1a1a1a 75%);
        	background-size: 20px 20px;
        	background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
        	max-width: 1200px;
        	margin: 0 auto;
        }

        .download-section {
        	background-color: #1a1a1a;
        	border-radius: 8px;
        	padding: 30px;
        	margin: 20px 0;
        	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
        }

        .download-container {
        	display: grid;
        	grid-template-columns: 1fr 2fr;
        	gap: 40px;
        	align-items: center;
        }

        .download-info {
        	text-align: center;
        }

        .app-title {
        	color: #00ff00;
        	font-size: 36px;
        	margin-bottom: 15px;
        	text-shadow: 3px 3px 0 #000;
        	text-transform: uppercase;
        	letter-spacing: 2px;
        }

        .app-description {
        	color: #ccc;
        	font-size: 18px;
        	margin-bottom: 30px;
        	line-height: 1.5;
        }

        .download-btn {
        	display: inline-block;
        	background-color: #00ff00;
        	color: #000;
        	font-size: 20px;
        	font-weight: bold;
        	padding: 15px 40px;
        	text-decoration: none;
        	border-radius: 6px;
        	text-transform: uppercase;
        	letter-spacing: 1px;
        	transition: all 0.2s;
        }

        .download-btn:hover {
        	background-color: #00cc00;
        	transform: scale(1.05);
        	box-shadow: 0 4px 8px rgba(0, 255, 0, 0.3);
        }

        .app-intro {
        	padding: 20px;
        	background-color: #2a2a2a;
        	border: 2px solid #444;
        	border-radius: 6px;
        }

        .intro-title {
        	color: #00ff00;
        	font-size: 24px;
        	margin-bottom: 20px;
        	text-shadow: 2px 2px 0 #000;
        	text-transform: uppercase;
        	letter-spacing: 1px;
        }

        .intro-content {
        	color: #f0f0f0;
        	font-size: 16px;
        	line-height: 1.6;
        	margin-bottom: 15px;
        }

        .intro-content p {
        	margin: 0 0 15px 0;
        	line-height: 1.6;
        }

        .intro-content p:last-child {
        	margin-bottom: 0;
        }

        .intro-content:last-child {
        	margin-bottom: 0;
        }

        .screenshots-section {
        	background-color: #1a1a1a;
        	border-radius: 8px;
        	padding: 30px;
        	margin: 30px 0;
        	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
        }

        .section-title {
        	color: #00ff00;
        	font-size: 32px;
        	text-align: center;
        	margin-bottom: 30px;
        	text-shadow: 3px 3px 0 #000;
        	text-transform: uppercase;
        	letter-spacing: 2px;
        }

        .screenshots-desktop {
        	display: flex;
        	gap: 20px;
        	overflow-x: auto;
        	overflow-y: hidden;
        	scroll-snap-type: x mandatory;
        	-webkit-overflow-scrolling: touch;
        	padding: 20px 10px;
        	scrollbar-width: thin;
        	scrollbar-color: #00ff00 #333;
        }

        .screenshots-desktop::-webkit-scrollbar {
        	height: 8px;
        }

        .screenshots-desktop::-webkit-scrollbar-track {
        	background: #333;
        	border-radius: 4px;
        }

        .screenshots-desktop::-webkit-scrollbar-thumb {
        	background: #00ff00;
        	border-radius: 4px;
        }

        .screenshots-desktop::-webkit-scrollbar-thumb:hover {
        	background: #00cc00;
        }

        .screenshot-item {
        	flex: 0 0 auto;
        	scroll-snap-align: center;
        	text-align: center;
        }

        .screenshot-img {
        	width: 250px;
        	height: 450px;
        	object-fit: contain;
        	border-radius: 8px;
        	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
        	transition: transform 0.3s ease;
        }

        .screenshot-img:hover {
        	transform: scale(1.05);
        }

        .faq-section {
        	background-color: #1a1a1a;
        	border-radius: 8px;
        	padding: 30px;
        	margin: 30px 0;
        	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
        }

        .faq-container {
        	display: flex;
        	flex-direction: column;
        	gap: 15px;
        }

        .faq-item {
        	border: 2px solid #444;
        	border-radius: 6px;
        	overflow: hidden;
        	background-color: #2a2a2a;
        }

        .faq-question {
        	display: flex;
        	align-items: center;
        	padding: 15px 20px;
        	cursor: pointer;
        	background-color: #333;
        	transition: background-color 0.2s;
        	user-select: none;
        }

        .faq-question:hover {
        	background-color: #3a3a3a;
        }

        .faq-icon {
        	font-size: 20px;
        	font-weight: bold;
        	color: #00ff00;
        	margin-right: 15px;
        	width: 20px;
        	text-align: center;
        	transition: transform 0.3s ease;
        }

        .faq-question.active .faq-icon {
        	transform: rotate(45deg);
        }

        .faq-question h3 {
        	color: #f0f0f0;
        	font-size: 18px;
        	margin: 0;
        	flex: 1;
        }

        .faq-answer {
        	max-height: 0;
        	overflow: hidden;
        	transition: max-height 0.3s ease, padding 0.3s ease;
        	background-color: #2a2a2a;
        }

        .faq-answer.active {
        	max-height: 500px;
        	padding: 20px;
        }

        .faq-answer p {
        	color: #ccc;
        	line-height: 1.6;
        	margin: 0;
        }

        .comments-section {
        	background-color: #1a1a1a;
        	border-radius: 8px;
        	padding: 20px;
        	margin: 20px 0;
        	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
        }

        .comment-form-container {
        	background-color: #2a2a2a;
        	border: 2px solid #444;
        	border-radius: 6px;
        	padding: 25px;
        	margin-bottom: 30px;
        }

        .form-title {
        	color: #00ff00;
        	font-size: 24px;
        	margin-bottom: 20px;
        	text-shadow: 2px 2px 0 #000;
        }

        .form-group {
        	margin-bottom: 20px;
        }

        .form-group label {
        	display: block;
        	color: #f0f0f0;
        	font-size: 16px;
        	margin-bottom: 8px;
        	font-weight: bold;
        }

        .form-group input[type="text"],
        .form-group textarea {
        	width: 100%;
        	padding: 12px;
        	background-color: #333;
        	border: 2px solid #555;
        	border-radius: 4px;
        	color: #f0f0f0;
        	font-size: 16px;
        	font-family: 'Courier New', monospace;
        }

        .form-group input[type="text"]:focus,
        .form-group textarea:focus {
        	outline: none;
        	border-color: #00ff00;
        	box-shadow: 0 0 5px rgba(0, 255, 0, 0.3);
        }

        .form-group textarea {
        	resize: vertical;
        	min-height: 100px;
        }

        .rating {
        	display: inline-flex;
        	gap: 5px;
        }

        .star {
        	font-size: 28px;
        	color: #666;
        	cursor: pointer;
        	transition: color 0.2s;
        	user-select: none;
        }

        .star:hover,
        .star.active {
        	color: #ffcc00;
        }

        .submit-btn {
        	background-color: #00ff00;
        	color: #000;
        	font-size: 18px;
        	font-weight: bold;
        	padding: 12px 30px;
        	border-radius: 6px;
        	cursor: pointer;
        	text-transform: uppercase;
        	letter-spacing: 1px;
        	transition: all 0.2s;
        }

        .submit-btn:hover {
        	background-color: #00cc00;
        	transform: scale(1.05);
        	box-shadow: 0 4px 8px rgba(0, 255, 0, 0.3);
        }

        .comments-list {
        	display: flex;
        	flex-direction: column;
        	gap: 20px;
        }

        .comment-item {
        	background-color: #2a2a2a;
        	border: 2px solid #444;
        	border-radius: 6px;
        	padding: 20px;
        	transition: transform 0.2s, box-shadow 0.2s;
        }

        .comment-item:hover {
        	transform: translateY(-2px);
        	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
        }

        .comment-header {
        	display: flex;
        	justify-content: space-between;
        	align-items: center;
        	margin-bottom: 15px;
        }

        .user-info {
        	display: flex;
        	align-items: center;
        	gap: 15px;
        }

        .username {
        	color: #00ff00;
        	font-size: 18px;
        	font-weight: bold;
        }

        .user-rating {
        	font-size: 16px;
        }

        .filled-star {
        	color: #ffcc00;
        }

        .empty-star {
        	color: #666;
        }

        .comment-date {
        	color: #888;
        	font-size: 14px;
        }

        .comment-content p {
        	color: #f0f0f0;
        	line-height: 1.6;
        	margin: 0;
        }

        footer {
        	background-color: #1a1a1a;
        	border-top: 4px solid #00ff00;
        	text-align: center;
        	padding: 10px;
        	font-size: 14px;
        	color: #888;
        	max-width: 1200px;
        	margin: 0 auto;
        }

        .disclaimer {
        	color: #ffcc00;
        	font-size: 12px;
        	margin-bottom: 10px;
        	/* font-style: italic; */
        }

        .copyright {
        	font-weight: bold;
        }

		.map {
			margin-bottom: 10px;
		}

        .map a {
        	margin-bottom: 10px;
        	text-decoration: none;
			color: #27ae60;
        }

        @media (max-width: 1024px) {
        	main {
        		max-width: 95%;
        	}

        	.header-content {
        		max-width: 95%;
        	}

        	.pixel-nav {
        		gap: 10px;
        	}

        	.pixel-nav a {
        		font-size: 15px;
        		padding: 5px 8px;
        	}

        	.logo {
        		width: 56px;
        		height: 56px;
        	}
        }

        @media (max-width: 900px) {
        	.pixel-nav {
        		gap: 8px;
        	}

        	.pixel-nav a {
        		font-size: 15px;
        		padding: 4px 6px;
        	}

        	.logo {
        		width: 48px;
        		height: 48px;
        	}
        }

        @media (max-width: 850px) {
        	.pixel-nav {
        		gap: 6px;
        	}

        	.pixel-nav a {
        		font-size: 15px;
        		padding: 3px 5px;
        	}

        	.logo {
        		width: 44px;
        		height: 44px;
        	}
        }

        @media (max-width: 780px) {
        	.pixel-nav {
        		gap: 5px;
        	}

        	.pixel-nav a {
        		font-size: 15px;
        		padding: 2px 4px;
        	}

        	.logo {
        		width: 40px;
        		height: 40px;
        	}
        }

        @media (max-width: 992px) {
        	.download-container {
        		grid-template-columns: 1fr;
        		gap: 30px;
        	}

        	.download-info {
        		order: 2;
        	}

        	.app-intro {
        		order: 1;
        	}

        	.screenshots-desktop {
        		display: flex;
        		gap: 15px;
        		padding: 15px 5px;
        	}

        	.screenshot-item {
        		flex: 0 0 auto;
        	}

        	.screenshot-img {
        		width: 200px;
        		height: 360px;
        	}
        }

        @media (max-width: 768px) {
        	.menu-toggle {
        		display: block;
        	}

        	.pixel-nav {
        		position: fixed;
        		top: 84px;
        		right: -100%;
        		width: 50%;
        		max-width: 250px;
        		height: auto;
        		max-height: 60vh;
        		background-color: #1a1a1a;
        		flex-direction: column;
        		align-items: center;
        		justify-content: flex-start;
        		gap: 10px;
        		padding: 15px 0;
        		transition: right 0.3s ease;
        		border-left: 3px solid #00ff00;
        		border-bottom: 3px solid #00ff00;
        		box-shadow: -3px 3px 10px rgba(0, 0, 0, 0.5);
        		border-bottom-left-radius: 8px;
        	}

        	.pixel-nav.active {
        		right: 0;
        	}

        	.pixel-nav a {
        		width: 85%;
        		text-align: center;
        		font-size: 16px;
        		padding: 12px 10px;
        	}

        	main {
        		max-width: 95%;
        	}

        	.header-content {
        		max-width: 95%;
        	}

        	.download-section {
        		padding: 20px;
        		/* margin: 15px 0; */
        	}

        	.app-title {
        		font-size: 28px;
        	}

        	.app-description {
        		font-size: 16px;
        		margin-bottom: 20px;
        	}

        	.download-btn {
        		font-size: 18px;
        		padding: 12px 30px;
        	}

        	.intro-title {
        		font-size: 20px;
        	}

        	.intro-content {
        		font-size: 14px;
        	}

        	.section-title {
        		font-size: 28px;
        		margin-bottom: 20px;
        	}

        	.screenshots-section {
        		padding: 20px;
        		margin: 20px 0;
        	}

        	.faq-section {
        		padding: 20px;
        		margin: 20px 0;
        	}

        	.faq-question h3 {
        		font-size: 16px;
        	}

        	.faq-answer p {
        		font-size: 14px;
        	}

        	.comment-form-container {
        		padding: 20px;
        		margin-bottom: 20px;
        	}

        	.form-title {
        		font-size: 20px;
        	}

        	.comment-item {
        		padding: 15px;
        	}

        	.username {
        		font-size: 16px;
        	}

        	.star {
        		font-size: 24px;
        	}

        	.logo {
        		width: 48px;
        		height: 48px;
        	}
        }

        @media (max-width: 480px) {
        	header {
        		padding: 10px;
        	}

        	.logo-container {
        		gap: 10px;
        	}

        	.site-title {
        		font-size: 20px;
        	}

        	.logo {
        		width: 40px;
        		height: 40px;
        	}

        	.menu-toggle {
        		padding: 8px 12px;
        		font-size: 16px;
        	}

        	.pixel-nav {
        		top: 68px;
        		max-height: 65vh;
        	}

        	.screenshots-desktop {
        		gap: 10px;
        		padding: 10px 5px;
        	}

        	.screenshot-img {
        		width: 250px;
        		height: 450px;
        	}
        }

        .version-list {
        	display: grid;
        	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
        	gap: 20px;
        	padding: 20px;
        	max-width: 1200px;
        	margin: 0 auto;
        }

        .version {
        	background-color: #2a2a2a;
        	border: 2px solid #444;
        	border-radius: 8px;
        	padding: 20px;
        	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
        	transition: transform 0.3s ease, box-shadow 0.3s ease;
        }

        .version:hover {
        	transform: translateY(-5px);
        	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.4);
        }

        .version-header {
        	display: flex;
        	justify-content: space-between;
        	align-items: center;
        	margin-bottom: 15px;
        	padding-bottom: 10px;
        	border-bottom: 2px solid #444;
        }

        .app-name {
        	font-size: 18px;
        	font-weight: bold;
        	color: #00ff00;
        	text-align: center;
        	margin: 0 0 15px 0;
        }

        .version a {
        	display: inline-block;
        	text-decoration: none;
        	color: inherit;
        	transition: none !important;
        	-webkit-tap-highlight-color: transparent;
        	outline: none;
        }

        .version a:active {
        	transform: none !important;
        	opacity: 1 !important;
        	background: none !important;
        }

        .version a:focus {
        	outline: none;
        }

        .version-number {
        	font-size: 16px;
        	font-weight: bold;
        	color: #f0f0f0;
        	background-color: #333;
        	padding: 4px 8px;
        	border-radius: 4px;
        }

        .version-info {
        	margin-bottom: 15px;
        }

        .version-info p {
        	margin-bottom: 8px;
        	color: #ccc;
        	font-size: 14px;
        }

        .version-info .label {
        	font-weight: bold;
        	color: #00ff00;
        	margin-right: 5px;
        }

        .version .download-btn {
        	display: block;
        	width: 100%;
        	padding: 12px;
        	background-color: #66cc99;
        	color: #000;
        	text-align: center;
        	text-decoration: none;
        	border-radius: 6px;
        	font-size: 16px;
        	font-weight: bold;
        	transition: background-color 0.3s ease;
        	border: none;
        	cursor: pointer;
        }

        .version .download-btn:hover {
        	background-color: #4db380;
        }

        .version .download-btn:active {
        	transform: scale(0.98);
        }

        .version-badge {
        	display: inline-block;
        	padding: 2px 6px;
        	border-radius: 10px;
        	font-size: 12px;
        	font-weight: bold;
        	margin-left: 8px;
        }

        .latest {
        	background-color: #e74c3c;
        	color: white;
        }

        .beta {
        	background-color: #f39c12;
        	color: white;
        }

        .stable {
        	background-color: #27ae60;
        	color: white;
        }

        @media (max-width: 768px) {
        	.version-list {
        		grid-template-columns: 1fr;
        		gap: 15px;
        		padding: 15px;
        	}

        	.version {
        		padding: 15px;
        	}

        	.app-name {
        		font-size: 16px;
        	}

        	.version-number {
        		font-size: 14px;
        	}
        }