@font-face {
  font-family: LetterON Sans;
  src: local("Inter"),local("Arial");
  font-display: swap;
}
:root {
  --paper: #faf9f8;
  --surface: #e5e4e0;
  --ink: #303330;
  --muted: #616460;
  --green: #246344;
  --line: #b9bcb6;
  --white: #ffffff;
  --serif: Georgia,"Times New Roman",serif;
  --sans: "LetterON Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --selected: #d5d8d5;
  --action: #d1d3d0;
  --accent: #ffe79d;
  --panel-shadow: 5px 5px 0 #bcc2b8;
  --panel-shadow-strong: 7px 7px 0 #bcc2b8;
  --hard-shadow: 4px 4px 0 var(--ink);
  --hard-shadow-strong: 6px 6px 0 var(--ink);
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 92px;
}
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
button,a,input,summary {
  -webkit-tap-highlight-color: transparent;
}
button {
  font: inherit;
  color: inherit;
  cursor: pointer;
}
a {
  color: inherit;
  text-decoration: none;
}
button {
  border: 0;
  background: none;
}
button,a,summary {
  touch-action: manipulation;
}
button:focus-visible,a:focus-visible,summary:focus-visible {
  outline: 3px solid var(--green);
  outline-offset: 5px;
}
img {
  max-width: 100%;
  display: block;
}
svg {
  display: block;
}
h1,h2,h3,p,figure {
  margin: 0;
}
h1,h2,h3 {
  line-height: 1.15;
  letter-spacing: -.04em;
  font-weight: 700;
}
h2 {
  font-size: clamp(34px,4vw,50px);
}
h3 {
  font-size: 24px;
}
p {
  color: var(--muted);
}
[hidden] {
  display: none!important;
}
section[id] {
  scroll-margin-top: 90px;
}
.home-wrap {
  max-width: 1160px;
  margin-inline: auto;
  padding-inline: 32px;
}
.home-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}
.home-skip {
  position: fixed;
  left: 16px;
  top: -100px;
  z-index: 100;
  background: var(--ink);
  color: var(--paper);
  padding: 12px 18px;
}
.home-skip:focus {
  top: 12px;
}
.home-header {
  position: sticky;
  top: 0;
  z-index: 20;
  background: var(--surface);
  border-bottom: 2px solid var(--ink);
}
.home-header-inner {
  height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}
