/* Third-round PSD, 2026-10-12. Measurements include text transforms.
   Native 248px WeChat header is excluded. Fixed text sizes/line breaks are
   intentional; flexible photo backgrounds and safe areas accommodate phones. */
.splash-slogan {
  left: calc(50% - 1.041667px); right: auto;
  width: 249.305556px; height: 75.347222px;
  transform: translateX(-50%); text-shadow: none;
  top: max(6.838833%, calc(env(safe-area-inset-top) + 48px));
}
#s-splash .splash-slogan { top: max(6.838833%, calc(env(safe-area-inset-top) + 48px)); }
.splash-bottom { bottom: max(5.882353%, env(safe-area-inset-bottom)); gap: calc(7.291667 * var(--u)); padding-bottom: 0; }
.brand-row { margin-bottom: calc(10.416667 * var(--u)); gap: 0; }
.brand-lockup { width: 179.513889px; height: 20.486111px; }
#s-splash .btn-primary { display: flex; align-items: center; justify-content: center; width: calc(181.25 * var(--u)); height: calc(38.888889 * var(--u)); line-height: calc(38.888889 * var(--u)); border-radius: calc(6.944444 * var(--u)); }
.splash-button-label { width: 55.902778px; height: 13.888889px; }
.btn-history .splash-button-label { width: 56.597222px; height: 13.541667px; }

/* These two fixed-content dialogs retain the PSD text column on every phone.
   308px fits a 320px viewport without shrinking fonts or changing line breaks. */
#p-privacy .popup, #p-photoguide .popup {
  width: 307.986111px; height: 313.194444px; min-height: 313.194444px;
  padding: 0; top: -42.881944px; border-radius: 8.680556px;
  text-rendering: geometricPrecision;
}
#p-privacy .popup-title, #p-photoguide .popup-title {
  position: absolute; margin: 0; font-size: 23.148148px; line-height: 28.935185px;
  letter-spacing: 0; white-space: nowrap;
}
#p-privacy .popup-title { left: 31.944444px; top: 35px; }
#p-photoguide .popup-title { left: 37.5px; top: 61.388889px; text-align: left; }
#p-privacy .popup-body, .guide-description {
  position: absolute; margin: 0;
  font-size: 11.574074px; line-height: 17.361111px; font-weight: 400; letter-spacing: 0;
}
#p-privacy .popup-body { left: 31.944444px; top: 109.027778px; width: 243.75px; }
/* Text-frame advance includes side bearings beyond the PSD visible-ink bbox. */
.guide-description { left: 37.847222px; top: 135.069444px; width: 237px; }
.guide-description span { white-space: nowrap; }
#p-privacy .privacy-row { position: absolute; left: 29.861111px; top: 184.375px; gap: 10.069444px; }
#p-privacy .privacy-text { font-size: 10.127315px; line-height: 18.807870px; white-space: nowrap; }
#p-privacy .privacy-link { font-family: "MiSans Demibold", var(--font); font-weight: 700; }
#p-privacy .checkbox { width: 11.805556px; height: 12.152778px; }
#p-privacy .popup-btn, #p-photoguide .popup-btn {
  position: absolute; left: 63.194444px; margin: 0;
  width: 181.25px; height: 38.888889px; line-height: 38.888889px;
  font-family: "MiSans Demibold", var(--font); font-size: 14.467593px; font-weight: 700;
  letter-spacing: 0; border-radius: 6.944444px;
}
#p-privacy .popup-btn { top: 239.930556px; }
#p-photoguide .popup-btn { top: 219.791667px; }
#p-privacy .popup-close, #p-photoguide .popup-close { top: 10.055556px; right: 10.055556px; width: 32px; height: 32px; }
#p-privacy .popup-close img, #p-photoguide .popup-close img { width: 17.708333px; height: 17.361111px; }
@media (max-height: 440px) {
  #p-privacy .popup, #p-photoguide .popup { top: 0; }
}

/* PSD 984x503 card; text starts 77/78px in, image starts at x480.
   Fixed typography is preserved even at 320px; never center-crop the artwork. */
.prod-title { font-size: 23.148148px; line-height: 31.828704px; margin-top: calc(19.583333 * var(--u)); letter-spacing: 0; }
.card-product { width: calc(341.666667 * var(--u)); margin-left: calc(-0.333333 * var(--u)); border-radius: calc(5.208333 * var(--u)); }
.prod-card { position: relative; height: calc(174.652778 * var(--u)); min-height: 0; text-rendering: geometricPrecision; }
.prod-info { flex: 0 0 48.780488%; padding: 0; }
#product-title {
  position: absolute; left: 26.736111px; top: calc(34.027778 * var(--u));
  margin: 0; font-size: 14.467593px; line-height: 15.071903px; font-weight: 600;
}
.prod-name {
  position: absolute; left: 26.736111px; top: calc(57.638889 * var(--u));
  margin: 0; font-size: 11.574074px; line-height: 17.361111px; font-weight: 600;
}
.prod-badge { position: absolute; left: 27.430556px; top: calc(115.277778 * var(--u)); width: calc(35.069444 * var(--u)); margin: 0; }
.prod-scroll { flex: 0 0 51.219512%; }
.prod-scroll img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: fill; }

/* Exact static PSD waiting image. No fake progress or added scanning animation.
   Contain the original composition instead of stretching/cropping faces/icons. */
#p-analyzing { background: #000; overflow: hidden; }
.scan-artwork { width: 100%; height: 100%; object-fit: contain; }
#p-analyzing:not(.scan-artwork-ready) .scan-artwork { visibility: hidden; }
/* A failed/stalled image must not leave an unexplained black screen. The live
   status is visually hidden only once the exact PSD artwork has loaded. */
.scan-status { position: absolute; top: 10.5%; left: 0; right: 0; color: #fff; text-align: center; font: 700 23.148148px/1.4 "MiSans Demibold",var(--font); }
.scan-artwork-ready .scan-status { width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.scan-cancel {
  position: absolute; left: 50%; bottom: max(10px, env(safe-area-inset-bottom));
  transform: translateX(-50%); padding: 10px 24px;
  color: #bbb; font: 12px/1.5 "PingFang SC","Microsoft YaHei",sans-serif;
}
.scan-cancel:focus-visible { outline: 1px solid var(--yellow); border-radius: 4px; }