#qrCodeWidget {
		
		display: none;
		}
		
		@media (min-width: 1152px) {
		#qrCodeWidget:not(.hidden) {
		display: block;
		}
		}
		
		
		#qrCodeImage {
		transition: opacity 0.3s ease;
		}
		
		#qrCodeImage:not([src]), #qrCodeImage[src=""] {
		opacity: 0.5;
		background: linear-gradient(45deg, #f0f0f0 25%, transparent 25%), 
		linear-gradient(-45deg, #f0f0f0 25%, transparent 25%), 
		linear-gradient(45deg, transparent 75%, #f0f0f0 75%), 
		linear-gradient(-45deg, transparent 75%, #f0f0f0 75%);
		background-size: 8px 8px;
		background-position: 0 0, 0 4px, 4px -4px, -4px 0px;
		}

	#searchForm {
		position: relative;
	}
	#searchBtn {
		min-width: 32px; 
		min-height: 32px;
		cursor: pointer;
		user-select: none;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
	}
	#searchBtn:disabled {
		opacity: 0.6;
		cursor: not-allowed;
	}
	#searchBtn:focus {
		outline: 2px solid #3b82f6;
		outline-offset: 2px;
	}
	#searchInput:invalid {
		
	}
		
	#searchForm.submitting #searchBtn {
		animation: pulse 0.5s ease-in-out;
	}
	@keyframes pulse {
		0%, 100% { transform: scale(1); }
		50% { transform: scale(0.95); }
	}
		
	@media (prefers-contrast: high) {
		#searchBtn {
		border: 1px solid currentColor;
		}
		
		#searchInput {
		border-width: 2px;
		}
	}
		
	@media (prefers-reduced-motion: reduce) {
		#searchBtn {
		transition: none;
		}
	}