.home-brand {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: var(--ink);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -.04em;
  flex-shrink: 0;
}
.home-nav {
  display: flex;
  gap: 28px;
  font-size: 14px;
  font-weight: 600;
}
.home-nav a {
  padding-block: 12px;
}
.home-nav a:hover,.home-login:hover {
  color: var(--green);
  text-decoration: underline;
  text-underline-offset: 5px;
}
.home-login {
  padding: 8px 14px;
  white-space: nowrap;
  border: 2px solid var(--ink);
  border-radius: 8px;
  background: var(--paper);
  box-shadow: 2px 2px 0 var(--ink);
  font-weight: 600;
}
.home-header-actions {
  display: flex;
  align-items: center;
  gap: 24px;
  font-size: 14px;
}
.home-languages {
  position: relative;
}
.home-languages summary {
  list-style: none;
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  min-height: 44px;
  border: 2px solid var(--ink);
  border-radius: 8px;
  padding: 6px 10px;
  background: var(--paper);
  font-weight: 600;
}
.home-languages summary::-webkit-details-marker {
  display: none;
}
.home-languages summary svg {
  width: 19px;
  height: 19px;
}
.home-language-list {
  position: absolute;
  top: 48px;
  right: 0;
  display: grid;
  width: 188px;
  max-height: 65vh;
  overflow-y: auto;
  border: 2px solid var(--ink);
  background: var(--white);
  padding: 8px;
  box-shadow: var(--hard-shadow-strong);
  border-radius: 8px;
}
.home-language-list a {
  padding: 7px 12px;
}
.home-language-list a:hover,.home-language-list [aria-current] {
  background: var(--surface);
  color: var(--green);
}
.home-eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .1em;
  line-height: 1.5;
  color: var(--ink);
}
.home-hero {
  padding-top: 28px;
  padding-bottom: 28px;
  text-align: center;
}
.home-hero h1 {
  font-family: var(--sans);
  font-size: clamp(44px,5.2vw,64px);
  margin-top: 18px;
  font-weight: 700;
  letter-spacing: -.05em;
  line-height: 1.12;
}
.home-hero h1 span {
  font-style: normal;
  color: var(--ink);
  padding: 0 6px 4px;
  background: linear-gradient(178deg,transparent 76%,var(--accent) 77%,var(--accent) 91%,transparent 92%);
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  margin-top: 8px;
}
.home-lede {
  max-width: 580px;
  margin: 18px auto 0;
  font-size: 16px;
  line-height: 1.6;
}
.home-hero-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 26px;
  margin-top: 22px;
}
.home-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  min-height: 50px;
  background: var(--accent);
  border: 2px solid var(--ink);
  color: var(--ink);
  border-radius: 8px;
  padding: 12px 20px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  transition: background .18s,transform .18s,box-shadow .18s;
  box-shadow: var(--hard-shadow);
}
.home-button svg,.home-text-link svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  transition: transform .18s;
}
.home-button:hover {
  background: var(--selected);
  transform: translate(-2px,-2px);
  box-shadow: var(--hard-shadow-strong);
}
.home-button:hover svg,.home-text-link:hover svg {
  transform: translateX(3px);
}
.home-button:active {
  transform: translate(3px,3px);
  box-shadow: none;
}
.home-text-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 4px 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
  text-align: left;
}
.home-free-note {
  font-size: 12px;
  max-width: 440px;
  margin: 12px auto 0;
  line-height: 1.6;
}
.letter-journey {
  --journey-duration: 10s;
  --ticket-mid-x: 48px;
  --ticket-mid-y: -14px;
  --ticket-end-x: 90px;
  --ticket-end-y: -14px;
  --result-x: -65px;
  --result-y: 14px;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0,1fr) 220px minmax(0,1fr);
  align-items: center;
  gap: 24px;
  margin-top: 28px;
  min-height: 360px;
  text-align: left;
}
.letter-journey:before {
  content: "";
  position: absolute;
  left: 18%;
  right: 18%;
  top: 50%;
  border-top: 2px dashed var(--line);
}
.journey-input {
  position: relative;
  padding-left: 0;
  align-self: center;
  width: 100%;
  max-width: 300px;
  justify-self: center;
  display: grid;
  justify-items: center;
}
.journey-label {
  display: block;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .15em;
  color: var(--ink);
  margin-bottom: 12px;
}
.journey-machine {
  position: relative;
  color: var(--ink);
  width: 220px;
  justify-self: center;
  transform: none;
}
.journey-robot {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}
.robot-body {
  transform-origin: 120px 216px;
}
.robot-antenna {
  transform-origin: 120px 36px;
}
.robot-eyes {
  transform-origin: 120px 79px;
}
.robot-slot {
  transform-origin: 120px 144px;
}
.robot-letter,.robot-ticket,.robot-happy,.robot-digest,.robot-check {
  opacity: 0;
}
.robot-letter {
  transform-origin: 120px 114px;
}
.robot-ticket {
  transform-origin: 164px 168px;
}
.robot-ground {
  transform-origin: 120px 240px;
}
.journey-tokens {
  position: absolute;
  right: -28px;
  top: 125px;
  display: flex;
  gap: 6px;
  flex-direction: column;
  pointer-events: none;
}
.journey-tokens span {
  opacity: 0;
  background: var(--selected);
  border: 2px solid var(--ink);
  border-radius: 6px;
  font-size: 9px;
  white-space: nowrap;
  padding: 3px 12px;
  box-shadow: 2px 2px 0 var(--ink);
  font-weight: 600;
}
.journey-result {
  position: relative;
  min-width: 0;
  width: 100%;
  max-width: 400px;
  justify-self: center;
}
.journey-screen {
  position: relative;
  display: block;
  width: 100%;
  border: 2px solid var(--ink);
  border-radius: 8px;
  overflow: hidden;
  padding: 30px 24px 60px;
  min-height: 310px;
  background: var(--paper);
  text-align: left;
  box-shadow: var(--panel-shadow-strong);
}
.journey-detail-label {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 10px;
  color: var(--muted);
}
.journey-detail-label svg,.journey-note svg {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
}
.journey-priority {
  font-size: 9px;
  color: var(--muted);
  margin: 2px 0 8px;
}
.journey-action-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.journey-action {
  flex: 1;
  min-width: 0;
  font-size: 12px;
  line-height: 1.6;
  margin: 0;
  overflow-wrap: anywhere;
}
.journey-complete {
  max-width: 92px;
  padding: 4px 7px;
  border: 1px solid var(--ink);
  border-radius: 4px;
  background: var(--selected);
  box-shadow: 2px 2px 0 var(--ink);
  font-size: 9px;
  line-height: 1.4;
}
.journey-complete[aria-pressed="true"] {
  color: var(--paper);
  background: var(--green);
}
.journey-summary {
  margin-top: 12px;
  padding-block: 14px 12px;
  border-block: 1px solid var(--surface);
}
.journey-summary p {
  margin: 4px 0 0;
  font-size: 11px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}
