/* Design coordinates: 960px. Keep pub_rem.js unchanged. */
:root { color-scheme: dark; }
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; width: 100%; min-height: 100%; background: #20002b; }
body { color: #fff; font-family: Georgia, "Times New Roman", serif; }
.landing-page {
  --u: min(0.1041666667vw, 1px);
  width: 100%; max-width: 960px; margin: 0 auto;
  box-shadow: 0 0 40px #0008;
}
.topbar {
  position: sticky; top: 0; z-index: 10;
  width: 100%; aspect-ratio: 960 / 214;
  background: #20002b url('../images/header.jpg') center / 100% 100% no-repeat;
}
.app-icon {
  position: absolute; left: calc(46 * var(--u)); top: calc(30 * var(--u));
  width: calc(152 * var(--u)); height: calc(152 * var(--u));
  object-fit: contain; border-radius: calc(28 * var(--u));
}
.brand-copy {
  position: absolute; left: calc(215 * var(--u)); top: calc(56 * var(--u));
  width: calc(380 * var(--u)); color: #fff;
  text-shadow: 0 calc(2 * var(--u)) calc(3 * var(--u)) #180000;
}
.brand-copy h1 {
  margin: 0; font-family: "Times New Roman", serif;
  font-size: calc(40 * var(--u)); font-weight: 700; line-height: 1.2;
}
.brand-copy p {
  margin: calc(7 * var(--u)) 0 0; font-family: "Times New Roman", serif;
  font-size: calc(26 * var(--u)); font-weight: 700; line-height: 1.2; white-space: nowrap;
}
.download-cta {
  position: absolute; left: calc(590 * var(--u)); top: calc(6 * var(--u));
  display: block; width: calc(355 * var(--u)); height: calc(200 * var(--u));
  padding: 0; border: 0; background: transparent; cursor: pointer;
  -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
.download-cta img { display: block; width: 100%; height: 100%; object-fit: contain; animation: downloadPulse 1.6s ease-in-out infinite; }
.download-cta:focus-visible { outline: 3px solid #fff3a8; outline-offset: -12px; border-radius: 24px; }
.download-cta:hover img { filter: brightness(1.12); }
.download-cta:active img { transform: scale(.97); animation: none; }
.art-section { margin: 0; padding: 0; }
.section-art { display: block; width: 100%; height: auto; margin: 0; }
@keyframes downloadPulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.025); } }
@media (prefers-reduced-motion: reduce) { .download-cta img { animation: none; } }