.header {
		position: fixed;
		left: 0;
		right: 0;
		top: 0;
		display: flex;
		align-items: center;
		color: white;
		z-index: 99999;
		font-size: 20px;
		font-family: System-ui;
		box-sizing: border-box;
		padding: 15px 30px;
		background: rgba(26, 26, 26, 0.4);
		backdrop-filter: blur(20px) saturate(180%);
		-webkit-backdrop-filter: blur(20px) saturate(180%);
		border-bottom: 1px solid rgba(255, 255, 255, 0.1);
		box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
		transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	}
	
	.header.scrolled {
		background: rgba(26, 26, 26, 0.7);
		padding: 10px 30px;
	}
	
	.header-logo {
		height: 40px;
		width: auto;
		filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0.3));
		position: absolute;
		left: 0;
		opacity: 0;
		pointer-events: none;
		transition: opacity 0.3s ease;
	}
	
	.header-logo.visible {
		opacity: 1;
		pointer-events: auto;
	}
	
	#main {
    margin-right: 8rem;
		display: flex;
		align-items: center;
		padding: 0;
		font-weight: bold;
		flex: 1 1 auto;
		transition: all 0.3s ease;
		position: relative;
	}
	
	#header-text {
		transition: opacity 0.3s ease;
		opacity: 1;
	}
	
	#header-text.hidden {
		opacity: 0;
		pointer-events: none;
	}
	
	#main-buttons {
		display: flex;
		flex: 0 0 auto;
	}
	
	.header-button {
		padding: 10px 15px;
		border-left: 2px solid transparent;
		cursor: pointer;
		transition: all 0.3s ease;
		font-size: 17px;
		border-radius: 8px;
		position: relative;
		overflow: hidden;
	}
	
	.header-button::before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(255, 255, 255, 0.1);
		opacity: 0;
		transition: opacity 0.3s ease;
		border-radius: 8px;
	}
	
	.header-button:hover::before {
		opacity: 1;
	}
	
	.dropdown-content {
		display: flex;
	}
	
	@media (orientation: portrait) {
		.header {
			padding: 8px 15px;
			border-radius: 0 !important;
			top: 0 !important;
			border-left: none !important;
			border-right: none !important;
			background: transparent;
			backdrop-filter: none;
			-webkit-backdrop-filter: none;
			border-bottom: none;
			box-shadow: none;
		}
		
		.header.scrolled {
			padding: 6px 15px;
			background: rgba(26, 26, 26, 0.7);
			backdrop-filter: blur(20px) saturate(180%);
			-webkit-backdrop-filter: blur(20px) saturate(180%);
			border-bottom: 1px solid rgba(255, 255, 255, 0.1);
			box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
		}
		
		.header-logo {
			height: 30px;
		}
		
		.dropdown-content {
			display: none;
			opacity: 0;
			transition: opacity 0.3s ease;
			flex-direction: column;
			position: absolute;
			right: 0;
			top: 40px;
			margin-top: 40px;
			background: rgba(26, 26, 26, 0.95);
			backdrop-filter: blur(20px) saturate(180%);
			-webkit-backdrop-filter: blur(20px) saturate(180%);
			min-width: 160px;
			box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
			border: 1px solid rgba(255, 255, 255, 0.1);
			z-index: 1;
			border-radius: 15px;
			font-size: 20px;
			width: 50vw;
			max-width: 300px;
		}

		.dropdown-content .header-button {
			display: block;
			text-align: left;
			font-size: 20px;
		}

		.dropdown-toggle {
			display: block;
			border-left: 2px solid white;
			font-size: 25px;
		}

		.dropdown-content.show {
			display: flex;
		}

		.header-button:hover {
			color: orange;
		}
	}
	
	@media (orientation: landscape) {
		.header {
			margin: 0 auto;
			width: fit-content;
			border-radius: 0 0 25px 25px;
			border-bottom: 1px solid rgba(255, 255, 255, 0.15);
			border-left: none;
			border-right: none;
			padding: 12px 30px;
		}
		
		.header.scrolled {
			padding: 8px 25px;
			border-radius: 20px;
			border-left: 1px solid rgba(255, 255, 255, 0.1);
			border-right: 1px solid rgba(255, 255, 255, 0.1);
			top: 10px;
		}
		
		.header.detached {
			border-radius: 25px;
			border-left: 1px solid rgba(255, 255, 255, 0.1);
			border-right: 1px solid rgba(255, 255, 255, 0.1);
			top: 10px;
		}
		
		.dropdown-toggle {
			display: none !important;
		}

		.header-button:hover {
			color: orange;
			transform: translateY(-2px);
			background: rgba(255, 255, 255, 0.05);
		}
		
		.header-button.here {
			background: linear-gradient(135deg, rgba(255, 165, 0, 0.2), rgba(255, 140, 0, 0.15));
			color: orange;
			box-shadow: 0 0 15px rgba(255, 165, 0, 0.3);
		}
	}