.journey-note {
  margin-top: 8px;
  font-size: 10px;
  color: var(--muted);
}
.journey-note summary {
  display: flex;
  align-items: center;
  gap: 5px;
  min-height: 24px;
  cursor: pointer;
  list-style: none;
}
.journey-note summary::-webkit-details-marker {
  display: none;
}
.journey-note textarea {
  width: 100%;
  margin-top: 6px;
  padding: 8px;
  resize: vertical;
  border: 1px solid var(--line);
  border-radius: 4px;
  font: inherit;
  color: var(--ink);
  background: var(--paper);
}
.journey-note textarea:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 2px;
}
.journey-screen .screen-expand {
  opacity: 1;
}
.screen-expand {
  position: absolute;
  right: 10px;
  bottom: 10px;
  background: var(--accent);
  border: 2px solid var(--ink);
  width: 32px;
  height: 32px;
  border-radius: 6px;
  display: grid;
  place-items: center;
  font-size: 20px;
  color: var(--ink);
  opacity: 0;
  transition: opacity .2s;
  box-shadow: 2px 2px 0 var(--ink);
}
.journey-screen:hover .screen-expand,.journey-screen:focus-visible .screen-expand,.workflow-screen button:hover .screen-expand,.history-screen button:hover .screen-expand {
  opacity: 1;
}
.journey-result figcaption,.workflow-screen figcaption,.history-screen figcaption {
  font-size: 10px;
  color: var(--muted);
  line-height: 1.5;
  margin-top: 10px;
}
.journey-caption {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-top: 16px;
  font-size: 11px;
  color: var(--muted);
}
.journey-caption button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 4px 0;
  font-size: 11px;
  color: var(--ink);
  font-weight: 600;
}
.journey-caption svg {
  width: 14px;
  height: 14px;
}
.is-playing .robot-letter {
  animation: letter-feed var(--journey-duration) infinite both;
}
.is-playing .robot-body {
  animation: robot-work var(--journey-duration) infinite both;
}
.is-playing .robot-antenna {
  animation: antenna-work var(--journey-duration) infinite both;
}
.is-playing .robot-eyes {
  animation: robot-look var(--journey-duration) infinite both;
}
.is-playing .robot-happy {
  animation: robot-happy var(--journey-duration) infinite both;
}
.is-playing .robot-slot {
  animation: robot-swallow var(--journey-duration) infinite both;
}
.is-playing .robot-hand-left {
  animation: hand-left var(--journey-duration) infinite both;
}
.is-playing .robot-hand-right {
  animation: hand-right var(--journey-duration) infinite both;
}
.is-playing .robot-light {
  animation: robot-light var(--journey-duration) infinite both;
}
.is-playing .robot-digest {
  animation: robot-digest var(--journey-duration) infinite both;
}
.is-playing .robot-scan {
  animation: robot-scan var(--journey-duration) infinite both;
}
.is-playing .robot-check {
  animation: robot-check var(--journey-duration) infinite both;
}
.is-playing .robot-ticket {
  animation: ticket-out var(--journey-duration) infinite both;
}
.is-playing .journey-tokens span:first-child {
  animation: extract-fields var(--journey-duration) infinite both;
}
.is-playing .journey-tokens span:last-child {
  animation: extract-fields var(--journey-duration) .12s infinite both;
}
.is-playing .journey-result {
  animation: result-out var(--journey-duration) infinite both;
  transform-origin: left center;
}
.is-playing .robot-ground {
  animation: robot-ground var(--journey-duration) infinite both;
}
.is-paused * {
  animation-play-state: paused!important;
}
.home-section {
  padding-block: 100px;
}
.home-section-heading {
  max-width: 650px;
  margin-bottom: 40px;
}
.home-section-heading h2 {
  margin-top: 14px;
}
.home-section-heading>p:last-child {
  max-width: 600px;
  font-size: 16px;
  margin-top: 18px;
}
.home-demo {
  background: var(--surface);
  border-top: 2px solid var(--ink);
  border-bottom: 2px solid var(--ink);
}
.sample-controls {
  display: grid;
  border-bottom: 0;
  gap: 16px;
  grid-template-columns: repeat(4,minmax(0,1fr));
  padding-bottom: 8px;
}
.sample-controls button {
  position: relative;
  min-height: 58px;
  padding: 12px 18px;
  font-size: 15px;
  text-align: left;
  color: var(--ink);
  border: 2px solid var(--ink);
  border-radius: 8px;
  background: var(--paper);
  font-weight: 600;
  transition: background .18s,transform .18s,box-shadow .18s;
  box-shadow: 2px 2px 0 var(--ink);
}
.sample-controls button span {
  font-size: 10px;
  font-family: monospace;
  margin-right: 9px;
}
.sample-controls button[aria-pressed=true] {
  color: var(--ink);
  font-weight: 700;
  background: var(--accent);
  box-shadow: var(--hard-shadow);
}
.sample-controls button[aria-pressed=true]:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  background: var(--green);
  display: none;
}
.sample-panel {
  display: grid;
  grid-template-columns: 1fr 1.12fr;
  gap: 76px;
  padding-top: 36px;
}
.sample-source {
  max-width: 420px;
}
.sample-small-heading {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .08em;
  padding-bottom: 14px;
}
.sample-source pre {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  background: var(--white);
  border: 2px solid var(--ink);
  padding: 30px;
  font: 13px/1.85 var(--serif);
  margin: 0;
  color: var(--ink);
  border-radius: 4px;
  box-shadow: var(--panel-shadow);
}
.home-caption {
  font-size: 12px;
  line-height: 1.6;
}
.sample-source .home-caption {
  margin-top: 12px;
}
.sample-answer {
  padding-top: 32px;
}
.sample-answer h3 {
  font-size: clamp(25px,3.2vw,37px);
  max-width: 520px;
  margin-top: 14px;
  line-height: 1.2;
}
.sample-facts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  padding: 24px 0;
  border-block: 2px solid var(--ink);
  margin: 26px 0;
}
.sample-facts dt {
  font-size: 11px;
  color: var(--muted);
  margin-bottom: 8px;
}
.sample-facts dd {
  font-size: 18px;
  margin: 0;
  color: var(--ink);
  font-weight: 700;
}
.sample-answer>p:not(.home-eyebrow) {
  font-size: 15px;
  max-width: 470px;
}
.sample-next {
  margin-top: 16px;
}
.sample-answer .home-text-link {
  margin-top: 22px;
}
.demo-footnote {
  margin-top: 32px;
  max-width: 640px;
}
.home-workflow .home-section-heading {
  max-width: 630px;
}
.workflow-controls {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 18px;
  margin-bottom: 34px;
}
.workflow-controls button {
  display: flex;
  gap: 14px;
  padding: 18px;
  border-top: 2px solid var(--line);
  text-align: left;
  align-items: flex-start;
  border: 2px solid var(--ink);
  border-radius: 8px;
  background: var(--paper);
  transition: background .18s,transform .18s,box-shadow .18s;
}
.workflow-controls [aria-pressed=true] {
  border-color: var(--ink);
  background: var(--accent);
  box-shadow: var(--hard-shadow);
}
.workflow-number {
  font: 11px/1.7 monospace;
  color: var(--muted);
}
.workflow-controls strong {
  display: block;
  font-size: 18px;
  line-height: 1.3;
  font-weight: 700;
  margin-bottom: 10px;
}
.workflow-controls button>span:last-child>span {
  display: block;
  font-size: 13px;
  line-height: 1.7;
  color: var(--muted);
}
.workflow-screen button {
  position: relative;
  display: block;
  padding: 18px;
  width: 100%;
  border-radius: 10px;
  overflow: hidden;
  border: 2px solid var(--ink);
  background: var(--paper);
  box-shadow: var(--panel-shadow-strong);
}
.workflow-screen img {
  width: 100%;
  height: auto;
}
.workflow-screen figcaption {
  text-align: center;
}
.home-why {
  background: var(--selected);
  border-block: 2px solid var(--ink);
}
.home-why-intro {
  max-width: 780px;
}
.home-why-intro h2 {
  margin-top: 14px;
  max-width: 780px;
}
.home-why-intro>p:last-child {
  max-width: 590px;
  margin-top: 22px;
}
.home-why-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  margin-top: 50px;
  align-items: start;
}
.home-benefits article {
  padding: 20px 0 28px;
  border-top: 2px solid var(--ink);
}
.home-benefits h3 {
  font-size: 23px;
  margin-top: 10px;
  margin-bottom: 14px;
  max-width: 390px;
}
.home-benefits p {
  font-size: 14px;
  max-width: 390px;
}
.history-screen button {
  display: block;
  position: relative;
  width: 100%;
  padding: 0;
  overflow: hidden;
  border: 2px solid var(--ink);
  border-radius: 8px;
  box-shadow: var(--panel-shadow-strong);
}
.history-screen button {
  aspect-ratio: 724/850;
}
.history-screen img {
  position: absolute;
  max-width: none;
  width: 198.895%;
  height: auto;
  left: -93.232%;
  top: -2.941%;
}
.home-fit {
  display: flex;
  align-items: start;
  gap: 80px;
  border-top: 2px solid var(--ink);
  margin-top: 48px;
  padding-top: 26px;
}
.home-fit h3 {
  width: 45%;
  font-size: 24px;
  flex-shrink: 0;
}
.home-fit p {
  font-size: 14px;
  max-width: 440px;
}
.pricing-layout {
  display: grid;
  grid-template-columns: .85fr 1.4fr;
  gap: 70px;
  border-top: 2px solid var(--ink);
  padding-top: 36px;
}
.weekly-free {
  padding: 26px;
  border: 2px solid var(--ink);
  border-radius: 10px;
  background: #eef2e9;
  box-shadow: var(--panel-shadow-strong);
}
.weekly-free>p:first-child {
  font-size: 14px;
}
.weekly-free h3 {
  font-family: var(--sans);
  font-size: 56px;
  margin: 12px 0 20px;
  color: var(--ink);
  font-weight: 700;
}
.weekly-free>strong {
  display: block;
  font-size: 18px;
  max-width: 280px;
  line-height: 1.4;
  font-weight: 600;
}
.weekly-free .home-caption {
  margin-top: 12px;
}
.weekly-free .home-button {
  margin-top: 26px;
}
.point-packs h3 {
  font-size: 17px;
  margin-bottom: 20px;
}
.point-pack {
  display: grid;
  grid-template-columns: 100px 1fr 90px;
  gap: 18px;
  align-items: center;
  padding-block: 22px;
  border-top: 2px solid var(--ink);
}
.point-pack strong {
  font-size: 16px;
  font-weight: 700;
  display: block;
}
.point-pack span {
  font-size: 11px;
  color: var(--muted);
}
.point-pack p {
  font-size: 14px;
}
.pack-value {
  min-width: 0;
}
.point-pack .pack-per-letter {
  display: inline-block;
  color: var(--green);
  background: var(--accent);
  padding: 3px 6px;
  font-size: 16px;
  line-height: 1.5;
  margin-bottom: 6px;
}
.pack-price {
  text-align: right;
}
.pack-price strong {
  font-size: 22px;
  color: var(--ink);
  letter-spacing: -.03em;
}
.point-packs>.home-caption {
  margin-top: 18px;
}
.point-explainer {
  border-block: 2px solid var(--ink);
  padding: 20px 0;
  margin-top: 40px;
  font-size: 14px;
}
.point-explainer summary {
  cursor: pointer;
  min-height: 28px;
  font-weight: 700;
}
.point-explainer li {
  padding-top: 10px;
  color: var(--muted);
}
.point-explainer p {
  font-size: 12px;
  margin-top: 16px;
  max-width: 680px;
}
#privacy {
  scroll-margin-top: 90px;
}
.home-privacy {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 18px 60px;
  padding: 38px 0;
  border-bottom: 2px solid var(--ink);
}
.home-privacy h3 {
  font-size: 25px;
  max-width: 300px;
}
.home-privacy p {
  font-size: 14px;
}
.home-privacy .home-text-link {
  grid-column: 2;
}
.home-faq {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 60px;
  padding-top: 44px;
}
.home-faq h3 {
  font-size: 28px;
}
.home-faq details {
  border-bottom: 2px solid var(--ink);
  padding: 17px 0;
}
.home-faq details:first-child {
  padding-top: 0;
}
.home-faq summary {
  cursor: pointer;
  font-size: 15px;
  min-height: 28px;
  padding-right: 12px;
  line-height: 1.5;
  font-weight: 600;
}
.home-faq details p {
  font-size: 14px;
  margin-top: 16px;
}
.home-final {
  text-align: center;
  border-top: 2px solid var(--ink);
  padding-block: 66px;
  background: var(--surface);
}
.home-final img {
  margin: auto;
}
.home-final-mascot {
  display: inline-block;
  border-radius: 8px;
}
.home-final-mascot img {
  transform-origin: center bottom;
  animation: welcome-wave 2s ease-in-out infinite;
}
.home-final h2 {
  font-family: var(--sans);
  font-size: clamp(37px,5vw,58px);
  margin-top: 22px;
  font-weight: 700;
}
.home-final>.home-wrap>p {
  margin-top: 16px;
}
.home-final .home-button {
  margin-top: 26px;
}
.home-final .home-caption {
  max-width: 390px;
  margin-inline: auto;
}
.home-footer {
  display: grid;
  grid-template-columns: 1.2fr 1fr auto;
  gap: 40px;
  padding-block: 44px;
}
.home-footer p {
  font-size: 12px;
  margin-top: 12px;
}
.home-footer-resources {
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 6px;
  font-size: 12px;
}
.home-footer-resources>span {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--muted);
  margin-bottom: 7px;
}
.home-footer-legal {
  display: flex;
  gap: 20px;
  font-size: 12px;
}
.home-footer a:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}
.app-preview {
  border: 2px solid var(--ink);
  border-radius: 10px;
  padding: 20px;
  max-width: 1440px;
  width: calc(100vw - 48px);
  max-height: calc(100dvh - 48px);
  background: var(--paper);
  color: var(--ink);
  overflow: auto;
  box-shadow: var(--hard-shadow-strong);
}
.app-preview::backdrop {
  background: #1c241bba;
}
.preview-toolbar {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  margin-bottom: 16px;
}
.preview-toolbar h2 {
  font-size: 16px;
  letter-spacing: 0;
}
.preview-toolbar button {
  min-height: 44px;
  font-size: 14px;
  padding: 8px 0;
}
.preview-toolbar button span {
  font-size: 23px;
  margin-left: 12px;
}
.app-preview>img {
  width: 100%;
  height: auto;
  border: 1px solid var(--line);
  border-radius: 6px;
}
.app-preview>p {
  font-size: 11px;
  margin-top: 12px;
}

