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

	  body {
		  font-family: Arial, sans-serif;
		  background-color: #f0f0f0;
		  overflow: hidden;
		  -webkit-overflow-scrolling: touch;
		  overflow-y: auto;
		  overflow-x: hidden;
	  }

	  .background-container {
		  position: fixed;
		  top: 0;
		  left: 0;
		  width: 100%;
		  height: 100vh;
		  overflow: hidden;
		  z-index: 1;
		  opacity: 0.85 !important;
		  transition: opacity 0.3s ease;
		  will-change: transform;
		  -webkit-backface-visibility: hidden;
		  backface-visibility: hidden;
	  }

	  .scroll-container {
		  position: absolute;
		  top: 0;
		  left: 0;
		  width: 100vw;
		  animation: slideUp 15s linear infinite;
		  display: flex;
		  flex-wrap: wrap;
		  will-change: transform;
		  -webkit-backface-visibility: hidden;
		  backface-visibility: hidden;
	  }

	  .scroll-container.animate {
		  transition: transform 0s;
	  }

	  @keyframes slideUp {
		  0% {
			  transform: translate3d(0, 0, 0);
		  }
		  100% {
			  transform: translate3d(0, -33.333%, 0);
		  }
	  }

	  .img-wrapper {
		  width: 33.333vw;
		  height: 33.333vw;
		  position: relative;
		  will-change: transform;
		  -webkit-backface-visibility: hidden;
		  backface-visibility: hidden;
	  }

	  .img-wrapper, .img-wrapper img {
		  border-radius: 0;
	  }

	  .img-wrapper img {
		  width: 100%;
		  height: 100%;
		  object-fit: cover;
		  -webkit-backface-visibility: hidden;
		  backface-visibility: hidden;
	  }

	  .content {
		  position: relative;
		  z-index: 2;
		  padding: 20px;
		  padding-top: 40px;
		  display: flex;
		  flex-direction: column;
		  align-items: center;
		  min-height: 100vh;
		  background: rgba(0, 0, 0, 0.5);
	  }

	  .price {
		  width: 90%;
		  max-width: 300px;
		  margin: 10px auto;
		  height: auto;
		  display: flex;
		  justify-content: center;
		  align-items: center;
	  }

	  .price img {
		  width: 100%;
		  height: auto;
		  object-fit: contain;
	  }

	  .card-container {
		  width: 100%;
		  max-width: 400px;
		  margin: 20px auto;
		  position: relative;
	  }

	  .card {
		  display: flex;
		  background: rgba(255, 255, 255, 0.1);
		  backdrop-filter: blur(10px);
		  border-radius: 20px;
		  height: 220px;
		  border: 1px solid rgba(255, 255, 255, 0.1);
		  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
		  overflow: hidden;
		  padding: 12px;
		  margin: 10px;
		  transform: translate3d(0, 0, 0);
		  cursor: pointer;
		  position: relative;
		  animation: hintSwipe 2s ease-in-out infinite;
	  }

	  .card-left {
		  width: 130px;
		  height: 100%;
		  position: relative;
	  }

	  .card-image {
		  width: 100%;
		  height: 100%;
	  }

	  .card-image img {
		  width: 100%;
		  height: 100%;
		  object-fit: cover;
	  }

	  .card-right {
		  flex: 1;
		  padding: 10px;
		  display: flex;
		  flex-direction: column;
		  justify-content: space-between;
	  }

	  .info-grid {
		  display: grid;
		  grid-template-columns: repeat(2, 1fr);
		  gap: 8px;
		  margin-bottom: 15px;
	  }

	  .info-item {
		  display: flex;
		  flex-direction: column;
		  align-items: center;
		  padding: 10px;
		  background: rgba(0, 0, 0, 0.4);
		  border-radius: 12px;
		  border: 1px solid rgba(255, 255, 255, 0.2);
		  backdrop-filter: blur(8px);
	  }

	  .info-label {
		  font-size: 13px;
		  color: rgba(255, 255, 255, 0.85);
		  margin-bottom: 5px;
		  font-weight: 500;
	  }

	  .info-value {
		  font-size: 16px;
		  color: #FFFFFF !important;
		  font-weight: bold;
		  letter-spacing: 0.5px;
		  text-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
	  }

	  .info-item:hover {
		  background: rgba(0, 0, 0, 0.5);
		  transform: translateY(-1px);
		  transition: all 0.3s ease;
	  }

	  .meet-btn {
		  margin-top: 0;
		  margin-bottom: 15px;
		  height: 38px;
		  background: linear-gradient(135deg, #FF6B6B 0%, #FF3B7F 100%);
		  color: white;
		  border: none;
		  border-radius: 12px;
		  font-size: 15px;
		  font-weight: bold;
		  box-shadow: 0 4px 15px rgba(255, 59, 127, 0.4);
		  transition: transform 0.3s, box-shadow 0.3s;
	  }

	  .meet-btn:hover {
		  box-shadow: 0 6px 20px rgba(255, 59, 127, 0.6);
		  transform: translateY(-2px);
	  }

	  .logo {
		  width: 100px;
		  height: 100px;
		  margin: 0 0 15px 0;
	  }

	  .logo img {
		  width: 100%;
		  height: 100%;
		  object-fit: contain;
	  }

	  .ad-text {
		  margin-top: 30px;
		  display: flex;
		  gap: 15px;
		  justify-content: center;
		  flex-wrap: wrap;
	  }

	  .ad-item {
		  color: white;
		  font-size: 16px;
		  font-weight: bold;
		  padding: 8px 20px;
		  background: rgba(255, 255, 255, 0.1);
		  border-radius: 20px;
		  backdrop-filter: blur(5px);
		  border: 1px solid rgba(255, 255, 255, 0.2);
		  text-shadow: 0 2px 4px rgba(0,0,0,0.3);
		  animation: glow 2s infinite;
	  }

	  @keyframes glow {
		  0%, 100% { box-shadow: 0 0 5px rgba(255,255,255,0.3); }
		  50% { box-shadow: 0 0 15px rgba(255,255,255,0.5); }
	  }

	  .messenger-list {
		  display: flex;
		  flex-direction: column;
		  gap: 15px;
		  margin-top: 40px;
		  width: 90%;
		  max-width: 300px;
		  align-items: center;
	  }

	  .messenger-btn {
		  width: 250px;
		  padding: 12px 30px;
		  font-size: 16px;
		  font-weight: bold;
		  color: white;
		  border: none;
		  border-radius: 25px;
		  cursor: pointer;
		  transition: transform 0.3s, box-shadow 0.3s;
		  text-align: center;
		  text-decoration: none;
		  display: flex;
		  justify-content: center;
		  align-items: center;
	  }

	  .messenger-btn.facebook {
		  background: linear-gradient(135deg, #00B2FF 0%, #006AFF 100%);
		  box-shadow: 0 4px 15px rgba(0, 106, 255, 0.4);
	  }

	  .messenger-btn.facebook:hover {
		  box-shadow: 0 6px 20px rgba(0, 106, 255, 0.6);
		  transform: translateY(-2px);
	  }

	  .messenger-btn.line {
		  background: #06C755;
		  box-shadow: 0 4px 15px rgba(6, 199, 85, 0.4);
	  }

	  .messenger-btn.line:hover {
		  box-shadow: 0 6px 20px rgba(6, 199, 85, 0.6);
		  transform: translateY(-2px);
	  }

	  .price-text {
		  margin: 30px 0;
		  text-align: center;
		  font-size: 16px;
		  color: #fdfbfc;
		  font-weight: bold;
					  text-shadow: 0 0 10px rgba(255, 59, 127, 0.5);
		  animation: textGlow 1.5s ease-in-out infinite alternate;
				  }

	  @keyframes slideNext {
		  0% {
			  transform: translateX(0) scale(1);
			  opacity: 1;
		  }
		  100% {
			  transform: translateX(-100%) scale(0.9);
			  opacity: 0;
		  }
	  }

	  @keyframes slidePrev {
		  0% {
			  transform: translateX(0) scale(1);
			  opacity: 1;
		  }
		  100% {
			  transform: translateX(100%) scale(0.9);
			  opacity: 0;
		  }
	  }

	  @keyframes slideInNext {
		  0% {
			  transform: translateX(100%) scale(0.9);
			  opacity: 0;
		  }
		  100% {
			  transform: translateX(0) scale(1);
			  opacity: 1;
		  }
	  }

	  @keyframes slideInPrev {
		  0% {
			  transform: translateX(-100%) scale(0.9);
			  opacity: 0;
		  }
		  100% {
			  transform: translateX(0) scale(1);
			  opacity: 1;
		  }
	  }

	  .card {
		  position: relative;
		  animation: hintSwipe 2s ease-in-out infinite;
	  }

	  @keyframes hintSwipe {
		  0%, 100% {
			  transform: translateX(0);
		  }
		  25% {
			  transform: translateX(10px);
		  }
		  75% {
			  transform: translateX(-10px);
		  }
	  }

	  .card.user-interacted {
		  animation: none;
	  }

	  .emojis {
		  font-size: 48px; 
	  }

  .middle-buttons {
	  display: flex;
	  justify-content: center;
	  gap: 20px;
	  width: 100%;
	  max-width: 500px;
	  margin: 20px auto;
	  padding: 0 20px;
	  transform: translateX(-2px);
  }

  .middle-buttons a {
	  flex: 1;
	  max-width: 230px;
	  height: 60px;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  background: linear-gradient(135deg, #ff3366, #ff5555);
	  color: white;
	  text-decoration: none;
	  border-radius: 35px;
	  font-size: 1.2em;
	  font-weight: 600;
	  transition: all 0.3s ease;
	  border: none;
	  box-shadow: 0 4px 20px rgba(255, 51, 102, 0.3);
  }

  .middle-buttons a:hover {
	  transform: translateY(-2px);
	  box-shadow: 0 8px 25px rgba(255, 51, 102, 0.4);
  }

  .button-icon {
	  width: 28px;
	  height: 28px;
	  margin-right: 12px;
  }