:root {
  color-scheme:light;
  --orange:#ff7812;
  --ink:#28170e;
  --muted:#634126;
  --paper:#fff9f1;
  --line:rgba(40,23,14,.19);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-synthesis:none;
  text-rendering:optimizeLegibility
}
* {
  box-sizing:border-box
}
html {
  background:var(--orange);
  scroll-behavior:smooth
}
body {
  margin:0;
  color:var(--ink)
}
a {
  color:inherit;
  text-underline-offset:4px
}
a:hover {
  text-decoration-thickness:2px
}
a:focus-visible,summary:focus-visible {
  outline:3px solid currentColor;
  outline-offset:6px
}
.shell {
  width:min(1120px,100% - 64px);
  margin-inline:auto
}
.site-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:28px 0
}
.brand {
  display:flex;
  align-items:center;
  gap:11px;
  text-decoration:none;
  font-size:20px;
  font-weight:780;
  letter-spacing:-.8px
}
.brand img {
  border-radius:11px
}
.brand em {
  font-style:normal;
  font-weight:450
}
.languages {
  position:relative;
  font-size:14px
}
.languages summary {
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 0
}
.languages summary::-webkit-details-marker {
  display:none
}
.languages summary:after {
  content:"⌄"
}
.language-menu {
  position:absolute;
  right:0;
  top:44px;
  min-width:176px;
  background:var(--paper);
  padding:8px;
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:0 14px 36px #28170e1c;
  z-index:5
}
.language-menu a {
  display:block;
  text-decoration:none;
  padding:9px 12px;
  border-radius:7px
}
.language-menu a:hover,.language-menu a[aria-current=page] {
  background:#ff781229
}
.hero {
  display:grid;
  grid-template-columns:1.15fr 1fr;
  gap:64px;
  align-items:center;
  padding:48px 0 66px;
  min-height:710px
}
.eyebrow {
  font-size:12px;
  font-weight:700;
  letter-spacing:1.4px;
  margin:0 0 20px;
  line-height:1.8
}
h1 {
  font-size:clamp(48px,6.1vw,76px);
  line-height:1.05;
  letter-spacing:-3.6px;
  margin:0 0 24px;
  font-weight:800;
  overflow-wrap:break-word;
  hyphens:auto;
  text-wrap:balance
}
.intro {
  max-width:460px;
  font-size:21px;
  line-height:1.55;
  margin:0 0 26px
}
.app-name {
  font-size:clamp(35px,4.8vw,59px);
  font-weight:800;
  letter-spacing:-2.5px;
  white-space:nowrap;
  line-height:1.1;
  margin:0 0 24px
}
.app-name span {
  font-weight:450
}
.badge-wrap {
  display:inline-block;
  padding:14px;
  margin:-14px 0 5px -14px;
  line-height:0
}
.store-badge {
  display:block;
  height:54px;
  width:auto
}
.availability {
  font-size:14px;
  margin:16px 0 0;
  color:var(--muted);
  line-height:1.6
}
.screenshot {
  margin:0;
  flex-direction:column;
  gap:12px;
  display:flex;
  align-items:center;
  justify-content:center
}
.screenshot img, .screenshot video {
  display:block;
  width:min(100%,300px);
  height:auto;
  border:1px solid #a33d0d3d;
  border-radius:25px;
  box-shadow:0 20px 55px #8e350c3b
}
.features {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:36px;
  padding:36px 0 42px;
  border-top:1px solid var(--line)
}
.features h2 {
  font-size:18px;
  letter-spacing:-.3px;
  margin:0 0 10px
}
.features p {
  font-size:15px;
  line-height:1.65;
  margin:0;
  color:var(--muted)
}
footer {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  padding:26px 0;
  border-top:1px solid var(--line);
  font-size:13px
}
footer nav {
  display:flex;
  gap:24px;
  flex-wrap:wrap
}
footer a {
  text-decoration:none
}
footer a:hover {
  text-decoration:underline
}
.trademarks {
  font-size:11px;
  line-height:1.7;
  color:var(--muted);
  padding:0 0 24px;
  margin:0;
  max-width:800px
}
.document {
  max-width:760px;
  padding:36px 0 72px
}
.back {
  display:inline-block;
  font-size:14px;
  margin-bottom:32px
}
.document h1 {
  font-size:46px;
  letter-spacing:-1.8px;
  line-height:1.15
}
.updated {
  font-size:13px;
  color:var(--muted);
  margin:0 0 26px
}
.document .lead {
  font-size:21px;
  line-height:1.6;
  font-weight:550
}
.document section {
  margin-top:32px
}
.document h2 {
  font-size:22px;
  line-height:1.3;
  letter-spacing:-.5px;
  margin:0 0 10px
}
.document p {
  font-size:16px;
  line-height:1.75
}
.policy-links {
  display:flex;
  flex-wrap:wrap;
  gap:14px 24px;
  margin-top:36px;
  font-size:14px
}
.email {
  font-weight:650
}
.not-found {
  min-height:60vh
}
.not-found h1 {
  font-size:46px
}
.skip-link {
  position:absolute;
  left:24px;
  top:-70px;
  padding:12px;
  background:var(--paper);
  z-index:10
}
.skip-link:focus {
  top:12px
}
@media(max-width:760px) {
  .shell {
    width:calc(100% - 40px)
  }
  .site-header {
    padding:21px 0
  }
  .brand {
    font-size:18px
  }
  .brand img {
    width:32px;
    height:32px
  }
  .hero {
    grid-template-columns:1fr;
    gap:42px;
    min-height:auto;
    padding:42px 0 44px
  }
  .hero-copy {
    text-align:center
  }
  .eyebrow {
    font-size:11px;
    margin-bottom:16px
  }
  h1 {
    font-size:48px;
    letter-spacing:-2px;
    max-width:560px;
    margin-inline:auto
  }
  .app-name {
    font-size:44px;
    letter-spacing:-2px
  }
  .intro {
    font-size:18px;
    margin-inline:auto
  }
  .badge-wrap {
    margin:0;
    padding:0
  }
  .availability {
    margin-top:18px
  }
  .screenshot img, .screenshot video {
    width:270px;
    border-radius:22px
  }
  .features {
    grid-template-columns:1fr;
    gap:26px;
    padding:30px 0
  }
  .features h2 {
    font-size:18px
  }
  .features p {
    max-width:520px
  }
  .document {
    padding-top:28px
  }
  .document h1 {
    font-size:38px;
    letter-spacing:-1.3px
  }
  .document .lead {
    font-size:19px
  }
  footer {
    align-items:flex-start;
    gap:20px;
    flex-direction:column
  }
  footer nav {
    gap:20px
  }
  .trademarks {
    font-size:10px
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
}
.hero-copy h1:lang(ja),.hero-copy h1:lang(ko),.hero-copy h1:lang(zh-Hans),.hero-copy h1:lang(zh-Hant) {
  font-size:clamp(37px,5vw,58px);
  letter-spacing:-1.5px;
  overflow-wrap:normal
}
.document h1:lang(ja),.document h1:lang(ko),.document h1:lang(zh-Hans),.document h1:lang(zh-Hant) {
  font-size:clamp(30px,4vw,42px);
  letter-spacing:-1px
}

.screenshot figcaption {
  font-size:13px;
  line-height:1.5;
  text-align:center;
  color:var(--muted);
}