.journey-source-frame {
  width: min(100%,272px);
  height: 320px;
  display: grid;
  place-items: center;
}
.journey-context {
  display: block;
  margin-top: 4px;
  font-weight: 500;
  letter-spacing: 0;
  font-size: 11px;
  line-height: 1.5;
  color: var(--muted);
  overflow-wrap: anywhere;
}
.journey-source-image {
  width: auto;
  height: auto;
  max-height: 100%;
  border: 2px solid var(--ink);
  border-radius: 4px;
  box-shadow: var(--panel-shadow);
  transform: rotate(-4deg);
}
.journey-input .journey-label {
  width: 100%;
  min-height: 46px;
}
.journey-input figcaption {
  margin-top: 16px;
  font-size: 10px;
  line-height: 1.5;
  color: var(--muted);
}
.journey-playback {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 16px;
}
.journey-playback button {
  text-decoration: underline;
  text-underline-offset: 4px;
}
.is-playing .journey-source-image {
  animation: paper-in var(--journey-duration) infinite both;
}
.sample-scan {
  position: relative;
  display: block;
  padding: 12px;
  width: 100%;
  background: var(--white);
  border: 2px solid var(--ink);
  border-radius: 8px;
  box-shadow: var(--panel-shadow);
}
.sample-scan img {
  width: 100%;
  height: auto;
}
.sample-scan .screen-expand {
  opacity: 1;
}
.home-reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .65s ease,transform .65s cubic-bezier(.2,.7,.2,1);
}
.home-reveal.is-revealed {
  opacity: 1;
  transform: none;
}
.home-benefits article:nth-child(2) {
  transition-delay: .08s;
}
.home-benefits article:nth-child(3) {
  transition-delay: .16s;
}
.home-benefits .home-caption,.workflow-number {
  color: var(--green);
  font-weight: 700;
}
.home-button svg,.home-text-link svg {
  transition: transform .2s ease;
}
.home-button:hover svg,.home-text-link:hover svg {
  transform: translateX(4px);
}
.sample-controls button:hover,.workflow-controls button:hover,.home-login:hover {
  transform: translate(-2px,-2px);
  box-shadow: var(--hard-shadow-strong);
}
.sample-controls button:active,.workflow-controls button:active,.home-login:active {
  transform: translate(2px,2px);
  box-shadow: none;
}
@media(hover:hover) {
  .journey-screen:hover,.sample-scan:hover,.workflow-screen button:hover,.history-screen button:hover {
    border-color: var(--green);
  }
}
@keyframes welcome-wave {
  0%,100% { transform: rotate(0); }
  30% { transform: rotate(-8deg); }
  60% { transform: rotate(6deg); }
}
@keyframes paper-in {
  0%,5.12%,100% { opacity: 1; translate: 0 0; }
  14.08%,43.52% { opacity: .45; translate: 0 3px; }
  53.76% { opacity: 1; translate: 0 0; }
}
@keyframes letter-feed {
  0%,3.2% { opacity: 0; transform: translate(-120px,-55px) rotate(-18deg); }
  6.4% { opacity: 1; transform: translate(-90px,-50px) rotate(-18deg); }
  12.16% { opacity: 1; transform: translate(0,-8px) rotate(6deg); animation-timing-function: ease-out; }
  15.36% { opacity: 1; transform: translate(0,-3px) rotate(-3deg); }
  17.92% { opacity: 1; transform: translate(0,0) rotate(0); }
  24.32% { opacity: 1; transform: translate(0,30px) rotate(0); }
  28.16% { opacity: 1; transform: translate(0,58px) rotate(0); }
  28.8%,100% { opacity: 0; transform: translate(0,58px); }
}
@keyframes robot-work {
  0%,7.68%,17.92%,29.44%,40.96%,53.76%,100% { transform: translateY(0) scale(1,1) rotate(0); }
  12.16% { transform: translateY(2px) scale(1.03,.97) rotate(-3deg); }
  24.32% { transform: translateY(-4px) scale(.97,1.03); }
  27.52% { transform: translateY(4px) scale(1.05,.95); }
  32%,37.12% { transform: translateY(-2px) rotate(-2deg); }
  34.56%,39.68% { transform: translateY(1px) rotate(2deg); }
  44.8% { transform: translateY(4px) scale(1.05,.95) rotate(-3deg); }
  48% { transform: translateY(-7px) scale(.97,1.03) rotate(2deg); }
}
@keyframes antenna-work {
  0%,19.2%,42.24%,100% { transform: rotate(0); }
  25.6%,33.28%,46.72% { transform: rotate(-13deg); }
  28.8%,37.12%,49.92% { transform: rotate(13deg); }
  53.76% { transform: rotate(-5deg); }
}
@keyframes robot-look {
  0%,2.56%,17.92%,44.8%,100% { opacity: 1; transform: translateX(0) scaleY(1); }
  6.4%,11.52% { opacity: 1; transform: translateX(-7px) scaleY(1); }
  14.08%,15.36% { opacity: 1; transform: translateX(0) scaleY(.12); }
  30.72%,39.68% { opacity: 1; transform: translateY(4px) scaleY(.55); }
  47.36%,94% { opacity: 0; transform: translateX(0) scaleY(1); }
}
@keyframes robot-happy {
  0%,44.8%,100% { opacity: 0; }
  47.36%,94% { opacity: 1; }
}
@keyframes robot-swallow {
  0%,12.8%,30.08%,100% { transform: scaleY(1); }
  16.64%,25.6% { transform: scaleY(2.2); }
  28.16% { transform: scaleY(.65); }
}
@keyframes hand-left {
  0%,5.12%,28.8%,100% { transform: translate(0,0); }
  11.52% { transform: translate(25px,-32px); }
  16%,20.48% { transform: translate(30px,-20px); }
  24.96% { transform: translate(30px,0); }
  46.72% { transform: translate(-5px,-12px); }
  51.84% { transform: translate(0,0); }
}
@keyframes hand-right {
  0%,7.68%,28.8%,42.24%,100% { transform: translate(0,0); }
  14.08%,20.48% { transform: translate(-30px,-20px); }
  24.96% { transform: translate(-30px,0); }
  47.36%,50.56% { transform: translate(12px,-24px); }
  53.76% { transform: translate(6px,-12px); }
}
@keyframes robot-light {
  0%,28.16%,100% { fill: currentColor; }
  30.72%,35.84%,40.96%,46.08%,58.88% { fill: var(--green); }
  33.28%,38.4% { fill: var(--selected); }
}
@keyframes robot-digest {
  0%,28.16%,43.52%,100% { opacity: 0; }
  30.72%,40.96% { opacity: 1; }
}
@keyframes robot-scan {
  0%,29.44% { transform: translateX(0); }
  34.56% { transform: translateX(65px); }
  38.4% { transform: translateX(0); }
  42.24%,100% { transform: translateX(65px); }
}
@keyframes robot-check {
  0%,40.96%,100% { opacity: 0; }
  44.16%,94% { opacity: 1; }
}
@keyframes ticket-out {
  0%,43.52% { opacity: 0; transform: translateX(-20px) scaleX(.1); }
  46.72% { opacity: 1; transform: translateX(5px) scaleX(1); }
  50.56% { opacity: 1; transform: translate(var(--ticket-mid-x),var(--ticket-mid-y)) rotate(-6deg); }
  55.04%,100% { opacity: 0; transform: translate(var(--ticket-end-x),var(--ticket-end-y)) rotate(0); }
}
@keyframes extract-fields {
  0%,30.72% { opacity: 0; transform: translate(-10px,8px) scale(.8); }
  36.48%,43.52% { opacity: 1; transform: translate(0,-10px) scale(1); }
  50.56%,100% { opacity: 0; transform: translate(24px,-18px) scale(1); }
}
@keyframes result-out {
  0%,48.64% { opacity: 0; transform: translate(var(--result-x),var(--result-y)) scale(.65); }
  56.32% { opacity: 1; transform: translate(3px,-2px) scale(1.025); }
  60.16%,94% { opacity: 1; transform: translate(0,0) scale(1); }
  100% { opacity: 0; transform: translate(12px,0) scale(.98); }
}
@keyframes robot-ground {
  0%,29.44%,40.96%,53.76%,100% { transform: scaleX(1); }
  27.52%,44.8% { transform: scaleX(1.08); }
  48% { transform: scaleX(.86); }
}
@media(min-width:1500px) {
  .home-hero {
    padding-top: 65px;
  }
  .letter-journey {
    margin-top: 48px;
  }
}
@media(max-width:1000px) {
  .home-wrap {
    padding-inline: 28px;
  }
  .letter-journey {
    grid-template-columns: minmax(0,1fr) 160px minmax(0,1fr);
    gap: 10px;
  }
  .journey-input {
    padding-left: 0;
  }
  .journey-machine {
    width: 160px;
  }
  .journey-tokens {
    right: -35px;
    top: 92px;
  }
  .home-section {
    padding-block: 80px;
  }
  .sample-panel {
    gap: 40px;
  }
  .home-why-grid {
    gap: 44px;
  }
  .home-fit {
    gap: 44px;
  }
  .pricing-layout {
    gap: 36px;
  }
  .point-pack {
    grid-template-columns: 85px 1fr 80px;
    gap: 12px;
  }
  .home-privacy,.home-faq {
    gap: 28px;
  }
}
@media(max-width:760px) {
  .home-header-inner {
    height: 66px;
    gap: 18px;
  }
  .home-nav {
    gap: 16px;
  }
  .home-nav a:nth-child(2) {
    display: none;
  }
  .home-header-actions {
    gap: 16px;
  }
  .home-languages summary span {
    display: none;
  }
  .home-hero {
    padding-top: 40px;
  }
  .home-lede {
    font-size: 16px;
  }
  .letter-journey {
    grid-template-columns: minmax(0,1fr) 135px minmax(0,1fr);
    min-height: 280px;
  }
  .journey-machine {
    width: 135px;
  }
  .journey-tokens {
    top: 76px;
    right: -25px;
  }
  .journey-tokens span {
    font-size: 8px;
  }
  .sample-panel {
    gap: 30px;
  }
  .sample-source pre {
    padding: 22px;
    font-size: 12px;
  }
  .sample-facts {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .workflow-controls {
    gap: 18px;
  }
  .workflow-controls strong {
    font-size: 16px;
  }
  .workflow-controls button {
    gap: 9px;
  }
  .home-why-grid {
    gap: 28px;
  }
  .home-benefits h3 {
    font-size: 22px;
  }
  .pricing-layout {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .weekly-free {
    max-width: 460px;
  }
  .weekly-free>strong {
    max-width: none;
  }
  .point-pack {
    grid-template-columns: 110px 1fr 90px;
  }
  .home-footer {
    grid-template-columns: 1fr 1fr;
    gap: 30px;
  }
  .home-footer-legal {
    grid-column: 1/-1;
  }
}
@media(max-width:640px) {
  .home-wrap {
    padding-inline: 22px;
  }
  .home-brand {
    font-size: 20px;
    gap: 6px;
  }
  .home-brand img {
    width: 25px;
    height: auto;
  }
  .home-nav {
    display: none;
  }
  .home-header-actions {
    gap: 18px;
  }
  .home-login {
    font-size: 13px;
  }
  .home-hero {
    padding-top: 34px;
    padding-bottom: 24px;
  }
  .home-eyebrow {
    font-size: 10px;
    letter-spacing: .09em;
  }
  .home-hero h1 {
    font-size: clamp(30px,8.3vw,45px);
    margin-top: 18px;
    line-height: 1.1;
  }
  .home-hero h1 span {
    font-size: clamp(24px,7.1vw,30px);
    padding-inline: 8px;
  }
  .home-lede {
    font-size: 15px;
    line-height: 1.7;
    margin-top: 18px;
    max-width: 340px;
  }
  .home-hero-actions {
    flex-direction: column;
    gap: 8px;
    margin-top: 22px;
  }
  .home-button {
    min-height: 50px;
  }
  .home-free-note {
    font-size: 11px;
    max-width: 300px;
  }
  .letter-journey {
    --ticket-mid-x: -45px;
    --ticket-mid-y: 70px;
    --ticket-end-x: -77px;
    --ticket-end-y: 140px;
    --result-x: 0px;
    --result-y: -50px;
    grid-template-columns: minmax(0,1fr);
    gap: 16px;
    min-height: 0;
    margin-top: 32px;
  }
  .letter-journey:before {
    display: none;
  }
  .journey-input {
    max-width: 170px;
  }
  .journey-source-frame {
    height: 180px;
    width: 150px;
  }
  .journey-source-image {
    max-width: 130px;
  }
  .journey-input figcaption {
    font-size: 9px;
  }
  .journey-screen {
    padding: 22px 16px 60px;
  }
  .journey-complete {
    min-height: 44px;
  }
  .journey-note summary {
    min-height: 44px;
  }
  .journey-note textarea {
    font-size: 16px;
  }
  .journey-screen .screen-expand {
    width: 44px;
    height: 44px;
  }
  .journey-machine {
    width: 160px;
    margin-top: 0;
    transform: none;
  }
  .journey-tokens {
    top: 108px;
    right: -24px;
  }
  .journey-tokens span {
    font-size: 9px;
    padding: 3px 10px;
  }
  .journey-result .journey-label {
    font-size: 8px;
  }
  .journey-result figcaption {
    font-size: 10px;
    max-width: 210px;
  }
  .journey-result {
    max-width: 360px;
    justify-self: center;
  }
  .journey-caption {
    align-items: flex-start;
    gap: 18px;
    margin-top: 18px;
    text-align: left;
    font-size: 9px;
  }
  .journey-caption>span {
    max-width: 170px;
  }
  .journey-caption button {
    padding: 0;
    min-height: 44px;
    align-items: flex-start;
    font-size: 9px;
    line-height: 1.6;
  }
  .journey-caption svg {
    width: 12px;
    height: 12px;
    margin-top: 2px;
    flex-shrink: 0;
  }
  .home-section {
    padding-block: 60px;
  }
  .home-section-heading {
    margin-bottom: 30px;
  }
  h2 {
    font-size: 34px;
    line-height: 1.17;
  }
  .home-section-heading>p:last-child {
    font-size: 14px;
    margin-top: 16px;
  }
  .sample-controls {
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    justify-content: space-between;
  }
  .sample-controls button {
    font-size: 12px;
    min-height: 64px;
    padding: 10px;
    line-height: 1.4;
  }
  .sample-controls button span {
    display: block;
    font-size: 9px;
    margin-bottom: 4px;
  }
  .sample-panel {
    grid-template-columns: 1fr;
    gap: 26px;
    padding-top: 26px;
  }
  .sample-source {
    max-width: none;
  }
  .sample-source pre {
    font-size: 12px;
    padding: 22px;
    line-height: 1.7;
  }
  .sample-answer {
    padding-top: 0;
  }
  .sample-answer h3 {
    font-size: 29px;
  }
  .sample-facts {
    grid-template-columns: 1fr 1fr;
    margin: 22px 0;
    padding: 18px 0;
  }
  .sample-facts dd {
    font-size: 16px;
  }
  .sample-answer>p:not(.home-eyebrow) {
    font-size: 14px;
  }
  .home-caption {
    font-size: 11px;
  }
  .demo-footnote {
    margin-top: 24px;
  }
  .workflow-controls {
    grid-template-columns: 1fr;
    gap: 14px;
    margin-bottom: 26px;
  }
  .workflow-controls button {
    gap: 14px;
    padding: 16px;
    border: 2px solid var(--ink);
    min-height: 80px;
  }
  .workflow-controls [aria-pressed=true] {
    border-color: var(--ink);
  }
  .workflow-controls strong {
    font-size: 18px;
    margin-bottom: 6px;
  }
  .workflow-controls button>span:last-child>span {
    font-size: 12px;
    line-height: 1.6;
  }
  .workflow-screen {
    max-width: 390px;
    margin: auto;
  }
  .workflow-screen img {
    aspect-ratio: 390/844;
    object-fit: contain;
  }
  .workflow-screen .screen-expand {
    opacity: 1;
  }
  .home-why-intro h2 {
    font-size: 34px;
  }
  .home-why-intro>p:last-child {
    font-size: 14px;
    margin-top: 18px;
  }
  .home-why-grid {
    grid-template-columns: 1fr;
    gap: 26px;
    margin-top: 34px;
  }
  .home-benefits article {
    padding: 20px 0 24px;
  }
  .home-benefits h3 {
    font-size: 24px;
  }
  .home-benefits p {
    font-size: 14px;
  }
  .history-screen {
    max-width: 450px;
  }
  .home-fit {
    display: block;
    margin-top: 30px;
    padding-top: 24px;
  }
  .home-fit h3 {
    width: auto;
    font-size: 26px;
    margin-bottom: 14px;
  }
  .pricing-layout {
    padding-top: 26px;
  }
  .weekly-free h3 {
    font-size: 48px;
  }
  .point-pack {
    grid-template-columns: minmax(0,1fr) 75px;
    gap: 10px 12px;
    padding-block: 18px;
  }
  .point-pack strong {
    font-size: 14px;
  }
  .point-pack p {
    font-size: 12px;
    line-height: 1.5;
  }
  .point-pack .pack-value {
    grid-column: 1 / -1;
    grid-row: 2;
  }
  .pack-price {
    grid-column: 2;
    grid-row: 1;
  }
  .pack-price strong {
    font-size: 19px;
  }
  .point-explainer {
    font-size: 13px;
    margin-top: 28px;
  }
  .point-explainer ul {
    padding-left: 20px;
  }
  .home-privacy {
    display: block;
    padding: 28px 0;
  }
  .home-privacy h3 {
    font-size: 26px;
    margin-bottom: 16px;
  }
  .home-privacy p {
    font-size: 13px;
  }
  .home-privacy .home-text-link {
    margin-top: 12px;
  }
  .home-faq {
    display: block;
    padding-top: 30px;
  }
  .home-faq h3 {
    margin-bottom: 28px;
  }
  .home-faq summary {
    font-size: 14px;
  }
  .home-faq details p {
    font-size: 13px;
  }
  .home-final {
    padding-block: 50px;
  }
  .home-final h2 {
    font-size: 42px;
  }
  .home-final>.home-wrap>p {
    font-size: 14px;
  }
  .home-footer {
    display: block;
    padding-block: 34px;
  }
  .home-footer-resources {
    margin-top: 30px;
  }
  .home-footer-legal {
    margin-top: 24px;
  }
  .app-preview {
    width: calc(100vw - 20px);
    padding: 12px;
    max-height: calc(100dvh - 20px);
  }
  .preview-toolbar {
    gap: 8px;
  }
  .preview-toolbar h2 {
    font-size: 13px;
  }
  .preview-toolbar button {
    font-size: 12px;
  }
  .app-preview>img[src*="app-captures"] {
    min-width: 960px;
  }
  .app-preview>p {
    font-size: 10px;
  }
  .screen-expand {
    opacity: 1;
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior: auto;
  }
  *,*:before,*:after {
    animation: none!important;
    transition: none!important;
  }
  [data-motion-toggle],.robot-letter,.robot-ticket,.journey-tokens {
    display: none;
  }
  .home-reveal {
    opacity: 1;
    transform: none;
  }
  .journey-result {
    opacity: 1!important;
    transform: none!important;
  }
}
