/* yyyygo.com product wells only. Product artwork colors stay as drawn. */
.relative.flex.items-center.justify-center.overflow-hidden.bg-white {
  background-color: #3a3530 !important;
}
div[style*="#f7f7f8"] {
  background: radial-gradient(circle at 50% 20%, #4a433a, #3a3530 70%) !important;
}

/* Fill-in fields stay one line and do not zoom the page. */
input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=range]):not([type=button]):not([type=submit]):not([type=hidden]):not([type=image]),
textarea,
select {
  font-size: 16px !important;
}
textarea {
  resize: none !important;
  overflow-y: auto !important;
}

/* Web browser fills the window. Mini app stays a phone column. */
html.web .max-w-\[430px\] {
  max-width: none !important;
  box-shadow: none !important;
}
html.pc .max-w-\[1200px\],
html.pc .pc\:max-w-\[1200px\] {
  max-width: none !important;
}
html.pc .pc\:max-w-\[960px\] {
  max-width: none !important;
  aspect-ratio: auto !important;
  height: min(42vw, 440px) !important;
}
html.pc .pc\:px-4 {
  padding-left: 28px !important;
  padding-right: 28px !important;
}

/* Splash mark: tilted spin from first paint, no script wait. */
@keyframes yyyygSpin {
  from { transform: rotate3d(0.46, 1, 0.06, 0deg); }
  to { transform: rotate3d(0.46, 1, 0.06, 360deg); }
}
.yyyyg-splash {
  perspective: 420px;
}
.yyyyg-mark {
  display: block;
  animation: yyyygSpin 1.15s linear infinite;
  transform-style: preserve-3d;
  backface-visibility: visible;
  will-change: transform;
}