/* ZHIYI / THE SHAPE OF MEANING
   Three materials: ink, paper, silver. No downloaded fonts or runtime libraries. */
:root {
  --ink: #080808;
  --ink-2: #131313;
  --paper: #ffffff;
  --evidence: #f6f5f1;
  --paper-deep: #e8e8e8;
  --white: #ffffff;
  --silver: #c3c3c3;
  --dark-muted: #adadad;
  --light-muted: #606060;
  --hair: rgba(255,255,255,.18);
  --sans: "Inter","Helvetica Neue",Arial,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
  --serif: "Songti SC","Noto Serif CJK SC","STSong","SimSun",serif;
  --mono: "SFMono-Regular",Consolas,"Liberation Mono",monospace;
  --pad: clamp(24px,5.6vw,96px);
  --ease: cubic-bezier(.16,1,.3,1);
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 90px;
}
body {
  margin: 0;
  background: var(--ink);
  color: var(--white);
  font: 15px/1.7 var(--sans);
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
h1,h2,h3,h4,p {
  margin: 0;
}
h1,h2,h3,h4 {
  line-height: 1.25;
  font-weight: 500;
  letter-spacing: -.055em;
}
button,input {
  font: inherit;
}
button,a {
  -webkit-tap-highlight-color: transparent;
}
button {
  background: none;
  border: 0;
  color: inherit;
  cursor: pointer;
}
button:disabled {
  cursor: default;
}
a {
  color: inherit;
  text-decoration: none;
}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 5px;
}
button svg,a svg {
  width: 19px;
  height: 19px;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.35;
  stroke-linecap: round;
  stroke-linejoin: round;
}
img {
  display: block;
  max-width: 100%;
}
svg {
  display: block;
}
.icon-sprite {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}
[hidden] {
  display: none !important;
}
::selection {
  background: #b5b5b5;
  color: #080808;
}
.serif {
  font-family: var(--serif);
  font-weight: 400;
}
.mono,small {
  font-family: var(--mono);
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
}
.skip {
  position: fixed;
  z-index: 300;
  left: 20px;
  top: -80px;
  background: var(--paper);
  color: var(--ink);
  padding: 13px 20px;
}
.skip:focus {
  top: 10px;
}
.section {
  padding: 0 var(--pad);
}
.light {
  background: var(--paper);
  color: var(--ink);
  --hair: rgba(8,8,8,.2);
}
.dark {
  background: var(--ink);
  color: var(--white);
  --hair: rgba(255,255,255,.18);
}
.eyebrow {
  font-size: 11px;
  letter-spacing: .16em;
  display: flex;
  align-items: center;
  gap: 12px;
}
.button {
  min-height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 37px;
  padding: 15px 24px;
  font-size: 13px;
  font-weight: 500;
  border: 1px solid transparent;
  transition: transform .5s var(--ease),background .3s,box-shadow .5s;
}
.button:hover {
  transform: translateY(-3px);
}
.button svg {
  transition: transform .5s var(--ease);
}
.button:hover svg {
  transform: translate(2px,-2px);
}
.button.white {
  color: var(--ink);
  background: var(--white);
  box-shadow: inset 0 1px 0 #ffffff,0 8px 25px #00000011;
}
.button.white:hover {
  background: #ffffff;
  box-shadow: 0 12px 40px #ffffff0d;
}
.button.black {
  color: var(--white);
  background: var(--ink);
}
.button.black:hover {
  background: #272727;
}
.text-link {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  font-size: 12px;
  padding: 12px 0;
  min-height: 45px;
  border-bottom: 1px solid currentColor;
}
.text-link:hover svg {
  transform: translate(2px,-2px);
}
.text-link svg {
  transition: .3s;
}
.chapter-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 15px;
  padding: 25px 0;
  border-top: 1px solid var(--hair);
  font-size: 11px;
  letter-spacing: .1em;
}
.chapter-line b {
  font: 10px var(--mono);
  margin-right: 19px;
  opacity: .6;
}
.chapter-line small {
  font-size: 9px;
  letter-spacing: .14em;
  opacity: .6;
}
.section-note {
  font-size: 10px;
  color: var(--light-muted);
  margin-top: 24px;
  line-height: 1.9;
}
.dark .section-note {
  color: #a2a2a2;
}
.quiet-note {
  font-size: 11px;
  line-height: 1.9;
  color: var(--light-muted);
}
.section-heading {
  padding: 65px 0 53px;
  display: flex;
  justify-content: space-between;
  gap: 50px;
  align-items: flex-end;
}
.section-heading h2 {
  font-size: clamp(44px,5.5vw,80px);
  line-height: 1.2;
  letter-spacing: -.065em;
}
.heading-copy {
  padding: 0 5% 7px 0;
}
.heading-copy p {
  font-size: 14px;
  line-height: 1.9;
  color: var(--light-muted);
}
.reveal {
  opacity: 1;
}
.js .reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 1s var(--ease),transform 1.2s var(--ease);
}
.js .reveal.visible {
  opacity: 1;
  transform: translateY(0);
}
/* Header is restrained, but never illegible. */
.site-header {
  height: 80px;
  position: fixed;
  inset: 0 0 auto;
  z-index: 90;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 26px;
  padding: 0 var(--pad);
  background: #080808db;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-bottom: 1px solid #ffffff22;
  color: var(--white);
  transition: background .35s,color .35s,border .35s;
}
.site-header.is-light {
  background: #ffffffed;
  color: var(--ink);
  border-bottom-color: #08080822;
}
.brand {
  display: flex;
  align-items: center;
  gap: 12px;
  white-space: nowrap;
}
.brand img {
  width: 31px;
  height: 31px;
}
.brand>span {
  font-size: 22px;
  letter-spacing: .09em;
}
.brand small {
  font-size: 9px;
  letter-spacing: .2em;
  margin-left: 8px;
  color: #b8b8b8;
}
.is-light .brand small {
  color: #5d5d5d;
}
.desktop-nav {
  display: flex;
  gap: 28px;
  align-items: center;
  margin-left: 30px;
}
.desktop-nav a {
  font-size: 11px;
  opacity: .75;
  padding: 20px 0;
  transition: opacity .2s;
}
.desktop-nav a:hover {
  opacity: 1;
}
.header-actions {
  display: flex;
  gap: 22px;
  align-items: center;
}
.motion-button {
  width: 34px;
  min-height: 44px;
  font: 15px var(--mono);
  color: inherit;
  opacity: .7;
}
.motion-button:hover {
  opacity: 1;
}
.header-cta {
  border: 1px solid #7e7e7e;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  font-size: 11px;
  min-height: 38px;
  padding: 9px 14px;
}
.header-cta svg {
  width: 13px;
  height: 13px;
}
.header-cta:hover {
  background: #88888822;
}
.read-progress {
  height: 1px;
  background: currentColor;
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  transform: scaleX(0);
  transform-origin: left;
  opacity: .8;
}
.menu-button {
  display: none;
}
.mobile-nav {
  position: fixed;
  inset: 68px 0 0;
  z-index: 85;
  background: var(--ink);
  padding: 35px var(--pad) 50px;
}
.mobile-nav a {
  font-size: 30px;
  display: flex;
  align-items: center;
  border-bottom: 1px solid #ffffff22;
  gap: 20px;
  padding: 18px 0;
}
.mobile-nav a small {
  font-size: 10px;
  color: #999999;
}
.mobile-nav a span {
  margin-left: auto;
  font-size: 23px;
}
.mobile-nav p {
  margin-top: 30px;
  font: 20px var(--serif);
  color: #a8a8a8;
}
.menu-open {
  overflow: hidden;
}
/* A brief opening iris; never used to conceal loading or inflate time. */
.opening {
  display: none;
  pointer-events: none;
}
.js .booting .opening {
  display: flex;
  position: fixed;
  inset: 0;
  z-index: 200;
  background: var(--ink);
  align-items: center;
  justify-content: center;
  clip-path: inset(0);
  animation: openCurtain .9s .35s var(--ease) forwards;
}
.opening-word {
  font: 54px var(--sans);
  letter-spacing: .22em;
  display: flex;
  align-items: center;
  gap: 10px;
}
.opening-word>span {
  font: 55px var(--serif);
}
.opening-word small {
  font-size: 10px;
  letter-spacing: .25em;
  margin-left: 22px;
  color: #b3b3b3;
}
.opening-line {
  position: absolute;
  top: calc(50% + 67px);
  height: 1px;
  background: #bfbfbf;
  width: 200px;
  transform: scaleX(0);
  transform-origin: left;
  animation: openingLine .5s var(--ease) forwards;
}
@keyframes openCurtain {
  to {
    clip-path: inset(0 0 100% 0);
    visibility: hidden;
  }
}
@keyframes openingLine {
  to {
    transform: scaleX(1);
  }
}
/* The paper sculpture is the signature, not a decorative background. */
.hero-track {
  position: relative;
  height: 250svh;
  background: var(--ink);
}
.hero-sticky {
  height: 100svh;
  min-height: 690px;
  position: sticky;
  top: 0;
  overflow: hidden;
  isolation: isolate;
}
.hero-grid {
  position: absolute;
  inset: 80px var(--pad) 85px;
  background: linear-gradient(90deg,#dfdfdf08 1px,transparent 1px);
  background-size: calc(100% / 8) 100%;
  mask-image: linear-gradient(0deg,transparent,#00000088 30%,#00000066 75%,transparent);
  pointer-events: none;
}
.hero-ghost {
  position: absolute;
  font: 600 min(51vw,820px)/1 var(--serif);
  color: transparent;
  -webkit-text-stroke: 1px #d9d9d912;
  right: 4%;
  top: 13%;
  user-select: none;
  z-index: -1;
  opacity: .6;
}
.hero-sticky canvas {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}
.hero-shade {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
  background: linear-gradient(90deg,#080808 1%,#080808eb 21%,#08080845 42%,transparent 64%),linear-gradient(0deg,#080808 1%,transparent 18%,transparent 83%,#08080890);
}
.orbit-engraving {
  position: absolute;
  top: 15%;
  left: 47%;
  right: -2%;
  bottom: 14%;
  border: 1px solid #c6c6c622;
  border-radius: 50%;
  transform: rotate(-29deg);
  z-index: 0;
  pointer-events: none;
}
.orbit-engraving:before,.orbit-engraving:after {
  content: "";
  position: absolute;
  inset: 30px;
  border: 1px solid #c4c4c411;
  border-radius: 50%;
}
.orbit-engraving:after {
  inset: -37px;
  border-style: dashed;
  opacity: .4;
}
.orbit-engraving i {
  position: absolute;
  top: 49%;
  left: -3px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #d7d7d7;
}
.orbit-engraving i+ i {
  left: auto;
  right: -3px;
}
.orbit-engraving>span {
  position: absolute;
  left: 50%;
  bottom: -33px;
  transform: translateX(-50%);
  font: 8px var(--mono);
  letter-spacing: .2em;
  color: #747474;
  white-space: nowrap;
}
.hero-copy {
  position: absolute;
  left: var(--pad);
  top: 50%;
  transform: translateY(-49%);
  max-width: 52%;
  z-index: 4;
  pointer-events: none;
}
.hero-copy a,.hero-copy button {
  pointer-events: auto;
}
.hero-copy .eyebrow {
  font-size: 11px;
  color: #b9b9b9;
  letter-spacing: .12em;
  margin-bottom: 32px;
}
.tiny-cross {
  font-size: 22px;
  line-height: 1;
  margin-right: 2px;
  color: #efefef;
}
.hero-copy h1 {
  font-size: clamp(62px,7.15vw,108px);
  line-height: 1.24;
  letter-spacing: -.075em;
  font-weight: 560;
}
.hero-copy h1 .serif {
  font-size: 1.06em;
  letter-spacing: -.08em;
}
.hero-copy h1>br+.serif {
  color: var(--paper);
}
.hero-description {
  font-size: 14px;
  color: #b8b8b8;
  line-height: 1.95;
  margin-top: 27px;
  letter-spacing: .03em;
}
.hero-actions {
  display: flex;
  align-items: center;
  gap: 25px;
  margin-top: 30px;
}
.hero-platform {
  font: 9px/1.8 var(--mono);
  color: #d9d9d9;
}
.hero-platform b {
  font: 9px/1.8 var(--sans);
  font-weight: 400;
  color: #929292;
}
.hero-second {
  opacity: 0;
  visibility: hidden;
  max-width: 50%;
}
.hero-second h2 {
  font-size: clamp(55px,6.3vw,92px);
  line-height: 1.25;
}
.hero-small-note {
  display: flex;
  gap: 18px;
  margin-top: 33px;
  font-size: 10px;
  letter-spacing: .06em;
}
.hero-small-note span+span {
  color: #b4b4b4;
}
.hero-extract {
  position: absolute;
  z-index: 3;
  left: 65%;
  top: 67%;
  display: flex;
  gap: 14px;
  align-items: center;
  background: linear-gradient(130deg,#f4f4f4,#cccccc);
  color: #131313;
  box-shadow: 0 20px 70px #00000099,inset 0 1px 0 #ffffff;
  padding: 15px 22px;
  border: 1px solid #ebebebb0;
  min-width: 211px;
  transform: rotate(-4deg);
  pointer-events: none;
}
.hero-extract small {
  font: 9px var(--sans);
  color: #505050;
}
.hero-extract strong {
  display: block;
  font: 36px/1.5 var(--sans);
  letter-spacing: -.06em;
}
.hero-extract strong span {
  font-size: 21px;
  color: #656565;
}
.extract-cross {
  align-self: flex-start;
  font: 13px var(--mono);
  color: #6e6e6e;
}
.extract-line {
  position: absolute;
  right: 100%;
  top: 50%;
  width: 48px;
  height: 1px;
  background: #cdcdcd80;
}
.hero-result {
  position: absolute;
  z-index: 4;
  right: var(--pad);
  width: 45%;
  top: 50%;
  max-width: 690px;
  opacity: 0;
  visibility: hidden;
  background: var(--paper);
  padding: 23px 27px 20px;
  color: var(--ink);
  box-shadow: 0 35px 110px #00000099,0 1px 0 #ffffff inset;
  transform: translateY(-40%);
  border: 1px solid #ffffff88;
  pointer-events: none;
}
.result-cover {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #111111;
  padding-bottom: 22px;
  margin-bottom: 3px;
}
.result-cover>span {
  font: 22px var(--serif);
}
.result-cover small {
  font-size: 8px;
  color: #767676;
  letter-spacing: .04em;
}
.hero-table-head,.hero-table-row {
  display: grid;
  grid-template-columns: .9fr 1.15fr .8fr .8fr;
  gap: 12px;
  padding: 15px 0;
  border-bottom: 1px solid #11111122;
  font-size: 12px;
}
.hero-table-head {
  font-size: 10px;
  color: #767676;
  padding: 14px 0;
}
.hero-table-head>:last-child,.hero-table-row>:last-child {
  text-align: right;
}
.hero-table-row>:first-child {
  color: #757575;
  font-size: 9px;
  display: flex;
  align-items: center;
  gap: 7px;
}
.hero-table-row>:first-child:before {
  content: "";
  width: 7px;
  height: 9px;
  border: 1px solid #949494;
  display: block;
}
.hero-table-row>:last-child {
  font-family: var(--mono);
  font-size: 12px;
}
.hero-table-foot {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: 8px;
  color: #6b6b6b;
  margin-top: 21px;
}
.hero-footer {
  position: absolute;
  bottom: 26px;
  left: var(--pad);
  right: var(--pad);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  z-index: 5;
}
.scroll-cue {
  display: flex;
  gap: 18px;
  align-items: center;
  font-size: 10px;
  color: #d3d3d3;
}
.scroll-cue svg {
  width: 21px;
  height: 36px;
  animation: scrollHint 3s ease-in-out infinite;
}
.scroll-cue small {
  font: 7px var(--mono);
  letter-spacing: .12em;
  display: block;
  color: #868686;
  margin-top: 4px;
}
.hero-steps {
  display: flex;
  align-items: center;
  gap: 14px;
  font: 8px var(--mono);
  color: #727272;
}
.hero-steps i {
  width: 36px;
  height: 1px;
  background: #7f7f7f40;
}
.hero-steps span {
  transition: color .3s;
}
.hero-steps span.active {
  color: var(--paper);
}
.hero-version {
  font-size: 8px;
  letter-spacing: .08em;
  color: #8d8d8d;
}
@keyframes scrollHint {
  0%,100% {
    transform: translateY(-3px);
  }
  50% {
    transform: translateY(4px);
  }
}
.paper-fallback {
  position: absolute;
  inset: 0;
  z-index: 1;
  perspective: 1100px;
  perspective-origin: 70% 50%;
  overflow: hidden;
}
.fallback-paper {
  position: absolute;
  backface-visibility: visible;
  box-shadow: 3px 8px 18px #000000aa;
  transform-style: preserve-3d;
  will-change: transform;
}
.format-strip {
  padding: 31px var(--pad);
  display: flex;
  gap: 30px;
  justify-content: space-between;
  align-items: center;
  color: var(--ink);
  background: var(--paper);
  border-bottom: 1px solid #08080822;
  font-size: 12px;
}
.format-strip>div {
  display: flex;
  gap: 22px;
  align-items: center;
}
.format-strip b {
  font: 10px var(--mono);
  color: #686868;
  letter-spacing: .06em;
}
.format-strip strong {
  font-size: 12px;
  font-weight: 400;
}
.format-strip>div>span {
  font-size: 22px;
  margin: 0 7px;
}
/* Read what matters: a real-looking source, and an unmistakable answer. */
.understand {
  padding-top: 30px;
  padding-bottom: 58px;
  position: relative;
}
.mode-switch {
  display: flex;
  gap: 0;
  border: 1px solid #08080840;
  margin-top: 27px;
  max-width: 260px;
}
.mode-switch button {
  font-size: 11px;
  min-height: 43px;
  padding: 10px 17px;
  flex: 1;
  white-space: nowrap;
}
.mode-switch .active {
  background: var(--ink);
  color: var(--paper);
}
.mode-switch button span {
  margin-left: 10px;
}
.meaning-stage {
  position: relative;
  display: grid;
  grid-template-columns: 1.04fr 1fr;
  gap: 15%;
  padding: 0 6% 0 3%;
  align-items: center;
  min-height: 585px;
}
.source-side {
  min-width: 0;
}
.source-rail {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #2121211f;
  gap: 10px;
  margin-bottom: 27px;
}
.source-rail button {
  min-height: 49px;
  padding: 7px 2px;
  font-size: 11px;
  color: #707070;
  border-bottom: 1px solid transparent;
  white-space: nowrap;
}
.source-rail button.active {
  border-color: var(--ink);
  color: var(--ink);
}
.source-rail small {
  font-size: 7px;
  margin-left: 5px;
  color: #797979;
}
.source-stack {
  position: relative;
  perspective: 1400px;
  max-width: 470px;
  margin: 0 auto;
}
.paper-back {
  position: absolute;
  inset: 0 8px 3px -5px;
  transform: rotate(-4deg);
  background: #dedede;
  border: 1px solid #d5d5d5;
  box-shadow: 0 9px 20px #1616160c;
}
.source-paper {
  position: relative;
  min-height: 410px;
  padding: 28px 30px;
  background: #fbfbfb;
  box-shadow: 0 18px 50px #2c2c2c16;
  transform: rotate(1.2deg);
  font-size: 12px;
  border: 1px solid #ffffff88;
  transition: transform .6s var(--ease);
}
.source-paper:hover {
  transform: rotate(0);
}
.source-paper .doc-top {
  font: 8px var(--mono);
  color: #7c7c7c;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 25px;
  letter-spacing: .08em;
}
.source-paper h4 {
  font-size: 25px;
  letter-spacing: -.06em;
  font-weight: 550;
  margin-bottom: 4px;
}
.doc-sub {
  font-size: 9px;
  color: #8b8b8b;
  line-height: 1.7;
  padding-bottom: 20px;
  border-bottom: 1px solid #171717;
}
.doc-field {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin: 16px 0;
  color: #535353;
  font-size: 11px;
}
.doc-field b {
  font-weight: 400;
  color: #232323;
}
.doc-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 15px;
  margin: 21px 0;
  padding-bottom: 16px;
  border-bottom: 1px solid #bebebe44;
}
.doc-item>div {
  display: flex;
  align-items: center;
  gap: 12px;
}
.item-image {
  width: 43px;
  height: 46px;
  display: grid;
  place-items: center;
  background: #e7e7e7;
  font: 26px var(--serif);
  color: #5a5a5a;
}
.doc-item p {
  font-size: 12px;
}
.doc-item p small {
  font: 9px var(--sans);
  display: block;
  color: #868686;
  margin-top: 4px;
}
.doc-item>b {
  font: 13px var(--mono);
}
.doc-price {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 12px;
  font-size: 11px;
}
.doc-price>span {
  color: #6e6e6e;
}
.doc-price b {
  font-family: var(--mono);
  font-size: 12px;
  font-weight: 400;
}
.doc-price.total {
  margin-top: 17px;
  padding-top: 17px;
  border-top: 1px solid #35353540;
}
.doc-price.total span {
  color: var(--ink);
  font-weight: 600;
}
.doc-price.total b {
  font: 25px var(--sans);
  font-weight: 550;
  letter-spacing: -.04em;
}
.doc-highlight {
  position: relative;
  outline: 1px solid transparent;
  outline-offset: 5px;
  transition: background .3s,outline-color .3s;
}
.doc-highlight.highlighted {
  background: #d7d7d7;
  outline-color: #7b7b7b;
}
.receipt-paper {
  font-family: var(--mono);
  padding-left: 37px;
  padding-right: 37px;
  max-width: 370px;
  margin: 0 auto;
  clip-path: polygon(0 0,100% 0,100% 98.5%,97% 100%,94% 98.5%,91% 100%,88% 98.5%,85% 100%,82% 98.5%,79% 100%,76% 98.5%,73% 100%,70% 98.5%,67% 100%,64% 98.5%,61% 100%,58% 98.5%,55% 100%,52% 98.5%,49% 100%,46% 98.5%,43% 100%,40% 98.5%,37% 100%,34% 98.5%,31% 100%,28% 98.5%,25% 100%,22% 98.5%,19% 100%,16% 98.5%,13% 100%,10% 98.5%,7% 100%,4% 98.5%,0 100%);
}
.receipt-paper h4,.receipt-paper .doc-sub {
  text-align: center;
}
.receipt-paper .doc-sub {
  border-bottom-style: dashed;
}
.record-paper h4 {
  font-family: var(--serif);
  font-size: 27px;
  text-align: center;
  letter-spacing: .1em;
}
.record-paper table {
  border-collapse: collapse;
  width: 100%;
  margin: 24px 0;
  font-size: 11px;
}
.record-paper td,.record-paper th {
  padding: 12px 9px;
  border: 1px solid #acacac;
  text-align: left;
  font-weight: 400;
}
.record-paper th {
  background: #e7e7e7;
  font-size: 10px;
}
.source-meta {
  display: flex;
  justify-content: space-between;
  font: 8px var(--mono);
  color: #727272;
  margin-top: 26px;
  padding: 0 5px;
}
.source-meta>:last-child {
  font-family: var(--sans);
}
.meaning-output {
  position: relative;
  min-width: 0;
  z-index: 2;
}
.output-caption {
  display: flex;
  align-items: center;
  gap: 24px;
  font-size: 10px;
  letter-spacing: .1em;
  margin-bottom: 20px;
  color: #6f6f6f;
}
.output-caption small {
  font-family: var(--sans);
}
.intent-corner {
  font-size: 23px;
  line-height: 1;
  flex: 1;
  text-align: right;
  color: #424242;
}
.meaning-output h3 {
  font-size: clamp(29px,3.2vw,49px);
  line-height: 1.35;
}
.answer-number {
  font: 500 clamp(66px,8.6vw,130px)/1.12 var(--sans);
  letter-spacing: -.07em;
  white-space: nowrap;
  margin: 30px 0 8px;
}
.answer-number>span {
  font: 400 .34em var(--sans);
  vertical-align: top;
  display: inline-block;
  margin: 16px 9px 0 0;
  color: #6f6f6f;
}
.answer-number b {
  font-weight: 500;
}
.answer-number small {
  font: 400 .46em var(--sans);
  color: #878787;
}
.answer-rule {
  font: 11px var(--mono);
  color: #787878;
  letter-spacing: .06em;
  margin: 10px 0 24px;
}
.meaning-fields {
  border-top: 1px solid #2b2b2b20;
  display: flex;
  gap: 26px;
  flex-wrap: wrap;
}
.meaning-fields button {
  padding: 15px 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
  align-items: flex-start;
  font-size: 12px;
}
.meaning-fields button small {
  font: 9px var(--sans);
  color: #757575;
}
.meaning-fields button.active {
  border-bottom: 1px solid #3f3f3f;
}
.meaning-explanation {
  font-size: 12px;
  line-height: 1.9;
  color: #5e5e5e;
  margin-top: 17px;
}
.literal-output {
  background: #e8e8e8;
  padding: 18px;
  border-left: 2px solid #787878;
  margin-top: 21px;
  font: 11px/2.1 var(--mono);
  white-space: pre-line;
}
.literal .answer-number,.literal .answer-rule,.literal .meaning-fields {
  display: none;
}
.literal .meaning-explanation {
  margin-top: 21px;
}
.literal .meaning-output h3 {
  font-size: 35px;
}
.meaning-bridge {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 5;
  overflow: visible;
}
.bridge-line {
  fill: none;
  stroke: #747474;
  stroke-width: 1;
  stroke-dasharray: 3 6;
  opacity: .65;
  animation: lineStream 20s linear infinite;
}
.bridge-dot {
  fill: #323232;
}
.semantic-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  border-top: 1px solid #1c1c1c30;
  padding-top: 37px;
  margin-top: 55px;
}
.semantic-bottom>div:first-child {
  font-size: 26px;
  letter-spacing: -.035em;
}
.semantic-bottom strong {
  font-family: var(--serif);
  font-weight: 400;
  margin-left: 8px;
}
.word-equivalence {
  display: flex;
  align-items: center;
  gap: 18px;
  font-size: 12px;
}
.word-equivalence>span {
  font-size: 11px;
  color: #686868;
  border-bottom: 1px solid #70707055;
  padding-bottom: 5px;
}
.word-equivalence i {
  font-style: normal;
  font-size: 25px;
  margin: 0 14px;
  color: #888888;
}
.word-equivalence b {
  font-weight: 500;
}
@keyframes lineStream {
  to {
    stroke-dashoffset: -180;
  }
}
/* Intention: three distinct materials, one continuous frame. */
.intention {
  padding-top: 31px;
  padding-bottom: 46px;
  background: radial-gradient(ellipse at 52% 61%,#242424 0,#121212 38%,#080808 70%);
}
.intention-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 40px;
  padding: 67px 0 54px;
}
.intention-heading h2 {
  font-size: clamp(44px,5.6vw,83px);
  line-height: 1.25;
}
.intention-heading .eyebrow {
  color: #b4b4b4;
  margin-bottom: 23px;
}
.intention-heading>p {
  font-size: 13px;
  color: #b0b0b0;
  line-height: 2;
  padding: 0 5% 9px 0;
}
.intention-heading>p strong {
  font-weight: 400;
  color: #e9e9e9;
}
.intent-tabs {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  border-top: 1px solid #ffffff33;
  border-bottom: 1px solid #ffffff22;
}
.intent-tabs button {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 9px;
  align-items: center;
  padding: 24px 27px;
  text-align: left;
  color: #8b8b8b;
  border-right: 1px solid #ffffff22;
  transition: background .4s,color .4s;
  position: relative;
}
.intent-tabs button:first-child {
  padding-left: 0;
}
.intent-tabs button:last-child {
  border-right: 0;
}
.intent-tabs button:after {
  content: "";
  height: 2px;
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  background: var(--paper);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .5s var(--ease);
}
.intent-tabs button.active:after {
  transform: scaleX(1);
}
.intent-tabs small {
  grid-column: 1;
  font-size: 8px;
  letter-spacing: .12em;
}
.intent-tabs span {
  font-size: 22px;
  letter-spacing: -.02em;
}
.intent-tabs b {
  grid-column: 2;
  grid-row: 1/3;
  font-weight: 400;
  font-size: 24px;
}
.intent-tabs button.active {
  color: var(--paper);
}
.intent-tabs button:hover {
  background: #fff03;
}
.intent-stage {
  position: relative;
  min-height: 525px;
  display: grid;
  grid-template-columns: 1fr 100px 1fr;
  align-items: center;
  padding: 65px 9% 50px;
  perspective: 1800px;
  isolation: isolate;
}
.intent-blueprint {
  position: absolute;
  inset: 42px 0 10px;
  z-index: -1;
  background-image: linear-gradient(#fff05 1px,transparent 1px),linear-gradient(90deg,#fff05 1px,transparent 1px);
  background-size: 38px 38px;
  transform: perspective(900px) rotateX(53deg) rotateZ(-12deg) scale(1.1);
  mask-image: radial-gradient(ellipse,#000000aa,transparent 65%);
  pointer-events: none;
}
.intent-input {
  transform: rotateY(9deg) rotateZ(-5deg);
  transform-origin: right center;
  min-width: 0;
  position: relative;
}
.intent-source {
  background: var(--paper);
  color: #1c1c1c;
  box-shadow: 0 24px 70px #00000099;
  border: 1px solid #ffffffe0;
  padding: 27px 29px;
  min-height: 318px;
  position: relative;
}
.intent-source:before {
  content: "";
  position: absolute;
  inset: 8px 8px -8px -8px;
  background: #cacaca;
  z-index: -1;
  transform: rotate(-4deg);
  box-shadow: 0 15px 30px #00000055;
}
.intent-source>small {
  display: block;
  font-size: 8px;
  color: #797979;
  letter-spacing: .08em;
  margin-bottom: 24px;
}
.intent-source h4 {
  font-size: 24px;
  line-height: 1.4;
}
.intent-source .source-question {
  font-size: 13px;
  line-height: 2.2;
  margin-top: 21px;
}
.intent-source .source-question>strong {
  display: block;
  font-weight: 500;
}
.intent-source .source-handwriting {
  font: 24px/1.8 var(--serif);
  transform: rotate(-3deg);
  margin-top: 20px;
  color: #585858;
}
.intent-source .source-handwriting>del {
  opacity: .75;
  text-decoration-thickness: 1px;
}
.intent-source .source-footer {
  font-size: 8px;
  color: #787878;
  border-top: 1px solid #37373733;
  margin-top: 24px;
  padding-top: 13px;
}
.study-source {
  background-image: linear-gradient(0deg,transparent 31px,#5c5c5c1c 31px);
  background-size: 100% 32px;
}
.reading-source h4 {
  font: 30px/1.4 var(--serif);
  max-width: 8em;
}
.reading-source .reading-excerpt {
  font: 13px/2.3 var(--serif);
  margin-top: 19px;
  color: #656565;
}
.mini-bill {
  font-size: 11px;
  margin-top: 22px;
}
.mini-bill>div {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #1d1d1d20;
  padding: 10px 0;
}
.mini-bill b {
  font: 11px var(--mono);
}
.mini-bill .sum {
  font-weight: 500;
  border-top: 1px solid #3a3a3a;
  border-bottom: 0;
  margin-top: 8px;
}
.intent-connector {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
  position: relative;
  z-index: 2;
}
.intent-connector span {
  height: 1px;
  background: linear-gradient(90deg,#d0d0d022,#d0d0d0a0);
  flex: 1;
}
.intent-connector span:last-child {
  background: linear-gradient(90deg,#d0d0d0a0,#d0d0d022);
}
.intent-connector img {
  width: 29px;
  height: 29px;
  box-shadow: 0 0 35px #ffffff13;
}
.intent-result {
  min-width: 0;
  position: relative;
  z-index: 1;
  align-self: center;
  transform: rotateY(-4deg);
  background: linear-gradient(140deg,#e8e8e8 0%,#fbfbfb 30%,#dfdfdf 100%);
  color: #1b1b1b;
  padding: 28px 29px;
  box-shadow: 0 1px 0 #ffffff inset,0 25px 70px #00000066;
  border: 1px solid #fcfcfc55;
  min-height: 335px;
}
.intent-result>small {
  display: flex;
  justify-content: space-between;
  font-size: 8px;
  color: #6c6c6c;
  letter-spacing: .03em;
  gap: 12px;
  border-bottom: 1px solid #2e2e2e25;
  padding-bottom: 14px;
  margin-bottom: 20px;
}
.intent-result h4 {
  font-size: 23px;
  line-height: 1.5;
  letter-spacing: -.05em;
}
.intent-result .intent-result-fields {
  margin-top: 17px;
}
.intent-result-fields>div {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
  border-bottom: 1px solid #31313122;
  padding: 12px 0;
  font-size: 11px;
}
.intent-result-fields>div>span {
  flex-shrink: 0;
  font-size: 10px;
  color: #7a7a7a;
}
.intent-result-fields>div>b {
  font-weight: 400;
  text-align: right;
  line-height: 1.8;
}
.intent-result-fields>div:last-child {
  border: 0;
}
.intent-result-fields .schema-only b {
  color: #6d6d6d;
  font-size: 10px;
}
.intent-result .result-caption {
  border-top: 1px solid #2b2b2b20;
  padding-top: 13px;
  margin-top: 13px;
  font-size: 8px;
  color: #7f7f7f;
}
.intent-id {
  position: absolute;
  left: 1%;
  bottom: 0;
  font: 90px/1 var(--serif);
  color: #bababa14;
  z-index: -1;
  pointer-events: none;
}
.intent-id span {
  font: 8px var(--mono);
  letter-spacing: .15em;
  position: absolute;
  left: 85px;
  bottom: 8px;
  white-space: nowrap;
  color: #5d5d5d;
}
.intent-foot {
  border-top: 1px solid #ffffff22;
  display: flex;
  gap: 30px;
  align-items: center;
  justify-content: space-between;
  padding: 29px 0 0;
}
.intent-foot>p {
  font: clamp(19px,2vw,28px) var(--serif);
  letter-spacing: -.02em;
}
.intent-foot .text-link {
  font-size: 11px;
  color: #b8b8b8;
}
.template-editor {
  border: 1px solid #cacaca33;
  padding: 26px;
  margin-top: 26px;
  background: #cdcdcd05;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px 35px;
}
.template-editor h3 {
  font-size: 20px;
  line-height: 1.5;
}
.template-editor p {
  font-size: 11px;
  color: #b2b2b2;
  margin-top: 9px;
}
.template-editor form {
  display: flex;
  align-items: center;
  gap: 12px;
}
.template-editor input {
  background: none;
  border: 0;
  border-bottom: 1px solid #d6d6d666;
  color: var(--paper);
  min-width: 0;
  width: 100%;
  padding: 12px 0;
  font-size: 12px;
}
.template-editor .button {
  white-space: nowrap;
  padding: 12px 18px;
  min-height: 44px;
  font-size: 11px;
  gap: 13px;
}
.custom-fields {
  grid-column: 1/-1;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.custom-fields>span {
  display: inline-flex;
  gap: 13px;
  align-items: center;
  border: 1px solid #c0c0c04a;
  padding: 7px 9px 7px 14px;
  font-size: 11px;
}
.custom-fields button {
  font-size: 16px;
  padding: 0 6px;
  min-width: 30px;
  min-height: 28px;
}
.template-editor .editor-note {
  grid-column: 1/-1;
  margin: 0;
  font-size: 10px;
  color: #a8a8a8;
}
/* A visual observation is not a quality verdict. */
.vision {
  padding-top: 30px;
  padding-bottom: 70px;
}
.vision-layout {
  display: grid;
  grid-template-columns: .88fr 1.12fr;
  gap: 10%;
  align-items: center;
  padding: 60px 0 15px;
}
.vision-copy .eyebrow {
  color: #6b6b6b;
  font-size: 10px;
  margin-bottom: 26px;
}
.vision-copy h2 {
  font-size: clamp(42px,4.7vw,71px);
  line-height: 1.25;
  min-height: 2.5em;
}
.vision-copy>p {
  font-size: 13px;
  color: #6f6f6f;
  line-height: 1.9;
  margin-top: 23px;
}
.vision-tabs {
  margin: 34px 0 0;
  max-width: 350px;
}
.vision-tabs button {
  display: flex;
  align-items: center;
  gap: 20px;
  width: 100%;
  text-align: left;
  font-size: 13px;
  min-height: 65px;
  border-top: 1px solid #21212130;
  color: #818181;
  transition: color .3s,padding .5s var(--ease);
}
.vision-tabs button:last-child {
  border-bottom: 1px solid #21212130;
}
.vision-tabs button span {
  font: 9px var(--mono);
}
.vision-tabs button b {
  font-size: 21px;
  font-weight: 400;
  margin-left: auto;
  opacity: .45;
}
.vision-tabs button.active {
  color: #151515;
  padding-left: 9px;
}
.vision-tabs button.active b {
  opacity: 1;
}
.vision-copy .quiet-note {
  font-size: 10px;
  color: #787878;
  margin-top: 24px;
}
.vision-evidence {
  min-width: 0;
  padding: 0 8px 0 0;
}
.scan-surround {
  position: relative;
  padding: 16px 22px;
  background: linear-gradient(130deg,#d9d9d9,#eaeaea 27%,#bdbdbd 100%);
  border: 1px solid #ababab;
  box-shadow: 0 18px 50px #1e1e1e16,0 1px 0 white inset;
  transform: perspective(1800px) rotateY(-6deg) rotateX(2deg);
  transition: transform .8s var(--ease);
}
.scan-surround:hover {
  transform: perspective(1800px) rotateY(-2deg) rotateX(0);
}
.scan-registration {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font: 7px var(--mono);
  letter-spacing: .08em;
  color: #676767;
  padding: 0 0 13px;
}
.scan-registration i {
  font: 16px var(--mono);
  font-style: normal;
  line-height: 1;
}
.scan-registration.bottom {
  padding: 13px 0 0;
  font-family: var(--sans);
  font-size: 8px;
}
.inspection-document {
  position: relative;
  background: #fafafa;
  padding: 26px 29px 25px;
  box-shadow: 0 4px 17px #2b2b2b23;
  color: #343434;
}
.inspection-top {
  display: flex;
  justify-content: space-between;
  font: 7px var(--mono);
  color: #848484;
  gap: 10px;
}
.inspection-top small {
  font-size: 7px;
}
.inspection-document h3 {
  font: 25px var(--serif);
  letter-spacing: .13em;
  text-align: center;
  margin: 23px 0;
}
.inspection-meta {
  display: flex;
  justify-content: space-between;
  font-size: 9px;
  line-height: 1.8;
  gap: 10px;
  border-top: 1px solid #7f7f7f55;
  border-bottom: 1px solid #7f7f7f55;
  padding: 11px 0;
}
.inspection-check {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 25px 0;
  width: max-content;
  font-size: 11px;
}
.inspection-check b {
  font-weight: 400;
}
.drawn-check,.empty-check {
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  border: 1px solid #474747;
  font-size: 24px;
  line-height: 1;
}
.drawn-check {
  font-family: var(--serif);
  font-weight: 600;
}
.empty-check {
  margin-left: 20px;
}
.inspection-table {
  border: 1px solid #80808077;
  font-size: 10px;
  margin-bottom: 20px;
}
.inspection-row {
  display: grid;
  grid-template-columns: 1fr .65fr 1.35fr;
}
.inspection-row>span {
  padding: 10px 8px;
  border-right: 1px solid #80808055;
}
.inspection-row>span:last-child {
  border-right: 0;
}
.inspection-row:not(:last-child) {
  border-bottom: 1px solid #80808055;
}
.inspection-row.head {
  font-size: 9px;
  background: #e7e7e7;
}
.package-image {
  position: relative;
}
.package-image svg {
  width: 100%;
  height: auto;
}
.inspection-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 23px;
  font-size: 10px;
  color: #636363;
}
.inspection-stamp {
  font: 12px var(--serif);
  border: 3px double #7a7a7a80;
  padding: 8px 9px;
  transform: rotate(-9deg);
  letter-spacing: .18em;
}
.vision-focus {
  position: absolute;
  border: 1px solid #2c2c2c;
  box-shadow: 0 0 0 300px #2d2d2d04;
  pointer-events: none;
  z-index: 5;
  transition: left .65s var(--ease),top .65s var(--ease),width .65s var(--ease),height .65s var(--ease);
}
.vision-focus:before,.vision-focus:after {
  content: "";
  position: absolute;
  inset: -4px;
  border: 1px solid transparent;
  border-top-color: #323232;
  border-left-color: #323232;
  width: 9px;
  height: 9px;
}
.vision-focus:after {
  inset: auto -4px -4px auto;
  transform: rotate(180deg);
}
.vision-focus>span {
  position: absolute;
  top: -23px;
  left: -1px;
  background: #1f1f1f;
  color: #f6f6f6;
  padding: 3px 7px;
  white-space: nowrap;
  font-size: 8px;
}
.vision-focus i {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 1px;
  background: #31313144;
  animation: scanning 4.2s ease-in-out infinite;
}
@keyframes scanning {
  0%,100% {
    left: 0;
  }
  50% {
    left: 100%;
  }
}
.vision-readout {
  border-left: 1px solid #767676;
  margin: 29px 0 0 9%;
  padding: 4px 0 4px 22px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
}
.vision-readout>span {
  font-size: 10px;
  color: #747474;
}
.vision-readout strong {
  font-size: 17px;
  font-weight: 400;
  display: flex;
  align-items: center;
  gap: 11px;
  line-height: 1.7;
}
.vision-readout strong svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
}
/* Trust is physical, quiet and exact. */
.trust {
  padding-top: 30px;
  padding-bottom: 55px;
  background: radial-gradient(ellipse at 52% 67%,#1f1f1f 0%,#101010 48%,#080808 76%);
}
.trust-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 40px;
  padding: 65px 0 67px;
}
.trust-heading h2 {
  font-size: clamp(41px,5.25vw,78px);
  line-height: 1.27;
}
.trust-heading>p {
  font-size: 12px;
  line-height: 1.95;
  color: #b8b8b8;
  max-width: 260px;
  padding-bottom: 6px;
}
.trust-machine {
  display: grid;
  grid-template-columns: .85fr 1.27fr .72fr;
  gap: 5%;
  padding: 0 0 38px;
}
.panel-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 9px;
  color: #999999;
  border-bottom: 1px solid #c7c7c726;
  padding: 14px 0 17px;
  margin-bottom: 35px;
}
.panel-label small {
  font: 9px var(--sans);
  letter-spacing: .08em;
  color: #d9d9d9;
}
.panel-label>span {
  font-size: 8px;
}
.trust-receipt {
  background: var(--paper);
  padding: 29px 24px 25px;
  color: #2f2f2f;
  transform: rotate(-5deg);
  box-shadow: 0 25px 50px #00000099;
  position: relative;
  max-width: 280px;
  margin: 0 6px 0 4px;
  clip-path: polygon(0 0,100% 0,100% 100%,96% 98%,92% 100%,88% 98%,84% 100%,80% 98%,76% 100%,72% 98%,68% 100%,64% 98%,60% 100%,56% 98%,52% 100%,48% 98%,44% 100%,40% 98%,36% 100%,32% 98%,28% 100%,24% 98%,20% 100%,16% 98%,12% 100%,8% 98%,4% 100%,0 98%);
}
.receipt-top {
  font: 23px var(--serif);
  letter-spacing: .08em;
  text-align: center;
}
.trust-receipt>small {
  display: block;
  font-size: 7px;
  text-align: center;
  color: #7d7d7d;
  margin: 10px 0 18px;
  letter-spacing: .04em;
}
.receipt-dashed {
  height: 1px;
  border-top: 1px dashed #91919188;
  margin-bottom: 20px;
}
.trust-receipt>div:not(.receipt-top):not(.receipt-dashed):not(.barcode) {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin: 14px 0;
  font-size: 11px;
}
.trust-receipt>div>b {
  font: 12px var(--mono);
}
.receipt-freight {
  background: #d9d9d9;
  outline: 1px solid #707070;
  outline-offset: 4px;
  transition: background .5s;
}
.trust-receipt .receipt-total {
  border-top: 1px dashed #7e7e7e88;
  padding-top: 20px;
  margin-top: 23px !important;
  align-items: center;
}
.receipt-total>b {
  font: 22px var(--sans) !important;
  font-weight: 500 !important;
}
.barcode {
  height: 31px;
  background: repeating-linear-gradient(90deg,#3f3f3f 0,#3f3f3f 1px,transparent 1px,transparent 3px,#3f3f3f 3px,#3f3f3f 5px,transparent 5px,transparent 9px,#3f3f3f 9px,#3f3f3f 10px,transparent 10px,transparent 13px);
  width: 70%;
  margin: 25px auto 0;
  opacity: .7;
}
.trust-receipt>p {
  font: 7px var(--mono);
  text-align: center;
  margin-top: 12px;
  color: #7d7d7d;
}
.source-pin {
  display: block;
  text-align: center;
  margin-top: 26px;
  font-size: 9px;
  color: #9f9f9f;
  max-width: 280px;
}
.trust-current .panel-label {
  margin-bottom: 30px;
}
.current-label {
  font-size: 13px;
  color: #c1c1c1;
}
.current-number {
  display: flex;
  align-items: baseline;
  gap: 6px;
  font: clamp(73px,8.3vw,120px)/1.3 var(--sans);
  letter-spacing: -.075em;
  margin-top: 3px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.current-number>span {
  font-size: .28em;
  align-self: flex-start;
  margin-top: .75em;
  color: #a8a8a8;
  margin-right: 9px;
  letter-spacing: 0;
}
.current-number>b {
  font-weight: 500;
}
.current-number>small {
  font: 400 .4em var(--sans);
  color: #9c9c9c;
  letter-spacing: -.04em;
}
.current-number.changed>b {
  animation: numberSettle .7s var(--ease);
}
@keyframes numberSettle {
  0% {
    transform: translateY(14px);
    filter: blur(7px);
    opacity: .1;
  }
  100% {
    transform: translateY(0);
    filter: blur(0);
    opacity: 1;
  }
}
.rule-state {
  display: flex;
  gap: 13px;
  align-items: center;
  border-top: 1px solid #c2c2c22e;
  padding-top: 18px;
  margin-top: 5px;
}
.state-marker {
  width: 22px;
  height: 22px;
  border: 1px solid #b3b3b3;
  color: #dedede;
  display: grid;
  place-items: center;
  font: 12px var(--mono);
  flex: none;
}
.rule-state strong {
  font-size: 11px;
  font-weight: 400;
  display: block;
}
.rule-state>div>span {
  font: 10px var(--mono);
  color: #9b9b9b;
  display: block;
  margin-top: 8px;
  letter-spacing: .05em;
}
.correction-button {
  width: 100%;
  margin-top: 26px;
  font-size: 11px;
  min-height: 50px;
  padding: 14px 17px;
  gap: 10px;
}
.correction-button>span {
  font: 9px var(--mono);
  white-space: nowrap;
}
.correction-button:disabled {
  background: #d8d8d8;
  transform: none;
}
.trust-branch {
  height: 40px;
  width: 100%;
  position: relative;
}
.trust-branch>span {
  position: absolute;
  top: 0;
  height: 22px;
  width: 1px;
  background: #bdbdbd4d;
  left: 50%;
}
.trust-branch>i {
  position: absolute;
  top: 22px;
  left: 16.66%;
  right: 16.66%;
  height: 18px;
  border: 1px solid #bdbdbd4d;
  border-bottom: 0;
}
.trust-branch:after {
  content: "";
  position: absolute;
  top: 22px;
  height: 18px;
  width: 1px;
  left: 50%;
  background: #bdbdbd4d;
}
.current-consumers {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 8px;
  text-align: center;
}
.current-consumers span {
  font-size: 9px;
  color: #a9a9a9;
}
.current-consumers b {
  display: block;
  font: 18px/1.7 var(--mono);
  letter-spacing: -.04em;
  transition: color .4s;
}
.trust-machine.corrected .current-consumers b {
  color: #f9f9f9;
}
.trust-machine.corrected .trust-branch i,.trust-machine.corrected .trust-branch span {
  border-color: #e4e4e466;
  background: #e9e9e933;
}
.trust-history .panel-label {
  margin-bottom: 37px;
}
.history-track article {
  position: relative;
  padding: 0 0 25px 18px;
  border-left: 1px solid #c6c6c642;
}
.history-track article>i {
  position: absolute;
  left: -3px;
  top: 5px;
  width: 5px;
  height: 5px;
  background: #c5c5c5;
  border-radius: 50%;
}
.history-track small {
  font-size: 8px;
  color: #929292;
  letter-spacing: .04em;
}
.history-track h4 {
  font-size: 12px;
  letter-spacing: .01em;
  margin-top: 13px;
  font-weight: 400;
}
.history-track p {
  font: 12px/1.8 var(--mono);
  color: #bdbdbd;
  margin-top: 9px;
}
.history-track article.pending {
  opacity: .45;
}
.history-track article.pending p {
  font: 10px/1.9 var(--sans);
}
.history-track article:last-child {
  border-left-color: transparent;
}
.reset-button {
  font-size: 10px;
  border-bottom: 1px solid #c2c2c242;
  padding: 10px 0;
  min-height: 44px;
  margin-top: 9px;
  color: #9e9e9e;
}
.trust-after {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 35px;
  border-top: 1px solid #d2d2d225;
  padding-top: 30px;
}
.trust-after p {
  font-size: 11px;
  color: #bababa;
  line-height: 2;
}
.trust-after strong {
  font: 24px/1.8 var(--serif);
  color: var(--paper);
}
.trust-after>span {
  font-size: 10px;
  color: #a0a0a0;
  line-height: 1.9;
}
/* The actual software is the reveal, not an appendix. */
.workspace {
  padding-top: 30px;
  padding-bottom: 55px;
}
.workspace-heading {
  padding: 65px 0 46px;
}
.workspace-heading .eyebrow {
  color: #747474;
  margin-bottom: 25px;
}
.workspace-heading h2 {
  font-size: clamp(67px,9.2vw,132px);
  line-height: 1.1;
  letter-spacing: -.075em;
  position: relative;
}
.heading-dot {
  font: 15px var(--sans);
  vertical-align: top;
  display: inline-block;
  margin: 15px 0 0 15px;
  color: #7a7a7a;
}
.workspace-intro {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-top: 35px;
  gap: 25px;
}
.workspace-intro p {
  font-size: 13px;
  color: #6a6a6a;
  line-height: 1.9;
}
.workspace-intro .text-link {
  font-size: 11px;
  min-height: 42px;
}
.workbench-tabs {
  display: flex;
  border-bottom: 1px solid #2a2a2a44;
  gap: 35px;
  overflow-x: auto;
  scrollbar-width: none;
}
.workbench-tabs button {
  display: flex;
  gap: 10px;
  align-items: center;
  white-space: nowrap;
  font-size: 12px;
  color: #717171;
  border-bottom: 2px solid transparent;
  min-height: 60px;
  padding: 10px 0 15px;
}
.workbench-tabs button>span {
  font: 8px var(--mono);
  color: #848484;
}
.workbench-tabs button.active {
  color: #1f1f1f;
  border-bottom-color: #1f1f1f;
}
.workbench {
  border: 1px solid #343434;
  background: #1a1a1a;
  box-shadow: 0 17px 40px #2e2e2e20,0 1px 0 #ffffff88 inset;
  margin-top: 28px;
  padding: 6px;
  border-radius: 5px;
}
.window-bar {
  color: #ababab;
  height: 43px;
  padding: 0 13px 4px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 15px;
  font-size: 9px;
}
.window-bar>span:first-child {
  display: flex;
  align-items: center;
  gap: 10px;
}
.window-bar img {
  width: 21px;
  height: 21px;
  filter: grayscale(1);
}
.window-bar i {
  font-style: normal;
  color: #5f5f5f;
}
.window-bar b {
  font-weight: 400;
  color: #8a8a8a;
  font-size: 9px;
}
.window-bar button {
  display: flex;
  align-items: center;
  gap: 15px;
  font-size: 9px;
  min-height: 38px;
}
.window-bar button svg {
  width: 13px;
  height: 13px;
}
.window-bar>span:last-child {
  font: 8px var(--sans);
}
.official-screen {
  background: white;
  overflow: hidden;
}
.official-screen img {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  object-fit: contain;
}
.workbench-caption {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: start;
  margin-top: 35px;
}
.workbench-caption h3 {
  font: 27px/1.5 var(--serif);
}
.workbench-caption p {
  font-size: 12px;
  color: #727272;
  line-height: 1.95;
}
.capability-line {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 40px;
  margin-top: 55px;
  padding-top: 28px;
  border-top: 1px solid #33333330;
}
.capability-line span {
  font: 9px var(--mono);
  color: #727272;
}
.capability-line h4 {
  font-size: 22px;
  font-weight: 400;
  margin: 13px 0 9px;
}
.capability-line p {
  font-size: 11px;
  color: #747474;
}
.workflow-details {
  margin-top: 40px;
  border-top: 1px solid #2f2f2f25;
}
.workflow-details summary,.node-details summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 65px;
  font-size: 12px;
}
.workflow-details summary::-webkit-details-marker,.node-details summary::-webkit-details-marker {
  display: none;
}
.workflow-details summary svg,.node-details summary svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1;
  transition: transform .3s;
}
.workflow-details[open] summary svg,.node-details[open] summary svg {
  transform: rotate(45deg);
}
.workflow-details>div {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 40px;
  padding: 10px 0 15px;
}
.workflow-details p {
  font-size: 11px;
  line-height: 2;
  color: #717171;
}
.workflow-details b {
  font-weight: 500;
  color: #222222;
}
.freedom {
  padding-top: 30px;
  padding-bottom: 35px;
}
.freedom-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9%;
  padding: 68px 0 62px;
  align-items: center;
}
.freedom-copy .eyebrow {
  font-size: 10px;
  color: #aeaeae;
  margin-bottom: 25px;
  letter-spacing: .04em;
}
.freedom-copy h2 {
  font-size: clamp(42px,4.7vw,70px);
  line-height: 1.24;
}
.freedom-copy>p {
  font-size: 12px;
  color: #a8a8a8;
  line-height: 1.95;
  margin-top: 25px;
}
.route-switch {
  display: flex;
  max-width: 310px;
  gap: 0;
  margin-top: 27px;
  border: 1px solid #d0d0d044;
}
.route-switch button {
  font-size: 12px;
  padding: 12px 20px;
  flex: 1;
  white-space: nowrap;
  min-height: 48px;
  color: #a6a6a6;
}
.route-switch button.active {
  background: var(--paper);
  color: var(--ink);
}
.route-switch button>span {
  margin-left: 9px;
}
.freedom-copy .route-description {
  font-size: 10px;
  color: #a3a3a3;
  max-width: 350px;
  min-height: 60px;
  margin-top: 20px;
  line-height: 1.9;
}
.engine-installation {
  height: 485px;
  position: relative;
  padding: 0 48px 0 8px;
  perspective: 1200px;
}
.engine-measure {
  display: flex;
  align-items: center;
  gap: 14px;
  font: 8px var(--mono);
  color: #7d7d7d;
  margin-bottom: 22px;
}
.engine-measure i {
  height: 1px;
  flex: 1;
  background: #b4b4b455;
}
.machine-boundary {
  height: 335px;
  border: 1px solid #bebebe42;
  position: relative;
  background: radial-gradient(ellipse at 62% 58%,#2a2a2a,#121212 80%);
  box-shadow: 0 0 0 5px #dddddd02,0 0 0 6px #dddddd0e;
  transition: border .5s;
}
.machine-caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  padding: 20px;
  font-size: 11px;
  color: #bfbfbf;
}
.machine-caption small {
  font-size: 8px;
  letter-spacing: .12em;
  color: #878787;
}
.system-stack {
  position: absolute;
  left: 24px;
  right: 51%;
  top: 85px;
  bottom: 32px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 15px;
}
.system-stack>div {
  padding: 12px 13px;
  border: 1px solid #c4c4c433;
  background: #d5d5d50a;
  position: relative;
  box-shadow: 0 1px 0 #d5d5d517 inset;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.system-stack span {
  font-size: 10px;
  color: #d7d7d7;
}
.system-stack small {
  font-size: 6px;
  letter-spacing: .09em;
  color: #898989;
}
.system-stack>div:after {
  content: "";
  height: 1px;
  position: absolute;
  top: 50%;
  right: -24px;
  width: 24px;
  background: #acacac66;
}
.engine-rail {
  position: absolute;
  left: 48%;
  right: 15%;
  height: 1px;
  background: #bdbdbd33;
  top: 50%;
}
.engine-rail:before {
  content: "";
  width: 1px;
  height: 159px;
  position: absolute;
  top: -79px;
  left: 0;
  background: #bdbdbd44;
}
.rail-two {
  top: 51%;
  transform: rotate(90deg);
  opacity: .3;
}
.engine-slot {
  position: absolute;
  top: 114px;
  left: 55%;
  width: 145px;
  height: 147px;
  border: 1px dashed #c1c1c144;
  display: grid;
  place-items: center;
}
.engine-slot>small {
  position: absolute;
  top: -26px;
  font: 7px var(--sans);
  white-space: nowrap;
  color: #979797;
}
.slot-mark {
  font: 40px var(--mono);
  color: #a9a9a944;
}
.model-cartridge {
  position: absolute;
  top: 112px;
  left: 55%;
  width: 145px;
  height: 147px;
  background: linear-gradient(135deg,#f2f2f2,#a9a9a9 45%,#f0f0f0 76%,#949494);
  padding: 6px;
  border: 1px solid #d3d3d3;
  box-shadow: 0 14px 32px #00000099,0 1px 1px #ffffff inset;
  transform: rotateY(-8deg) rotateX(9deg) rotateZ(-3deg);
  transition: transform 1s var(--ease),left 1s var(--ease),top 1s var(--ease);
}
.chip-face {
  height: 100%;
  background: linear-gradient(135deg,#1c1c1c,#363636 70%,#1d1d1d);
  border: 1px solid #535353;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  color: #f0f0f0;
  position: relative;
}
.chip-face:before,.chip-face:after {
  content: "";
  position: absolute;
  width: 3px;
  height: 3px;
  border: 1px solid #7e7e7e;
  top: 5px;
  left: 5px;
  border-radius: 50%;
}
.chip-face:after {
  top: auto;
  left: auto;
  right: 5px;
  bottom: 5px;
}
.chip-symbol {
  font: 27px/1 var(--sans);
  margin-bottom: 9px;
}
.chip-face strong {
  font-size: 13px;
  font-weight: 400;
}
.chip-face small {
  font-size: 6px;
  color: #9c9c9c;
  margin-top: 3px;
}
.chip-task {
  font-size: 7px;
  line-height: 1.6;
  text-align: center;
  color: #a0a0a0;
  margin-top: 10px;
}
.chip-pins {
  position: absolute;
  left: 8px;
  right: 8px;
  height: 5px;
  background: repeating-linear-gradient(90deg,#bebebe 0,#bebebe 2px,transparent 2px,transparent 7px);
}
.pins-top {
  top: -6px;
}
.pins-bottom {
  bottom: -6px;
}
.cloud-space {
  position: absolute;
  right: 0;
  top: 398px;
  opacity: 0;
  transition: opacity .5s .15s;
  color: #c4c4c4;
  font-size: 10px;
  text-align: right;
  line-height: 1.9;
}
.cloud-space small {
  display: block;
  font: 7px var(--sans);
  color: #989898;
}
.engine-bottom {
  margin-top: 54px;
  border-left: 1px solid #a7a7a766;
  padding-left: 18px;
  display: flex;
  flex-direction: column;
  font-size: 10px;
  gap: 6px;
  color: #a4a4a4;
}
.engine-bottom b {
  font-weight: 400;
  font-size: 14px;
  color: #d9d9d9;
}
.engine-installation[data-route=cloud] .model-cartridge {
  left: calc(100% - 100px);
  top: 256px;
  transform: rotateY(-8deg) rotateX(5deg) rotateZ(2deg);
}
.engine-installation[data-route=cloud] .machine-boundary {
  border-style: dashed;
}
.engine-installation[data-route=cloud] .cloud-space {
  opacity: 1;
}
.engine-installation[data-route=cloud] .engine-bottom {
  max-width: 210px;
}
.human-principle {
  display: flex;
  align-items: center;
  gap: 34px;
  border-top: 1px solid #b2b2b22e;
  padding: 33px 0 37px;
}
.principle-star {
  font-size: 52px;
  line-height: 1;
  color: #dadada;
}
.human-principle p {
  font-size: 13px;
  color: #a2a2a2;
  line-height: 2;
}
.human-principle b {
  font-size: 22px;
  font-weight: 400;
  letter-spacing: -.03em;
  color: #e2e2e2;
}
.node-details {
  border-top: 1px solid #b2b2b22e;
}
.node-details summary {
  min-height: 85px;
  font-size: 12px;
  color: #a4a4a4;
}
.node-details summary>span:first-child b {
  color: #dadada;
  font-weight: 400;
  margin-left: 12px;
}
.node-details summary>span:last-child {
  display: flex;
  align-items: center;
  gap: 25px;
  font: 9px var(--mono);
  white-space: nowrap;
}
.node-content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 50px;
  padding: 5px 0 30px;
}
.node-content p {
  font-size: 11px;
  color: #9e9e9e;
  line-height: 1.9;
}
.node-chain {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 10px;
  color: #9e9e9e;
  gap: 10px;
}
.node-chain b {
  font: 21px var(--serif);
  color: var(--paper);
  padding: 17px 27px;
  border: 1px solid #aeaeae66;
}
.node-chain i {
  font-style: normal;
  color: #d8d8d8;
}
/* Finale. A brand signature, not another feature grid. */
.closing {
  padding-top: 30px;
}
.closing-type {
  font-size: clamp(185px,30vw,475px);
  font-weight: 500;
  line-height: 1.23;
  letter-spacing: -.08em;
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 11% 0 0;
  user-select: none;
}
.closing-type>span:first-child {
  margin-left: -.025em;
}
.closing-type>span:nth-child(2) {
  font-family: var(--serif);
  font-weight: 500;
  -webkit-text-stroke: 1px #181818cc;
  color: transparent;
}
.closing-type>i {
  position: absolute;
  right: 0;
  top: 19%;
  font: 38px/1 var(--sans);
  color: #3d3d3d;
}
.closing-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  margin: 35px 0 57px;
}
.closing-bottom h2 {
  font-size: clamp(27px,3vw,45px);
  line-height: 1.4;
}
.closing-bottom p {
  font-size: 13px;
  color: #818181;
  margin-top: 14px;
  letter-spacing: .1em;
}
.download-group {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.download-button {
  min-width: 295px;
  min-height: 60px;
}
.download-group>span {
  font: 9px var(--mono);
  color: #737373;
  letter-spacing: .02em;
}
.download-faq {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 30px;
  padding-bottom: 28px;
}
.download-faq details {
  border-top: 1px solid #2626264d;
}
.download-faq summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 11px;
  min-height: 62px;
  cursor: pointer;
  list-style: none;
}
.download-faq summary::-webkit-details-marker {
  display: none;
}
.download-faq summary>span {
  font: 18px var(--sans);
  transition: transform .3s;
}
.download-faq details[open] summary>span {
  transform: rotate(45deg);
}
.download-faq p {
  font-size: 11px;
  color: #767676;
  line-height: 2;
  padding: 0 0 18px;
}
.download-faq a {
  font-size: 11px;
  display: inline-block;
  border-bottom: 1px solid #8d8d8d;
  margin-bottom: 18px;
}
footer {
  border-top: 1px solid #26262630;
  padding: 28px 0;
  display: flex;
  gap: 30px;
  justify-content: space-between;
  align-items: center;
}
.footer-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 17px;
  white-space: nowrap;
}
.footer-brand img {
  width: 27px;
  height: 27px;
}
.footer-brand small {
  font-size: 8px;
  margin-left: 8px;
  letter-spacing: .15em;
  color: #858585;
}
footer>div {
  display: flex;
  gap: 27px;
  align-items: center;
}
footer>div a,footer>div button {
  font-size: 10px;
  padding: 8px 0;
  min-height: 36px;
  color: #6d6d6d;
}
footer>div a:hover,footer>div button:hover {
  color: #1e1e1e;
}
footer>span {
  font: 8px var(--mono);
  color: #909090;
  letter-spacing: .06em;
}
/* Dialogs never simulate product state or upload user files. */
dialog {
  border: 1px solid #5252523d;
  border-radius: 3px;
  background: var(--paper);
  color: var(--ink);
  padding: 24px;
  max-width: calc(100vw - 32px);
  max-height: 90svh;
  box-shadow: 0 30px 130px #00000099;
}
dialog::backdrop {
  background: #080808e8;
  backdrop-filter: blur(8px);
}
.dialog-open {
  overflow: hidden;
}
.dialog-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  font-size: 11px;
  border-bottom: 1px solid #2f2f2f25;
  padding-bottom: 14px;
  margin-bottom: 22px;
  color: #6e6e6e;
}
.dialog-bar button {
  display: grid;
  place-items: center;
  width: 40px;
  min-height: 40px;
}
.dialog-bar button svg {
  width: 23px;
  height: 23px;
}
.product-dialog {
  width: min(1300px,94vw);
}
.product-viewport img {
  width: 100%;
  height: auto;
  object-fit: contain;
}
.product-dialog>a,.source-dialog>a {
  display: inline-block;
  font-size: 11px;
  margin-top: 23px;
  border-bottom: 1px solid #878787;
  padding-bottom: 5px;
}
.source-dialog {
  width: 600px;
  padding: 24px 32px;
}
.source-dialog h2 {
  font: 30px/1.4 var(--serif);
  margin-bottom: 23px;
}
.source-dialog p {
  font-size: 12px;
  color: #6b6b6b;
  line-height: 2;
  margin-top: 18px;
}
.record-dialog {
  width: 580px;
  padding: 23px 29px;
}
.record-dialog h3 {
  font-size: 28px;
  line-height: 1.5;
}
.record-dialog .record-facts {
  margin-top: 20px;
}
.record-facts>div {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  font-size: 12px;
  padding: 13px 0;
  border-bottom: 1px solid #5f5f5f33;
}
.record-facts span {
  color: #868686;
}
.record-facts b {
  font-weight: 400;
}
.record-history {
  margin-top: 20px;
  background: #e7e7e7;
  padding: 17px 20px;
  font-size: 11px;
  line-height: 2;
}
.record-dialog .record-note {
  font-size: 10px;
  color: #828282;
  line-height: 1.8;
  margin-top: 17px;
}
.toast {
  position: fixed;
  left: 50%;
  bottom: 25px;
  z-index: 180;
  transform: translate(-50%,18px);
  opacity: 0;
  background: #e8e8e8;
  color: #242424;
  border: 1px solid #868686;
  box-shadow: 0 10px 40px #00000055;
  font-size: 12px;
  padding: 13px 21px;
  pointer-events: none;
  transition: .3s;
  max-width: calc(100vw - 36px);
  text-align: center;
  width: max-content;
}
.toast.show {
  transform: translate(-50%,0);
  opacity: 1;
}
.noscript-note {
  background: var(--paper);
  color: var(--ink);
  padding: 20px;
  text-align: center;
  font-size: 13px;
}
.paused *,.paused *:before,.paused *:after {
  animation-play-state: paused !important;
}
/* Tablet: compositions reflow rather than just shrinking their text. */
@media (min-width:1750px) {
  :root {
    --pad: max(90px,calc((100vw - 1560px)/2));
  }
  .hero-copy h1 {
    font-size: 112px;
  }
  .hero-second h2 {
    font-size: 94px;
  }
  .closing-type {
    font-size: 475px;
  }
}
@media (max-width:1150px) {
  .desktop-nav {
    gap: 20px;
    margin-left: 0;
  }
  .brand small {
    display: none;
  }
  .header-actions {
    gap: 16px;
  }
  .hero-copy h1 {
    font-size: 7.25vw;
  }
  .hero-description {
    font-size: 12px;
  }
  .hero-copy .eyebrow {
    font-size: 9px;
    letter-spacing: .06em;
  }
  .hero-copy .button {
    font-size: 11px;
    padding: 13px 19px;
    gap: 25px;
  }
  .hero-platform {
    font-size: 8px;
  }
  .hero-actions {
    gap: 19px;
  }
  .hero-result {
    padding: 20px;
  }
  .hero-table-row {
    font-size: 10px;
    padding: 14px 0;
    gap: 8px;
  }
  .hero-table-row>:last-child {
    font-size: 11px;
  }
  .meaning-stage {
    padding: 0 2%;
    gap: 12%;
  }
  .source-paper {
    padding: 25px;
    min-height: 392px;
  }
  .source-rail button {
    font-size: 10px;
  }
  .meaning-fields {
    gap: 19px;
  }
  .heading-copy {
    padding-right: 0;
  }
  .word-equivalence {
    gap: 11px;
  }
  .word-equivalence i {
    margin: 0 6px;
  }
  .intent-stage {
    grid-template-columns: 1fr 68px 1fr;
    padding: 58px 5%;
    min-height: 490px;
  }
  .intent-source,.intent-result {
    padding: 25px;
    min-height: 320px;
  }
  .vision-layout {
    gap: 7%;
  }
  .scan-surround {
    padding: 15px 17px;
  }
  .inspection-document {
    padding: 24px 23px;
  }
  .inspection-document h3 {
    font-size: 23px;
  }
  .trust-machine {
    grid-template-columns: .82fr 1.2fr .71fr;
    gap: 4%;
  }
  .trust-receipt {
    padding: 25px 18px;
  }
  .trust-receipt>div:not(.receipt-top):not(.receipt-dashed):not(.barcode) {
    font-size: 10px;
  }
  .current-number {
    font-size: 8.5vw;
  }
  .panel-label small {
    font-size: 8px;
  }
  .panel-label>span {
    font-size: 7px;
  }
  .current-consumers b {
    font-size: 16px;
  }
  .correction-button {
    font-size: 10px;
    padding: 12px;
  }
  .trust-heading>p {
    font-size: 11px;
  }
  .history-track p {
    font-size: 11px;
  }
  .demo-main {
    padding: 29px 27px;
  }
  .capability-line {
    gap: 26px;
  }
  .capability-line h4 {
    font-size: 20px;
  }
  .freedom-layout {
    gap: 6%;
  }
  .engine-installation {
    padding-right: 36px;
  }
  .system-stack {
    left: 18px;
    right: 53%;
  }
  .system-stack>div {
    padding: 11px 10px;
  }
  .engine-slot,.model-cartridge {
    left: 52%;
    width: 133px;
    height: 143px;
  }
  .machine-caption {
    padding: 19px 16px;
  }
  .engine-installation[data-route=cloud] .model-cartridge {
    left: calc(100% - 100px);
  }
  .cloud-space {
    right: 0;
  }
  .engine-installation[data-route=cloud] .engine-bottom {
    max-width: 180px;
  }
  footer>span {
    display: none;
  }
}
@media (max-width:900px) {
  :root {
    --pad: 32px;
  }
  .site-header {
    height: 74px;
    gap: 16px;
  }
  .brand {
    gap: 8px;
  }
  .brand>span {
    font-size: 20px;
  }
  .desktop-nav {
    gap: 15px;
  }
  .desktop-nav a {
    font-size: 10px;
  }
  .header-cta {
    gap: 18px;
  }
  .header-actions {
    gap: 8px;
  }
  .hero-sticky {
    min-height: 655px;
  }
  .hero-copy h1 {
    font-size: 7.5vw;
  }
  .hero-copy {
    max-width: 52%;
  }
  .hero-copy .eyebrow {
    font-size: 8px;
    letter-spacing: 0;
    gap: 9px;
  }
  .tiny-cross {
    font-size: 18px;
  }
  .hero-actions {
    gap: 15px;
    flex-wrap: wrap;
  }
  .hero-platform {
    display: none;
  }
  .hero-second h2 {
    font-size: 6.9vw;
  }
  .hero-extract {
    left: 65%;
    top: 66%;
    padding: 12px 16px;
    min-width: 180px;
  }
  .hero-extract strong {
    font-size: 30px;
  }
  .hero-extract small {
    font-size: 8px;
  }
  .hero-result {
    right: 25px;
    width: 46%;
    padding: 17px;
  }
  .hero-table-head,.hero-table-row {
    grid-template-columns: .8fr 1fr .7fr .75fr;
    gap: 6px;
    font-size: 9px;
  }
  .hero-table-row>:first-child {
    font-size: 7px;
    gap: 4px;
  }
  .hero-table-row>:first-child:before {
    display: none;
  }
  .hero-table-row>:last-child {
    font-size: 10px;
  }
  .result-cover small {
    font-size: 6px;
  }
  .result-cover>span {
    font-size: 19px;
  }
  .hero-table-foot {
    font-size: 7px;
  }
  .hero-steps {
    gap: 8px;
    font-size: 7px;
  }
  .hero-steps i {
    width: 24px;
  }
  .hero-version {
    display: none;
  }
  .format-strip {
    font-size: 11px;
    padding: 25px var(--pad);
  }
  .format-strip>div {
    gap: 15px;
  }
  .format-strip b {
    font-size: 8px;
  }
  .format-strip strong {
    font-size: 10px;
  }
  .format-strip>div>span {
    margin: 0;
    font-size: 19px;
  }
  .section-heading {
    padding: 47px 0 42px;
    gap: 30px;
  }
  .section-heading h2 {
    font-size: 49px;
  }
  .heading-copy p {
    font-size: 11px;
  }
  .mode-switch {
    margin-top: 23px;
  }
  .mode-switch button {
    font-size: 10px;
    padding: 9px 14px;
    min-height: 41px;
  }
  .meaning-stage {
    gap: 10%;
    padding: 0 1%;
    min-height: 540px;
  }
  .source-rail {
    gap: 8px;
  }
  .source-rail button {
    font-size: 9px;
  }
  .source-rail small {
    font-size: 6px;
    margin-left: 4px;
  }
  .source-paper {
    padding: 23px 20px;
    min-height: 382px;
  }
  .source-paper h4 {
    font-size: 22px;
  }
  .source-paper .doc-top {
    font-size: 7px;
    margin-bottom: 20px;
  }
  .doc-item {
    gap: 9px;
  }
  .doc-item>div {
    gap: 8px;
  }
  .doc-item p {
    font-size: 11px;
  }
  .doc-field,.doc-price {
    font-size: 10px;
  }
  .doc-price b {
    font-size: 11px;
  }
  .doc-price.total b {
    font-size: 22px;
  }
  .source-meta {
    font-size: 7px;
  }
  .meaning-output h3 {
    font-size: 31px;
  }
  .answer-number {
    font-size: 84px;
  }
  .answer-rule {
    font-size: 10px;
  }
  .meaning-fields {
    gap: 16px;
  }
  .meaning-fields button {
    font-size: 10px;
  }
  .meaning-fields button small {
    font-size: 8px;
  }
  .meaning-explanation {
    font-size: 11px;
  }
  .output-caption {
    font-size: 9px;
  }
  .semantic-bottom {
    gap: 20px;
    margin-top: 38px;
    padding-top: 30px;
  }
  .semantic-bottom>div:first-child {
    font-size: 21px;
  }
  .word-equivalence {
    font-size: 10px;
    gap: 10px;
  }
  .word-equivalence>span {
    font-size: 9px;
  }
  .word-equivalence i {
    font-size: 20px;
    margin: 0;
  }
  .intention-heading {
    padding: 48px 0 40px;
    gap: 28px;
  }
  .intention-heading h2 {
    font-size: 49px;
  }
  .intention-heading>p {
    font-size: 11px;
    padding: 0 0 5px;
  }
  .intent-tabs button {
    padding: 19px 20px;
    gap: 8px;
  }
  .intent-tabs span {
    font-size: 20px;
  }
  .intent-tabs small {
    font-size: 7px;
  }
  .intent-stage {
    padding: 55px 2% 45px;
    grid-template-columns: 1fr 52px 1fr;
  }
  .intent-source,.intent-result {
    padding: 24px 21px;
    min-height: 317px;
  }
  .intent-source h4 {
    font-size: 21px;
  }
  .intent-source>small {
    font-size: 7px;
  }
  .intent-result>small {
    font-size: 6px;
  }
  .intent-result h4 {
    font-size: 20px;
  }
  .intent-result-fields>div {
    font-size: 10px;
    gap: 12px;
  }
  .intent-result-fields>div>span {
    font-size: 9px;
  }
  .intent-source .source-question {
    font-size: 11px;
  }
  .reading-source .reading-excerpt {
    font-size: 12px;
  }
  .intent-summary {
    font-size: 20px;
  }
  .vision-layout {
    gap: 7%;
    grid-template-columns: .9fr 1.1fr;
    padding-top: 47px;
  }
  .vision-copy h2 {
    font-size: 41px;
  }
  .vision-copy .eyebrow {
    font-size: 8px;
    margin-bottom: 20px;
  }
  .vision-copy>p {
    font-size: 11px;
  }
  .vision-tabs {
    margin-top: 25px;
  }
  .vision-tabs button {
    font-size: 11px;
    min-height: 56px;
    gap: 13px;
  }
  .vision-copy .quiet-note {
    font-size: 9px;
  }
  .scan-surround {
    padding: 12px 15px;
  }
  .scan-registration {
    font-size: 6px;
    letter-spacing: .01em;
  }
  .inspection-document {
    padding: 20px 17px;
  }
  .inspection-document h3 {
    font-size: 19px;
    letter-spacing: .07em;
    margin: 19px 0;
  }
  .inspection-meta {
    font-size: 7px;
    gap: 5px;
  }
  .inspection-top {
    font-size: 6px;
    gap: 8px;
  }
  .inspection-top small {
    font-size: 6px;
  }
  .inspection-check {
    font-size: 9px;
    gap: 7px;
    margin: 22px 0;
  }
  .drawn-check,.empty-check {
    width: 15px;
    height: 15px;
    font-size: 20px;
  }
  .empty-check {
    margin-left: 13px;
  }
  .inspection-table {
    font-size: 8px;
    margin-bottom: 17px;
  }
  .inspection-row.head {
    font-size: 8px;
  }
  .inspection-row>span {
    padding: 8px 6px;
  }
  .inspection-bottom {
    font-size: 8px;
    margin-top: 20px;
  }
  .inspection-stamp {
    font-size: 10px;
    padding: 6px;
  }
  .vision-readout {
    gap: 15px;
    margin-top: 24px;
    padding-left: 17px;
  }
  .vision-readout>span {
    font-size: 9px;
  }
  .vision-readout strong {
    font-size: 13px;
    gap: 7px;
  }
  .vision-focus>span {
    font-size: 7px;
    top: -22px;
  }
  .trust-heading {
    padding: 47px 0 50px;
  }
  .trust-heading h2 {
    font-size: 44px;
  }
  .trust-heading>p {
    font-size: 10px;
    max-width: 200px;
  }
  .trust-machine {
    grid-template-columns: .8fr 1.3fr;
    gap: 7%;
  }
  .trust-history {
    grid-column: 1/-1;
    margin-top: 18px;
    display: grid;
    grid-template-columns: .8fr 1.3fr;
    gap: 7%;
    align-items: start;
  }
  .trust-history .panel-label {
    margin: 0;
  }
  .history-track {
    display: flex;
    gap: 30px;
    grid-column: 2;
    grid-row: 1/3;
    padding-top: 13px;
  }
  .history-track article {
    flex: 1;
    border-left: 0;
    border-top: 1px solid #c6c6c642;
    padding: 18px 0 0;
  }
  .history-track article>i {
    top: -3px;
    left: 0;
  }
  .history-track small {
    font-size: 7px;
  }
  .history-track h4 {
    font-size: 11px;
    margin-top: 9px;
  }
  .history-track p {
    font-size: 10px;
    margin-top: 7px;
  }
  .trust-history .reset-button {
    grid-column: 1;
    justify-self: start;
    margin-top: 0;
  }
  .current-number {
    font-size: 104px;
  }
  .trust-receipt {
    max-width: 270px;
    padding: 25px 23px;
  }
  .current-consumers b {
    font-size: 17px;
  }
  .correction-button {
    font-size: 11px;
  }
  .trust-after strong {
    font-size: 22px;
  }
  .trust-after p {
    font-size: 10px;
  }
  .trust-after>span {
    font-size: 9px;
  }
  .workspace-heading {
    padding-top: 48px;
  }
  .workspace-heading h2 {
    font-size: 87px;
  }
  .workspace-heading .eyebrow {
    font-size: 10px;
  }
  .workspace-intro {
    margin-top: 27px;
  }
  .workspace-intro p {
    font-size: 11px;
  }
  .demo-app {
    grid-template-columns: 123px 1fr;
  }
  .demo-sidebar {
    padding: 23px 11px;
  }
  .demo-sidebar>strong {
    font-size: 16px;
    margin-bottom: 17px;
  }
  .demo-nav {
    font-size: 9px;
    padding: 9px 10px;
  }
  .demo-sidebar>small {
    font-size: 8px;
  }
  .demo-main {
    padding: 26px 23px;
  }
  .demo-title h3 {
    font-size: 22px;
  }
  .demo-label {
    font-size: 7px;
  }
  .demo-search {
    max-width: 195px;
  }
  .demo-tools {
    gap: 6px;
  }
  .demo-button {
    font-size: 9px;
    padding: 10px 11px;
  }
  .demo-table {
    min-width: 450px;
  }
  .demo-table td {
    padding: 13px 10px;
    font-size: 10px;
  }
  .demo-table th {
    padding: 12px 10px;
    font-size: 8px;
  }
  .demo-table button {
    font-size: 10px;
  }
  .demo-data-cards {
    grid-template-columns: 1fr 1fr;
  }
  .data-card h4 {
    font-size: 14px;
  }
  .data-card strong {
    font-size: 25px;
  }
  .queue-row {
    gap: 16px;
    grid-template-columns: 1fr 80px 70px;
    font-size: 10px;
  }
  .ask-questions button {
    font-size: 10px;
    padding: 9px 12px;
  }
  .ask-output {
    font-size: 12px;
  }
  .workbench-caption {
    gap: 35px;
  }
  .workbench-caption h3 {
    font-size: 24px;
  }
  .workbench-caption p {
    font-size: 11px;
  }
  .capability-line {
    gap: 22px;
    margin-top: 42px;
  }
  .capability-line h4 {
    font-size: 19px;
  }
  .capability-line p {
    font-size: 9px;
  }
  .capability-line span {
    font-size: 8px;
  }
  .freedom-layout {
    gap: 6%;
    padding: 49px 0 35px;
  }
  .freedom-copy h2 {
    font-size: 42px;
  }
  .freedom-copy .eyebrow {
    font-size: 8px;
    letter-spacing: 0;
  }
  .freedom-copy>p {
    font-size: 11px;
  }
  .route-switch button {
    font-size: 10px;
    min-height: 43px;
    padding: 10px 13px;
  }
  .freedom-copy .route-description {
    font-size: 9px;
  }
  .engine-installation {
    height: 447px;
    padding: 0 24px 0 0;
  }
  .machine-boundary {
    height: 310px;
  }
  .machine-caption {
    padding: 17px 12px;
    font-size: 9px;
    gap: 6px;
  }
  .machine-caption small {
    font-size: 6px;
  }
  .system-stack {
    left: 13px;
    right: 50%;
    top: 83px;
    bottom: 29px;
  }
  .system-stack>div {
    padding: 9px 8px;
  }
  .system-stack span {
    font-size: 8px;
  }
  .system-stack small {
    font-size: 5px;
  }
  .engine-slot,.model-cartridge {
    width: 113px;
    height: 130px;
    left: 55%;
    top: 112px;
  }
  .chip-face strong {
    font-size: 11px;
  }
  .chip-face small {
    font-size: 5px;
  }
  .chip-symbol {
    font-size: 25px;
  }
  .chip-task {
    font-size: 6px;
  }
  .engine-slot>small {
    font-size: 6px;
  }
  .engine-installation[data-route=cloud] .model-cartridge {
    left: calc(100% - 88px);
    top: 242px;
  }
  .cloud-space {
    font-size: 8px;
    top: 372px;
  }
  .cloud-space small {
    font-size: 6px;
  }
  .engine-bottom {
    margin-top: 51px;
    font-size: 8px;
    padding-left: 13px;
    gap: 4px;
  }
  .engine-bottom b {
    font-size: 12px;
  }
  .engine-installation[data-route=cloud] .engine-bottom {
    max-width: 158px;
  }
  .human-principle {
    gap: 25px;
  }
  .human-principle b {
    font-size: 19px;
  }
  .human-principle p {
    font-size: 11px;
  }
  .principle-star {
    font-size: 45px;
  }
  .node-details summary {
    font-size: 10px;
  }
  .node-details summary>span:first-child b {
    margin-left: 7px;
  }
  .node-details summary>span:last-child {
    font-size: 8px;
    gap: 16px;
  }
  .node-content {
    gap: 30px;
  }
  .closing-bottom h2 {
    font-size: 30px;
  }
  .download-button {
    min-width: 250px;
    min-height: 55px;
    font-size: 12px;
  }
  .download-group>span {
    font-size: 8px;
  }
  .download-faq {
    gap: 22px;
  }
  .download-faq summary {
    font-size: 10px;
  }
  .download-faq p {
    font-size: 10px;
  }
}
/* Phones get deliberate compositions, not a miniaturized desktop. */
@media (max-width:650px) {
  :root {
    --pad: 23px;
  }
  html {
    scroll-padding-top: 82px;
  }
  .site-header {
    height: 68px;
    gap: 10px;
  }
  .brand img {
    width: 28px;
    height: 28px;
  }
  .brand>span {
    font-size: 20px;
  }
  .desktop-nav {
    display: none;
  }
  .header-actions {
    gap: 9px;
  }
  .header-cta {
    gap: 18px;
    min-height: 36px;
    padding: 8px 11px;
    font-size: 10px;
  }
  .header-cta svg {
    width: 12px;
    height: 12px;
  }
  .motion-button {
    min-width: 28px;
    width: 28px;
  }
  .menu-button {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    width: 26px;
    min-height: 44px;
    padding: 0;
  }
  .menu-button i {
    width: 18px;
    height: 1px;
    background: currentColor;
    transition: transform .3s;
  }
  .menu-button[aria-expanded=true] i:first-child {
    transform: translateY(3px) rotate(45deg);
  }
  .menu-button[aria-expanded=true] i:last-child {
    transform: translateY(-3px) rotate(-45deg);
  }
  .hero-track {
    height: 225svh;
  }
  .hero-sticky {
    min-height: 720px;
    height: 100svh;
  }
  .hero-grid {
    inset: 68px var(--pad) 60px;
    background-size: 25% 100%;
  }
  .hero-copy {
    left: var(--pad);
    right: var(--pad);
    max-width: none;
    top: 123px;
    transform: none;
  }
  .hero-copy .eyebrow {
    font-size: 9px;
    letter-spacing: .04em;
    margin-bottom: 22px;
    gap: 9px;
  }
  .tiny-cross {
    font-size: 19px;
  }
  .hero-copy h1 {
    font-size: clamp(48px,12.7vw,74px);
    line-height: 1.22;
    letter-spacing: -.065em;
  }
  .hero-description {
    font-size: 11px;
    line-height: 1.9;
    margin-top: 17px;
  }
  .hero-actions {
    margin-top: 20px;
    gap: 20px;
  }
  .hero-actions .button {
    font-size: 10px;
    min-height: 43px;
    padding: 11px 15px;
    gap: 25px;
  }
  .hero-platform {
    display: block;
    font-size: 8px;
  }
  .hero-platform b {
    font-size: 8px;
  }
  .hero-shade {
    background: linear-gradient(180deg,#080808 3%,#080808f5 12%,#080808dc 31%,#08080895 42%,#08080822 56%,transparent 73%,#080808 100%);
  }
  .hero-ghost {
    right: 1%;
    font-size: 90vw;
    top: 49%;
  }
  .orbit-engraving {
    top: 47%;
    bottom: 8%;
    left: 7%;
    right: -18%;
    opacity: .7;
  }
  .orbit-engraving>span {
    font-size: 6px;
    bottom: -25px;
  }
  .hero-extract {
    top: 75%;
    left: auto;
    right: 28px;
    min-width: 174px;
    padding: 11px 14px;
    gap: 10px;
    transform: rotate(-4deg);
  }
  .hero-extract small {
    font-size: 7px;
  }
  .hero-extract strong {
    font-size: 28px;
    line-height: 1.4;
  }
  .hero-extract strong span {
    font-size: 18px;
  }
  .extract-line {
    width: 29px;
  }
  .hero-second {
    top: 122px;
  }
  .hero-second h2 {
    font-size: clamp(43px,11.3vw,67px);
  }
  .hero-second .eyebrow {
    font-size: 8px;
    margin-bottom: 21px;
  }
  .hero-second .hero-description {
    font-size: 11px;
    margin-top: 15px;
  }
  .hero-small-note {
    font-size: 9px;
    gap: 20px;
    margin-top: 22px;
  }
  .hero-result {
    left: var(--pad);
    right: var(--pad);
    width: auto;
    top: 52%;
    padding: 18px 18px 15px;
    max-width: none;
  }
  .result-cover {
    padding-bottom: 16px;
    margin-bottom: 2px;
  }
  .result-cover>span {
    font-size: 20px;
  }
  .result-cover small {
    font-size: 7px;
  }
  .hero-table-head,.hero-table-row {
    grid-template-columns: .8fr 1.2fr .7fr .8fr;
    font-size: 10px;
    padding: 12px 0;
    gap: 8px;
  }
  .hero-table-head {
    font-size: 8px;
    padding: 11px 0;
  }
  .hero-table-row>:first-child {
    font-size: 8px;
  }
  .hero-table-row>:last-child {
    font-size: 11px;
  }
  .hero-table-foot {
    font-size: 7px;
    margin-top: 17px;
    gap: 8px;
  }
  .hero-footer {
    bottom: 20px;
    gap: 16px;
  }
  .scroll-cue {
    font-size: 8px;
    gap: 10px;
  }
  .scroll-cue svg {
    width: 16px;
    height: 28px;
  }
  .scroll-cue small {
    font-size: 6px;
    letter-spacing: .06em;
  }
  .hero-steps {
    font-size: 6px;
    gap: 7px;
  }
  .hero-steps i {
    width: 11px;
  }
  .paper-fallback {
    perspective-origin: 50% 75%;
  }
  .format-strip {
    display: block;
    padding: 25px var(--pad) 28px;
  }
  .format-strip>span {
    font-size: 12px;
  }
  .format-strip>div {
    margin-top: 15px;
    gap: 16px;
    flex-wrap: wrap;
  }
  .format-strip b {
    font-size: 9px;
  }
  .format-strip>div>span {
    font-size: 20px;
    margin: 0 2px;
  }
  .format-strip strong {
    font-size: 10px;
  }
  .section {
    padding-left: var(--pad);
    padding-right: var(--pad);
  }
  .chapter-line {
    padding: 21px 0;
    font-size: 10px;
    letter-spacing: .04em;
    gap: 10px;
  }
  .chapter-line b {
    font-size: 9px;
    margin-right: 12px;
  }
  .chapter-line small {
    font-size: 6px;
    letter-spacing: .04em;
    max-width: 56%;
    text-align: right;
    line-height: 1.7;
  }
  .understand {
    padding-top: 21px;
    padding-bottom: 33px;
  }
  .section-heading {
    display: block;
    padding: 33px 0 28px;
  }
  .section-heading h2 {
    font-size: clamp(41px,10.6vw,59px);
    letter-spacing: -.06em;
    line-height: 1.24;
  }
  .heading-copy {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 13px;
    padding: 0;
    margin-top: 24px;
  }
  .heading-copy p {
    font-size: 10px;
    line-height: 1.9;
  }
  .mode-switch {
    margin-top: 0;
    max-width: none;
    flex-shrink: 0;
  }
  .mode-switch button {
    font-size: 9px;
    padding: 9px 10px;
    min-height: 40px;
  }
  .mode-switch button span {
    margin-left: 5px;
  }
  .meaning-stage {
    display: flex;
    flex-direction: column;
    gap: 32px;
    min-height: 0;
    padding: 0;
  }
  .source-side {
    width: 100%;
  }
  .source-rail {
    margin-bottom: 22px;
    gap: 15px;
  }
  .source-rail button {
    font-size: 11px;
    min-height: 49px;
  }
  .source-rail small {
    font-size: 7px;
    margin-left: 5px;
  }
  .source-stack {
    width: 89%;
    max-width: 365px;
  }
  .source-paper {
    padding: 23px 23px 25px;
    min-height: 374px;
  }
  .source-paper h4 {
    font-size: 23px;
  }
  .doc-field,.doc-price {
    font-size: 11px;
  }
  .doc-price b {
    font-size: 11px;
  }
  .source-paper .doc-top {
    margin-bottom: 19px;
    font-size: 7px;
  }
  .doc-item {
    margin: 18px 0;
  }
  .doc-price.total {
    margin-top: 14px;
    padding-top: 14px;
  }
  .doc-price.total b {
    font-size: 23px;
  }
  .source-meta {
    font-size: 8px;
    margin-top: 23px;
    padding: 0 5%;
  }
  .meaning-output {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 14px;
    align-items: start;
    padding: 24px 0 0;
    border-top: 1px solid #2f2f2f30;
  }
  .output-caption {
    grid-column: 1/-1;
    margin-bottom: 19px;
    font-size: 9px;
  }
  .intent-corner {
    font-size: 21px;
  }
  .meaning-output h3 {
    font-size: 25px;
    line-height: 1.4;
    grid-column: 1;
  }
  .answer-number {
    font-size: clamp(66px,18vw,100px);
    grid-column: 2;
    grid-row: 2;
    margin: 0;
    text-align: right;
    line-height: 1.25;
    align-self: center;
  }
  .answer-number>span {
    font-size: .25em;
    margin: 10px 4px 0 0;
  }
  .answer-number small {
    font-size: .37em;
  }
  .answer-rule {
    grid-column: 2;
    grid-row: 3;
    text-align: right;
    font-size: 8px;
    letter-spacing: .01em;
    margin: 5px 0 14px;
    white-space: nowrap;
  }
  .meaning-fields {
    grid-column: 1/-1;
    justify-content: space-between;
    gap: 15px;
    margin-top: 10px;
  }
  .meaning-fields button {
    font-size: 12px;
    padding: 14px 0;
  }
  .meaning-fields button small {
    font-size: 9px;
  }
  .meaning-explanation {
    grid-column: 1/-1;
    font-size: 11px;
    margin-top: 4px;
  }
  .meaning-explanation br {
    display: none;
  }
  .meaning-bridge {
    display: none;
  }
  .literal .meaning-output h3 {
    grid-column: 1/-1;
    font-size: 28px;
  }
  .literal .literal-output {
    grid-column: 1/-1;
    margin: 17px 0 0;
    font-size: 11px;
  }
  .literal .meaning-explanation {
    margin-top: 15px;
  }
  .semantic-bottom {
    display: block;
    margin-top: 29px;
    padding-top: 26px;
  }
  .semantic-bottom>div:first-child {
    font-size: 25px;
  }
  .word-equivalence {
    justify-content: space-between;
    margin-top: 21px;
    gap: 8px;
    font-size: 11px;
  }
  .word-equivalence>span {
    font-size: 9px;
  }
  .word-equivalence i {
    font-size: 23px;
    margin: 0 2px;
  }
  .word-equivalence b {
    font-size: 11px;
  }
  .section-note {
    font-size: 9px;
    margin-top: 21px;
    line-height: 1.9;
  }
  .intention {
    padding-top: 21px;
    padding-bottom: 32px;
  }
  .intention-heading {
    display: block;
    padding: 34px 0 31px;
  }
  .intention-heading h2 {
    font-size: clamp(40px,10.3vw,57px);
    line-height: 1.25;
  }
  .intention-heading .eyebrow {
    font-size: 9px;
    margin-bottom: 20px;
  }
  .intention-heading>p {
    font-size: 11px;
    line-height: 1.95;
    margin-top: 22px;
    padding: 0;
  }
  .intention-heading>p br:first-child {
    display: none;
  }
  .intention-heading>p br+strong {
    font-size: 11px;
  }
  .intent-tabs button {
    padding: 18px 12px 19px;
    gap: 9px;
  }
  .intent-tabs button:first-child {
    padding-left: 0;
  }
  .intent-tabs button b {
    display: none;
  }
  .intent-tabs span {
    font-size: 18px;
    letter-spacing: -.06em;
  }
  .intent-tabs small {
    font-size: 6px;
    letter-spacing: .07em;
  }
  .intent-stage {
    display: block;
    min-height: 630px;
    padding: 32px 0 35px;
    perspective: 1500px;
  }
  .intent-input {
    max-width: 300px;
    width: 80%;
    margin-left: 1%;
    transform: rotate(-5deg);
    position: relative;
  }
  .intent-source {
    min-height: 276px;
    padding: 22px 23px 24px;
  }
  .intent-source h4 {
    font-size: 22px;
  }
  .intent-source>small {
    font-size: 7px;
    margin-bottom: 19px;
  }
  .intent-source .source-question {
    font-size: 11px;
    line-height: 2;
  }
  .intent-source .source-handwriting {
    font-size: 23px;
    margin-top: 15px;
  }
  .intent-source .source-footer {
    margin-top: 18px;
    font-size: 8px;
    padding-top: 12px;
  }
  .mini-bill {
    margin-top: 16px;
    font-size: 10px;
  }
  .mini-bill>div {
    padding: 8px 0;
  }
  .mini-bill b {
    font-size: 10px;
  }
  .intent-connector {
    display: none;
  }
  .intent-result {
    width: 86%;
    max-width: 350px;
    margin: -9px 0 0 auto;
    transform: rotate(2deg);
    padding: 23px 24px 20px;
    min-height: 284px;
  }
  .intent-result>small {
    font-size: 7px;
    margin-bottom: 16px;
    padding-bottom: 12px;
  }
  .intent-result h4 {
    font-size: 22px;
  }
  .intent-result-fields>div {
    font-size: 11px;
    padding: 10px 0;
    gap: 15px;
  }
  .intent-result-fields>div>span {
    font-size: 9px;
  }
  .intent-result .intent-result-fields {
    margin-top: 15px;
  }
  .intent-result .result-caption {
    font-size: 8px;
    margin-top: 10px;
    padding-top: 12px;
  }
  .intent-id {
    left: 1%;
    bottom: 34px;
    font-size: 70px;
  }
  .intent-id span {
    font-size: 6px;
    left: 54px;
    bottom: 10px;
  }
  .intent-blueprint {
    inset: 20px -20px 0;
    background-size: 27px 27px;
    transform: perspective(1000px) rotateX(35deg) rotateZ(-15deg) scale(1.1);
  }
  .intent-foot {
    display: block;
    padding-top: 24px;
  }
  .intent-foot>p {
    font-size: 22px;
    line-height: 1.6;
  }
  .intent-foot .text-link {
    font-size: 10px;
    margin-top: 10px;
    gap: 35px;
  }
  .template-editor {
    grid-template-columns: 1fr;
    padding: 22px 18px;
    gap: 19px;
    margin-top: 24px;
  }
  .template-editor h3 {
    font-size: 19px;
  }
  .template-editor p {
    font-size: 10px;
  }
  .template-editor form {
    gap: 12px;
  }
  .template-editor .button {
    font-size: 10px;
    padding: 12px 15px;
  }
  .template-editor input {
    font-size: 11px;
  }
  .custom-fields {
    gap: 8px;
  }
  .custom-fields>span {
    font-size: 10px;
  }
  .template-editor .editor-note {
    font-size: 9px;
  }
  .vision {
    padding-top: 21px;
    padding-bottom: 45px;
  }
  .vision-layout {
    display: block;
    padding-top: 33px;
  }
  .vision-copy h2 {
    font-size: clamp(41px,10.7vw,59px);
    min-height: 2.5em;
  }
  .vision-copy .eyebrow {
    font-size: 9px;
    margin-bottom: 21px;
  }
  .vision-copy>p {
    font-size: 11px;
    margin-top: 20px;
    line-height: 1.95;
  }
  .vision-tabs {
    display: flex;
    max-width: none;
    margin-top: 26px;
  }
  .vision-tabs button {
    flex: 1;
    border-bottom: 1px solid #21212130;
    gap: 9px;
    font-size: 11px;
    padding: 9px 6px;
    min-height: 52px;
    justify-content: flex-start;
  }
  .vision-tabs button span {
    font-size: 8px;
  }
  .vision-tabs button b {
    display: none;
  }
  .vision-tabs button.active {
    padding-left: 6px;
    box-shadow: 0 1px 0 currentColor;
  }
  .vision-copy .quiet-note {
    font-size: 9px;
    margin-top: 18px;
  }
  .vision-evidence {
    padding: 0 8px 0 0;
    margin-top: 31px;
  }
  .scan-surround {
    padding: 14px 17px;
    transform: perspective(1400px) rotateY(-4deg) rotateX(2deg);
  }
  .scan-registration {
    font-size: 6px;
    padding-bottom: 11px;
  }
  .scan-registration.bottom {
    font-size: 7px;
    padding-top: 11px;
  }
  .inspection-document {
    padding: 23px 22px;
  }
  .inspection-document h3 {
    font-size: 22px;
    margin: 21px 0;
  }
  .inspection-top,.inspection-top small {
    font-size: 6px;
  }
  .inspection-meta {
    font-size: 8px;
    gap: 6px;
  }
  .inspection-check {
    font-size: 10px;
    gap: 8px;
    margin: 25px 0;
  }
  .drawn-check,.empty-check {
    width: 17px;
    height: 17px;
    font-size: 22px;
  }
  .empty-check {
    margin-left: 17px;
  }
  .inspection-table {
    font-size: 9px;
    margin-bottom: 19px;
  }
  .inspection-row.head {
    font-size: 8px;
  }
  .inspection-row>span {
    padding: 9px 7px;
  }
  .inspection-bottom {
    font-size: 9px;
  }
  .vision-readout {
    padding-left: 18px;
    margin: 26px 0 0 7%;
    gap: 20px;
  }
  .vision-readout strong {
    font-size: 14px;
    line-height: 1.8;
  }
  .vision-focus>span {
    font-size: 7px;
    top: -22px;
  }
  .trust {
    padding-top: 21px;
    padding-bottom: 35px;
  }
  .trust-heading {
    display: block;
    padding: 34px 0 32px;
  }
  .trust-heading h2 {
    font-size: clamp(38px,9.8vw,54px);
    line-height: 1.3;
  }
  .trust-heading>p {
    font-size: 11px;
    max-width: none;
    padding: 0;
    margin-top: 20px;
  }
  .trust-machine {
    display: block;
    padding-bottom: 26px;
  }
  .trust-evidence {
    position: relative;
    padding: 0 0 0 0;
  }
  .trust-evidence .panel-label {
    margin-bottom: 25px;
  }
  .panel-label {
    padding: 14px 0;
    font-size: 9px;
    margin-bottom: 25px;
  }
  .panel-label small {
    font-size: 9px;
  }
  .panel-label>span {
    font-size: 8px;
  }
  .trust-receipt {
    max-width: 252px;
    margin: 0 auto;
    transform: rotate(-5deg);
    padding: 24px 27px;
  }
  .receipt-top {
    font-size: 23px;
  }
  .trust-receipt>small {
    font-size: 7px;
    margin: 9px 0 15px;
  }
  .receipt-dashed {
    margin-bottom: 15px;
  }
  .trust-receipt>div:not(.receipt-top):not(.receipt-dashed):not(.barcode) {
    font-size: 10px;
    margin: 12px 0;
  }
  .trust-receipt .receipt-total {
    padding-top: 16px;
    margin-top: 19px !important;
  }
  .barcode {
    height: 27px;
    margin-top: 18px;
  }
  .trust-receipt>p {
    margin-top: 10px;
  }
  .source-pin {
    font-size: 8px;
    margin: 22px auto 0;
  }
  .trust-current {
    margin-top: 28px;
  }
  .trust-current .panel-label {
    margin-bottom: 23px;
  }
  .current-label {
    font-size: 12px;
  }
  .current-number {
    font-size: clamp(98px,29vw,150px);
    line-height: 1.2;
    margin: 3px 0 12px;
    justify-content: center;
  }
  .current-number>span {
    font-size: .23em;
  }
  .current-number>small {
    font-size: .4em;
  }
  .rule-state {
    margin-top: 10px;
    padding-top: 18px;
    gap: 14px;
  }
  .rule-state strong {
    font-size: 12px;
  }
  .rule-state>div>span {
    font-size: 10px;
    margin-top: 7px;
  }
  .correction-button {
    font-size: 11px;
    min-height: 52px;
    padding: 14px 19px;
    margin-top: 22px;
  }
  .correction-button>span {
    font-size: 9px;
  }
  .current-consumers span {
    font-size: 9px;
  }
  .current-consumers b {
    font-size: 19px;
  }
  .trust-history {
    display: block;
    margin-top: 30px;
  }
  .trust-history .panel-label {
    margin-bottom: 23px;
  }
  .history-track {
    gap: 27px;
    padding-top: 0;
  }
  .history-track article {
    padding-top: 16px;
  }
  .history-track small {
    font-size: 7px;
  }
  .history-track h4 {
    font-size: 12px;
    margin-top: 9px;
  }
  .history-track p {
    font-size: 11px;
    margin-top: 8px;
  }
  .history-track article.pending p {
    font-size: 10px;
  }
  .trust-history .reset-button {
    font-size: 10px;
    margin-top: 16px;
    min-height: 36px;
  }
  .trust-after {
    display: block;
    padding-top: 23px;
  }
  .trust-after strong {
    font-size: 23px;
  }
  .trust-after p {
    font-size: 10px;
  }
  .trust-after>span {
    font-size: 9px;
    display: block;
    margin-top: 15px;
    line-height: 1.9;
  }
  .workspace {
    padding-top: 21px;
    padding-bottom: 35px;
  }
  .workspace-heading {
    padding: 35px 0 25px;
  }
  .workspace-heading .eyebrow {
    font-size: 9px;
    margin-bottom: 20px;
  }
  .workspace-heading h2 {
    font-size: clamp(51px,13.7vw,79px);
  }
  .heading-dot {
    font-size: 9px;
    margin-top: 6px;
    margin-left: 7px;
  }
  .workspace-intro {
    display: block;
    margin-top: 26px;
  }
  .workspace-intro p {
    font-size: 11px;
  }
  .workspace-intro .text-link {
    font-size: 10px;
    margin-top: 12px;
    gap: 40px;
  }
  .workbench-tabs {
    gap: 0;
    justify-content: space-between;
  }
  .workbench-tabs button {
    font-size: 11px;
    min-height: 59px;
    gap: 5px;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: 9px 4px 12px;
  }
  .workbench-tabs button span {
    font-size: 7px;
  }
  .workbench {
    margin-top: 23px;
    margin-left: -7px;
    margin-right: -7px;
    padding: 4px;
    border-radius: 4px;
    box-shadow: 0 14px 27px #2c2c2c1c;
  }
  .window-bar {
    height: 34px;
    padding: 0 8px 3px;
    gap: 8px;
    font-size: 8px;
  }
  .window-bar img {
    width: 17px;
    height: 17px;
  }
  .window-bar>span:first-child {
    gap: 7px;
  }
  .window-bar b {
    font-size: 7px;
  }
  .window-bar button {
    font-size: 7px;
    min-height: 30px;
    gap: 8px;
  }
  .window-bar button svg {
    width: 11px;
    height: 11px;
  }
  .window-bar>span:last-child {
    font-size: 6px;
    line-height: 1.6;
  }
  .workbench-caption {
    display: block;
    margin-top: 25px;
  }
  .workbench-caption h3 {
    font-size: 25px;
  }
  .workbench-caption p {
    font-size: 11px;
    line-height: 1.95;
    margin-top: 13px;
  }
  .capability-line {
    display: block;
    margin-top: 31px;
    padding-top: 0;
    border-top: 1px solid #33333330;
  }
  .capability-line>div {
    display: grid;
    grid-template-columns: 68px 1fr;
    gap: 6px 14px;
    padding: 23px 0;
    border-bottom: 1px solid #33333320;
    align-items: center;
  }
  .capability-line span {
    font-size: 8px;
    grid-row: 1/3;
  }
  .capability-line h4 {
    font-size: 21px;
    margin: 0;
  }
  .capability-line p {
    font-size: 10px;
    margin: 0;
    line-height: 1.8;
  }
  .workflow-details {
    margin-top: 20px;
    border: 0;
  }
  .workflow-details summary {
    min-height: 51px;
    font-size: 11px;
  }
  .workflow-details>div {
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 12px 0;
  }
  .workflow-details p {
    font-size: 11px;
  }
  .demo-app {
    grid-template-columns: 1fr;
    min-height: 450px;
  }
  .demo-screen {
    min-height: 450px;
  }
  .demo-sidebar {
    display: none;
  }
  .demo-main {
    padding: 23px 15px;
  }
  .demo-title h3 {
    font-size: 21px;
  }
  .demo-label {
    font-size: 6px;
    padding: 5px 6px;
  }
  .demo-description {
    font-size: 10px;
    margin-top: 8px;
  }
  .demo-toolbar {
    flex-wrap: wrap;
    gap: 11px;
    align-items: stretch;
    margin-top: 20px;
    margin-bottom: 15px;
  }
  .demo-search {
    max-width: 100%;
    width: 100%;
    flex: 1;
    min-width: 100px;
    font-size: 10px;
    min-height: 40px;
    padding: 10px;
  }
  .demo-tools {
    gap: 6px;
  }
  .demo-button {
    font-size: 9px;
    min-height: 40px;
    padding: 9px 10px;
  }
  .demo-table {
    min-width: 405px;
  }
  .demo-table td {
    padding: 12px 9px;
    font-size: 10px;
  }
  .demo-table th {
    font-size: 8px;
    padding: 12px 9px;
  }
  .demo-table button {
    font-size: 10px;
  }
  .demo-table td small {
    font-size: 7px;
  }
  .demo-total {
    font-size: 9px;
    gap: 10px;
    margin-top: 15px;
  }
  .demo-total strong {
    font-size: 14px;
    margin-left: 6px;
  }
  .demo-note {
    font-size: 9px;
    line-height: 1.8;
    margin-top: 17px;
  }
  .demo-data-cards {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .data-card {
    padding: 14px 12px;
  }
  .data-card small {
    font-size: 7px;
  }
  .data-card h4 {
    font-size: 14px;
    margin: 9px 0 5px;
  }
  .data-card p {
    font-size: 8px;
  }
  .data-card strong {
    font-size: 25px;
    line-height: 1.6;
  }
  .data-card button {
    font-size: 9px;
  }
  .queue-summary {
    gap: 34px;
    margin-top: 26px;
    margin-bottom: 23px;
  }
  .queue-summary>div {
    font-size: 30px;
  }
  .queue-summary small {
    font-size: 9px;
  }
  .queue-row {
    font-size: 10px;
    gap: 17px;
    grid-template-columns: 1fr 60px 62px;
    padding: 16px 0;
  }
  .queue-row small {
    font-size: 7px;
  }
  .queue-status {
    font-size: 9px;
  }
  .queue-status button {
    font-size: 9px;
    min-height: 34px;
  }
  .ask-scope {
    font-size: 9px;
    gap: 7px;
    margin-top: 23px;
  }
  .ask-scope button {
    font-size: 9px;
    padding: 8px 10px;
    min-height: 35px;
  }
  .ask-questions {
    gap: 8px;
  }
  .ask-questions button {
    font-size: 10px;
    min-height: 40px;
    padding: 9px 12px;
  }
  .ask-output {
    padding: 17px 17px;
    font-size: 12px;
    line-height: 2;
  }
  .ask-output small {
    font-size: 9px;
  }
  .ask-stale {
    font-size: 9px;
  }
  .freedom {
    padding-top: 21px;
    padding-bottom: 22px;
  }
  .freedom-layout {
    display: block;
    padding: 34px 0 25px;
  }
  .freedom-copy h2 {
    font-size: clamp(42px,11vw,60px);
    line-height: 1.25;
  }
  .freedom-copy .eyebrow {
    font-size: 9px;
    margin-bottom: 22px;
  }
  .freedom-copy>p {
    font-size: 11px;
    margin-top: 22px;
  }
  .route-switch {
    margin-top: 22px;
    max-width: 280px;
  }
  .route-switch button {
    font-size: 11px;
    min-height: 47px;
    padding: 11px 18px;
  }
  .freedom-copy .route-description {
    font-size: 10px;
    max-width: none;
    line-height: 1.9;
    min-height: 57px;
    margin-top: 19px;
  }
  .engine-installation {
    height: 440px;
    max-width: 480px;
    padding: 0 30px 0 0;
    margin: 23px auto 0;
  }
  .engine-measure {
    font-size: 8px;
    margin-bottom: 19px;
  }
  .machine-boundary {
    height: 307px;
  }
  .machine-caption {
    font-size: 10px;
    padding: 18px 16px;
  }
  .machine-caption small {
    font-size: 7px;
  }
  .system-stack {
    left: 17px;
    right: 53%;
    top: 84px;
    bottom: 26px;
  }
  .system-stack>div {
    padding: 10px;
  }
  .system-stack span {
    font-size: 9px;
  }
  .system-stack small {
    font-size: 5px;
  }
  .model-cartridge,.engine-slot {
    left: 54%;
    width: 130px;
    height: 139px;
    top: 107px;
  }
  .chip-face strong {
    font-size: 12px;
  }
  .chip-face small {
    font-size: 6px;
  }
  .chip-task {
    font-size: 7px;
    margin-top: 8px;
  }
  .chip-symbol {
    font-size: 25px;
    margin-bottom: 7px;
  }
  .engine-slot>small {
    font-size: 7px;
  }
  .engine-installation[data-route=cloud] .model-cartridge {
    left: calc(100% - 107px);
    top: 238px;
  }
  .cloud-space {
    top: 375px;
    font-size: 9px;
    right: 2px;
  }
  .cloud-space small {
    font-size: 7px;
  }
  .engine-bottom {
    margin-top: 48px;
    padding-left: 15px;
    font-size: 9px;
    gap: 5px;
  }
  .engine-bottom b {
    font-size: 13px;
  }
  .engine-installation[data-route=cloud] .engine-bottom {
    max-width: 190px;
  }
  .human-principle {
    padding: 27px 0;
    gap: 20px;
    align-items: flex-start;
  }
  .principle-star {
    font-size: 39px;
    margin-top: 5px;
  }
  .human-principle p {
    font-size: 10px;
    line-height: 2;
  }
  .human-principle b {
    font-size: 18px;
    line-height: 1.8;
  }
  .node-details summary {
    min-height: 90px;
    gap: 15px;
    align-items: center;
    font-size: 11px;
    line-height: 1.8;
  }
  .node-details summary>span:first-child b {
    display: block;
    margin: 0;
    font-size: 12px;
  }
  .node-details summary>span:last-child {
    font-size: 7px;
    gap: 9px;
  }
  .node-details summary svg {
    width: 17px;
    height: 17px;
  }
  .node-content {
    display: block;
    padding: 0 0 24px;
  }
  .node-content p {
    font-size: 10px;
    line-height: 1.9;
  }
  .node-chain {
    font-size: 9px;
    gap: 9px;
    margin-top: 20px;
  }
  .node-chain b {
    font-size: 20px;
    padding: 14px 23px;
  }
  .closing {
    padding-top: 21px;
  }
  .closing-type {
    font-size: 42vw;
    line-height: 1.4;
    padding: 13px 8% 0 0;
    letter-spacing: -.1em;
  }
  .closing-type>i {
    font-size: 20px;
    top: 20%;
  }
  .closing-bottom {
    display: block;
    margin: 22px 0 32px;
  }
  .closing-bottom h2 {
    font-size: 30px;
    line-height: 1.5;
  }
  .closing-bottom p {
    font-size: 12px;
    letter-spacing: .08em;
    margin-top: 10px;
  }
  .download-group {
    margin-top: 27px;
    gap: 13px;
  }
  .download-button {
    min-width: 0;
    width: 100%;
    min-height: 57px;
    font-size: 12px;
    padding: 15px 20px;
  }
  .download-group>span {
    font-size: 8px;
  }
  .download-faq {
    display: block;
    padding-bottom: 20px;
    margin-top: 33px;
  }
  .download-faq details {
    border-color: #2f2f2f33;
  }
  .download-faq summary {
    font-size: 11px;
    min-height: 61px;
  }
  .download-faq p {
    font-size: 11px;
    line-height: 1.95;
  }
  .download-faq a {
    font-size: 10px;
  }
  footer {
    flex-wrap: wrap;
    padding: 24px 0;
    gap: 14px;
  }
  .footer-brand {
    font-size: 15px;
    gap: 9px;
  }
  .footer-brand img {
    width: 25px;
    height: 25px;
  }
  .footer-brand small {
    font-size: 7px;
    margin-left: 5px;
  }
  footer>div {
    gap: 16px;
    margin-left: auto;
  }
  footer>div a,footer>div button {
    font-size: 8px;
    min-height: 36px;
  }
  footer>span {
    display: block;
    font-size: 6px;
    width: 100%;
    letter-spacing: .1em;
    padding-top: 5px;
  }
  .source-dialog {
    padding: 18px 22px;
  }
  .source-dialog h2 {
    font-size: 27px;
  }
  .source-dialog p {
    font-size: 11px;
    margin-top: 16px;
  }
  .dialog-bar {
    font-size: 10px;
    gap: 15px;
    margin-bottom: 18px;
    padding-bottom: 10px;
  }
  .product-dialog {
    padding: 12px;
  }
  .product-dialog>a {
    font-size: 10px;
    margin-top: 17px;
  }
  .record-dialog {
    padding: 18px 22px;
  }
  .record-dialog h3 {
    font-size: 24px;
  }
  .record-facts>div {
    font-size: 11px;
  }
  .toast {
    font-size: 11px;
    padding: 12px 16px;
    bottom: 20px;
  }
  .opening-word {
    font-size: 42px;
  }
  .opening-word>span {
    font-size: 44px;
  }
  .opening-word small {
    font-size: 8px;
    margin-left: 14px;
  }
}
@media (max-width:370px) {
  :root {
    --pad: 18px;
  }
  .header-actions {
    gap: 4px;
  }
  .header-cta {
    gap: 11px;
    font-size: 9px;
  }
  .brand>span {
    font-size: 19px;
  }
  .brand img {
    width: 26px;
    height: 26px;
  }
  .hero-copy {
    top: 117px;
  }
  .hero-copy h1 {
    font-size: 12.7vw;
  }
  .hero-copy .eyebrow {
    font-size: 8px;
  }
  .hero-second h2 {
    font-size: 11.3vw;
  }
  .hero-result {
    top: 53%;
    padding: 16px 14px 14px;
  }
  .hero-table-head,.hero-table-row {
    font-size: 9px;
    gap: 7px;
    padding: 11px 0;
  }
  .hero-table-row>:last-child {
    font-size: 10px;
  }
  .hero-steps {
    gap: 5px;
    font-size: 6px;
  }
  .hero-steps i {
    width: 7px;
  }
  .scroll-cue {
    font-size: 7px;
  }
  .scroll-cue small {
    font-size: 5px;
  }
  .format-strip>div {
    gap: 12px;
  }
  .format-strip strong {
    font-size: 9px;
  }
  .heading-copy {
    gap: 10px;
  }
  .heading-copy p {
    font-size: 9px;
  }
  .mode-switch button {
    font-size: 8px;
    padding: 9px;
  }
  .source-rail button {
    font-size: 10px;
  }
  .source-rail small {
    font-size: 6px;
    margin-left: 3px;
  }
  .source-stack {
    width: 91%;
  }
  .source-paper {
    padding: 21px;
  }
  .meaning-output h3 {
    font-size: 23px;
  }
  .answer-number {
    font-size: 18vw;
  }
  .word-equivalence {
    gap: 6px;
  }
  .word-equivalence>span {
    font-size: 8px;
  }
  .word-equivalence b {
    font-size: 10px;
  }
  .intent-tabs span {
    font-size: 16px;
  }
  .intent-tabs small {
    font-size: 5px;
  }
  .intent-tabs button {
    padding-left: 10px;
    padding-right: 10px;
  }
  .intent-result {
    width: 87%;
    padding: 21px;
  }
  .intent-source {
    padding: 22px 20px;
  }
  .vision-tabs button {
    font-size: 10px;
    gap: 7px;
  }
  .inspection-document {
    padding: 20px 17px;
  }
  .inspection-document h3 {
    font-size: 20px;
  }
  .inspection-meta {
    font-size: 7px;
  }
  .inspection-row>span {
    padding: 8px 6px;
  }
  .inspection-table {
    font-size: 8px;
  }
  .inspection-row.head {
    font-size: 7px;
  }
  .model-cartridge,.engine-slot {
    width: 114px;
    height: 134px;
    left: 54%;
  }
  .engine-installation[data-route=cloud] .model-cartridge {
    left: calc(100% - 91px);
  }
  .system-stack {
    right: 53%;
    left: 14px;
  }
  .system-stack span {
    font-size: 8px;
  }
  .machine-caption small {
    font-size: 6px;
  }
  .engine-installation[data-route=cloud] .engine-bottom {
    max-width: 158px;
  }
  .demo-toolbar {
    display: block;
  }
  .demo-tools {
    margin-top: 10px;
    justify-content: flex-end;
  }
  .demo-label {
    font-size: 5px;
  }
  .demo-title h3 {
    font-size: 20px;
  }
  .human-principle {
    gap: 16px;
  }
  .human-principle b {
    font-size: 17px;
  }
  .closing-bottom h2 {
    font-size: 27px;
  }
  footer>div {
    gap: 12px;
  }
  footer>div a,footer>div button {
    font-size: 7px;
  }
}
@media (min-width:651px) and (max-height:620px) {
  .hero-sticky {
    min-height: 580px;
  }
  .hero-copy .eyebrow {
    margin-bottom: 20px;
  }
  .hero-copy h1 {
    font-size: clamp(49px,6.2vw,84px);
  }
  .hero-second h2 {
    font-size: clamp(45px,5.8vw,79px);
  }
  .hero-description {
    font-size: 11px;
    margin-top: 19px;
  }
  .hero-actions {
    margin-top: 22px;
  }
  .hero-extract {
    top: 72%;
  }
  .hero-footer {
    bottom: 15px;
  }
  .hero-result {
    padding: 17px 21px;
  }
  .hero-table-head,.hero-table-row {
    padding: 10px 0;
  }
}
@media (prefers-reduced-motion:reduce) {
  html {
    scroll-behavior: auto;
  }
  *,*:before,*:after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .js .reveal {
    opacity: 1;
    transform: none;
  }
  .js .booting .opening {
    display: none;
  }
  .scan-surround,.intent-input,.intent-result,.model-cartridge {
    transition: none;
  }
  .hero-sticky {
    scroll-behavior: auto;
  }
}
/* Contain the rotated blueprint: a decorative transform must not widen the
   mobile visual viewport or move fixed navigation off screen. */
.intention {
  overflow: hidden;
}
/* Extracted meaning keeps a continuous path from source paper to table cell. */
.hero-semantic {
  position: absolute;
  inset: 0;
  z-index: 5;
  pointer-events: none;
  opacity: 0;
}
.hero-token {
  position: absolute;
  display: block;
  padding: 8px 13px;
  background: #ffffff;
  color: #181818;
  border: 1px solid #fff7;
  box-shadow: 0 9px 30px #0005;
  font-size: 11px;
  white-space: nowrap;
  will-change: transform;
  transform: translate(-50%,-50%);
}
.hero-token.number {
  font: 12px var(--mono);
  letter-spacing: -.03em;
}
@media (max-width:650px) {
  .hero-token {
    font-size: 10px;
    padding: 7px 10px;
  }
  .hero-token.number {
    font-size: 11px;
  }
}
/* Keep the complete result and scroll cue separate, including short phones. */
@media (max-width:650px) {
  .hero-second {
    top: 111px;
  }
  .hero-second .hero-small-note {
    display: none;
  }
  .hero-second .hero-description {
    font-size: 10px;
  }
  .hero-result {
    top: clamp(325px,52%,calc(100% - 385px));
  }
  .hero-table-row {
    padding: 9px 0;
  }
  .hero-table-head {
    padding: 9px 0;
  }
  .hero-table-foot {
    margin-top: 13px;
  }
}
/* Fixed display lettering. SVG paths preserve the intended serif contrast on
   systems without a Chinese serif family; ordinary copy remains real text. */
.glyph-word { white-space:nowrap; letter-spacing:0; }
.glyph-word>.word-glyphs { height:1em; display:inline-block; vertical-align:-.13em; overflow:visible; fill:currentColor; stroke:none; }
.closing-type .closing-outline { display:block; height:1em; color:var(--ink); fill:none; stroke:currentColor; stroke-width:2; }
/* A pause may stop ambience, never leave a newly updated fact half-visible. */
.paused .current-number.changed>b{animation:none!important;filter:none;opacity:1;transform:none}
.trust-machine.corrected .trust-branch>i{background:transparent}

/* ── BLACK / WHITE · Edition 02 ──────────────────────────────────────
   The stage is white, not paper. A slight warmth belongs only to evidence.
   This block is intentionally consolidated for the art-to-engineering handoff. */
:root { --ink:#080808; --paper:#ffffff; --white:#ffffff; --evidence:#f6f5f1; --silver:#b8b8b8; }
html { scroll-behavior:auto; }
.section:focus { outline:none; }
.light,.format-strip { background:#ffffff; }
.dark,.hero-track,.trust,.freedom { background:#080808; }
.site-header { background:rgba(8,8,8,.95); }
.site-header.is-light { background:rgba(255,255,255,.96); color:#080808; }
.source-paper,.trust-receipt,.inspection-document,.intent-source { background:var(--evidence); }
.source-paper.order-paper { background:#ffffff; border:1px solid #dedede; }
.source-paper.receipt-paper { background:var(--evidence); }
.hero-result,.intent-result { background:#ffffff; }
.hero-extract { background:linear-gradient(125deg,#ffffff 12%,#ededed 62%,#f9f9f9); }
.paper-back { background:#eeeeee; }
.light .source-meta,.light .section-note { color:#606060; }
.hero-copy button { pointer-events:auto; }
.hero-track { height:350svh; }
.hero-middle { opacity:0; visibility:hidden; max-width:48%; }
.hero-middle h2 { font-size:clamp(55px,6.3vw,92px); line-height:1.25; }
.hero-skip { font-size:10px; color:#b8b8b8; display:inline-flex; min-height:44px; align-items:center; border-bottom:1px solid #555; }
.hero-skip:hover { color:white; border-color:white; }
.hero-actions { flex-wrap:wrap; row-gap:10px; }
.hero-next { margin-top:25px; min-height:44px; font-size:11px; width:194px; }
.hero-steps { gap:12px; }
.hero-steps button { padding:10px 2px; min-height:44px; color:#ababab; font:10px var(--mono); transition:color .3s; position:relative; }
.hero-steps button.active { color:#ffffff; }
.hero-steps button::after { position:absolute; content:""; left:2px; right:2px; bottom:6px; height:1px; background:white; transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease); }
.hero-steps button.active::after { transform:scaleX(1); }
.hero-footer { min-height:44px; }
.tour-controls { display:flex; align-items:center; gap:17px; font-size:10px; }
.tour-controls button,.tour-controls a { padding:9px 0; min-height:44px; display:inline-flex; align-items:center; border-bottom:1px solid #686868; white-space:nowrap; }
.tour-controls button:hover,.tour-controls a:hover { border-color:white; }
.tour-status { color:#b8b8b8; font-size:9px; max-width:110px; }
.hero-sticky.tour-visible .scroll-cue { display:none; }
.hero-sticky.tour-visible .hero-footer { justify-content:space-between; }
.hero-sticky.tour-visible #heroFirst .hero-actions { visibility:hidden; }
.hero-sticky.tour-visible .hero-next { visibility:hidden; }
/* Meaning is an explicit question. The order is never mutated by the selector. */
.amount-choices { display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin:22px 0 4px; border-block:1px solid #c9c9c9; }
.amount-choices button { position:relative; text-align:left; padding:12px 0 12px 13px; border-right:1px solid #dedede; min-height:70px; color:#666666; transition:background .25s,color .25s; }
.amount-choices button:first-child { padding-left:10px; }
.amount-choices button:last-child { border-right:0; }
.amount-choices button span { display:block; font-size:10px; margin-bottom:5px; }
.amount-choices button b { font:23px/1.2 var(--mono); font-weight:400; letter-spacing:-.05em; }
.amount-choices button.active { color:white; background:#080808; }
.amount-choices button:not(.active):hover { color:#080808; background:#f4f4f4; }
.meaning-output h3 { line-height:1.35; }
.meaning-output .answer-number { margin-top:18px; }
.meaning-stage.literal .amount-choices { opacity:.45; pointer-events:none; }
.doc-price .doc-highlight { font-weight:400; }
.doc-price.total .doc-highlight { font-weight:500; }
/* The semantic installation is a piece of typesetting, not a card grid. */
.semantic-installation { border-top:1px solid #080808; margin-top:64px; padding:34px 0 22px; }
.semantic-title { display:flex; justify-content:space-between; align-items:flex-end; gap:25px; }
.semantic-title .eyebrow { color:#666; font-size:11px; letter-spacing:.08em; }
.semantic-title h3 { font-size:clamp(30px,3.7vw,52px); line-height:1.3; margin-top:14px; }
.semantic-switch { display:flex; border-bottom:1px solid #b8b8b8; }
.semantic-switch button { padding:11px 16px; min-height:44px; font-size:11px; color:#666; border-bottom:2px solid transparent; margin-bottom:-1px; }
.semantic-switch button.active { border-bottom-color:#080808; color:#080808; }
.semantic-drawing { position:relative; display:grid; grid-template-columns:1fr .8fr 1fr; align-items:center; padding:46px 5% 34px; }
.semantic-sources { display:grid; gap:18px; }
.semantic-sources>div { display:flex; align-items:baseline; gap:32px; padding-bottom:12px; border-bottom:1px solid transparent; }
.semantic-sources small { font-family:var(--sans); font-size:10px; color:#666; min-width:60px; }
.semantic-sources strong { font-weight:400; font-size:25px; letter-spacing:-.04em; }
.semantic-lines { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; fill:none; stroke:#888; stroke-width:1; overflow:visible; }
.semantic-lines circle { fill:#080808; stroke:#080808; }
.semantic-target { grid-column:3; padding-left:36px; }
.semantic-target small { font-size:10px; color:#666; font-family:var(--sans); }
.semantic-target strong { display:block; font-size:clamp(35px,4.6vw,62px); font-weight:450; letter-spacing:-.06em; line-height:1.4; margin:6px 0; }
.semantic-target>span { font-size:12px; color:#555; }
.semantic-foot { font-size:11px; color:#606060; line-height:1.8; }
.semantic-installation.changing .semantic-lines path { stroke-dasharray:1; stroke-dashoffset:1; animation:semanticJoin .7s var(--ease) forwards; }
@keyframes semanticJoin { to { stroke-dashoffset:0; } }
/* Only the changed digit moves. Numerical state updates immediately. */
.current-number.changed>b { animation:none; filter:none; transform:none; opacity:1; }
.current-number>b { font-variant-numeric:tabular-nums; }
.number-reel { position:relative; display:inline-block; vertical-align:bottom; height:1.25em; line-height:1.25; overflow:hidden; }
.number-reel-track { display:flex; flex-direction:column; line-height:1.25; will-change:transform; }
.number-reel-track>span { display:block; height:1.25em; }
.trust-machine.corrected .trust-branch>i { background:transparent; }
.trust-machine.corrected .trust-branch>i,.trust-machine.corrected .trust-branch>span { border-color:#fff; }
.trust-machine.corrected .trust-branch:after { background:#fff; }
/* The replaceable engine is subordinate to a stable working system. */
.responsibility-rail { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; border-block:1px solid #ffffff30; padding:30px 0; margin:0 0 34px; }
.responsibility-rail>div { min-width:0; }
.responsibility-rail small { font-size:8px; letter-spacing:.13em; color:#b8b8b8; }
.responsibility-rail strong { display:block; font-size:17px; font-weight:450; margin-top:12px; letter-spacing:-.025em; }
.responsibility-rail span { display:block; color:#ababab; font-size:11px; line-height:1.8; margin-top:7px; }
.no-script { position:relative; padding:100px var(--pad) 35px; background:#fff; color:#080808; }
.no-script a { display:block; margin-top:12px; text-decoration:underline; }
@media(min-width:651px) and (max-width:1050px) {
 .hero-actions .hero-platform { display:none; }
 .hero-actions { gap:18px; }
 .hero-skip { font-size:9px; }
 .hero-middle h2 { font-size:6.4vw; }
 .hero-footer { gap:16px; }
 .tour-controls { gap:12px; }
 .tour-status { display:none; }
 .semantic-drawing { grid-template-columns:1fr .5fr 1fr; padding-inline:0; }
 .semantic-sources>div { gap:14px; }
 .semantic-sources strong { font-size:22px; }
 .responsibility-rail { gap:17px; }
 .responsibility-rail strong { font-size:14px; }
 .responsibility-rail span { font-size:10px; }
}
@media(max-width:650px) {
 .hero-track { height:330svh; }
 .hero-sticky { height:100svh; min-height:0; }
 .hero-copy,.hero-middle { max-width:none; top:108px; }
 .hero-copy h1 { font-size:clamp(43px,12.2vw,74px); }
 .hero-middle h2 { font-size:clamp(42px,11.3vw,67px); }
 .hero-actions { flex-wrap:nowrap; gap:15px; }
 .hero-platform { display:none; }
 .hero-skip { font-size:9px; border-color:#777; }
 .hero-extract { top:73%; }
 .hero-result { top:46%; padding:16px 15px 14px; }
 .hero-next { display:none; }
 .hero-footer { bottom:14px; flex-wrap:nowrap; gap:10px; }
 .hero-steps { gap:5px; }
 .hero-steps i { width:8px; }
 .hero-steps button { font-size:8px; min-height:40px; }
 .hero-sticky.tour-visible .hero-footer { flex-wrap:wrap; row-gap:0; }
 .hero-sticky.tour-visible .hero-steps { width:100%; justify-content:center; }
 .tour-controls { width:100%; justify-content:center; gap:22px; font-size:10px; }
 .tour-status { display:none; }
 .tour-controls a,.tour-controls button { min-height:36px; padding:5px 0; }
 .hero-table-row { padding:8px 0; }
 .hero-table-head { padding:8px 0; }
 .hero-table-foot { font-size:7px; margin-top:12px; }
 .hero-middle .hero-small-note { font-size:9px; margin-top:20px; }
 .amount-choices { margin-top:20px; }
 .amount-choices button { padding:10px 0 10px 12px; min-height:63px; }
 .amount-choices button span { font-size:10px; }
 .amount-choices button b { font-size:22px; }
 .semantic-installation { margin-top:32px; padding:27px 0 12px; }
 .semantic-title { align-items:flex-start; }
 .semantic-title .eyebrow { font-size:8px; letter-spacing:.02em; }
 .semantic-title h3 { font-size:29px; margin-top:12px; }
 .semantic-switch { gap:0; align-self:flex-end; }
 .semantic-switch button { font-size:9px; padding:10px 8px; min-height:40px; }
 .semantic-drawing { grid-template-columns:1.05fr .32fr 1fr; padding:30px 0 23px; }
 .semantic-sources { gap:14px; }
 .semantic-sources>div { display:block; padding-bottom:9px; }
 .semantic-sources small { display:block; font-size:8px; margin-bottom:4px; }
 .semantic-sources strong { display:block; font-size:20px; }
 .semantic-lines { height:100%; }
 .semantic-target { padding-left:13px; }
 .semantic-target small { font-size:9px; }
 .semantic-target strong { font-size:29px; white-space:nowrap; margin:9px 0; }
 .semantic-target>span { font-size:10px; }
 .semantic-foot { font-size:10px; }
 .responsibility-rail { grid-template-columns:1fr 1fr; gap:27px 22px; padding:28px 0; margin-bottom:26px; }
 .responsibility-rail strong { font-size:15px; }
 .responsibility-rail small { font-size:7px; }
 .responsibility-rail span { font-size:10px; }
}
@media(max-width:370px) {
 .hero-skip { font-size:8px; }
 .hero-actions { gap:11px; }
 .hero-actions .button { font-size:9px; padding-inline:12px; gap:16px; }
 .hero-copy h1 { font-size:43px; }
 .hero-middle h2 { font-size:40px; }
 .semantic-title h3 { font-size:26px; }
 .semantic-switch button { padding-inline:6px; font-size:8px; }
 .semantic-target strong { font-size:26px; }
 .semantic-sources strong { font-size:18px; }
}
@media(max-width:650px) and (max-height:730px) {
 .hero-copy,.hero-middle,.hero-second { top:93px; }
 .hero-copy .eyebrow { margin-bottom:14px; font-size:8px; }
 .hero-copy h1 { font-size:clamp(38px,11.4vw,62px); line-height:1.17; }
 .hero-middle h2,.hero-second h2 { font-size:clamp(35px,10.5vw,59px); line-height:1.17; }
 .hero-description { margin-top:12px; font-size:10px; }
 .hero-actions { margin-top:14px; }
 .hero-actions .button { min-height:38px; padding-block:8px; }
 .hero-middle .hero-small-note { display:none; }
 .hero-second .hero-description { margin-top:12px; font-size:10px; }
 .hero-result { top:45%; padding:12px 13px 11px; }
 .result-cover { padding-bottom:9px; }
 .result-cover>span { font-size:17px; }
 .hero-table-row { font-size:9px; padding:6px 0; }
 .hero-table-row>:last-child { font-size:10px; }
 .hero-table-head { padding:6px 0; }
 .hero-table-foot { margin-top:10px; font-size:6px; }
 .hero-footer { bottom:9px; }
 .tour-controls { gap:20px; font-size:9px; }
 .hero-steps button { min-height:32px; padding-block:6px; }
 .tour-controls button,.tour-controls a { min-height:32px; }
}
@media(min-width:651px) and (max-height:620px) {
 .hero-middle { top:51%; transform:translateY(-49%); }
 .hero-middle h2 { font-size:clamp(38px,5.9vw,64px); }
 .hero-middle .hero-small-note { margin-top:16px; }
 .hero-next { margin-top:12px; min-height:34px; }
 .hero-actions .hero-platform { display:none; }
 .tour-status { display:none; }
 .hero-steps button { font-size:9px; }
}
@media(prefers-reduced-motion:reduce) {
 .hero-track { height:250svh; }
 .semantic-installation.changing .semantic-lines path { stroke-dasharray:none; stroke-dashoffset:0; animation:none; }
 .number-reel-track { transition:none; }
}
@media(max-width:650px) and (max-height:620px) {
 .hero-result { top:45%; padding:10px 12px; }
 .hero-table-row { padding:4px 0; line-height:1.3; }
 .hero-table-head { padding:4px 0; line-height:1.3; }
 .hero-table-foot { margin-top:8px; line-height:1.4; }
 .result-cover { padding-bottom:8px; }
 .result-cover>span { font-size:16px; }
 .hero-footer { bottom:7px; }
}
/* A decorative overflow must never become a focus-scrollable viewport. */
.hero-sticky { overflow:clip; }
@media(min-width:651px) and (max-height:620px) {
 .hero-sticky { min-height:0; height:100svh; }
 .site-header { height:58px; }
 html { scroll-padding-top:66px; }
 .hero-copy,.hero-middle,.hero-second { top:52%; max-width:48%; transform:translateY(-45%); }
 .hero-copy h1,.hero-middle h2,.hero-second h2 { font-size:clamp(30px,5vw,62px); line-height:1.16; }
 .hero-copy .eyebrow { font-size:7px; margin-bottom:12px; }
 .hero-copy .hero-description { font-size:9px; line-height:1.65; margin-top:12px; }
 .hero-actions { margin-top:14px; gap:16px; }
 .hero-actions .button { min-height:36px; font-size:10px; padding:9px 15px; }
 .hero-skip { font-size:8px; min-height:34px; }
 .hero-middle .hero-small-note { font-size:9px; margin-top:16px; }
 .hero-second .hero-small-note { font-size:9px; margin-top:16px; }
 .hero-next { display:none; }
 .hero-extract { top:67%; min-width:150px; padding:9px 15px; }
 .hero-extract strong { font-size:27px; }
 .hero-result { top:48%; right:var(--pad); width:44%; padding:12px 15px; }
 .result-cover { padding-bottom:8px; }
 .result-cover>span { font-size:16px; }
 .result-cover small { font-size:6px; }
 .hero-table-row { padding:5px 0; line-height:1.4; font-size:9px; }
 .hero-table-row>:last-child { font-size:10px; }
 .hero-table-head { padding:5px 0; line-height:1.3; font-size:8px; }
 .hero-table-foot { margin-top:10px; font-size:6px; }
 .hero-footer { bottom:8px; min-height:32px; }
 .hero-steps button { min-height:32px; font-size:8px; }
 .tour-controls a,.tour-controls button { min-height:32px; font-size:9px; padding-block:4px; }
 .scroll-cue { font-size:8px; }
 .scroll-cue svg { height:28px; }
 .scroll-cue small { font-size:6px; }
}
.fallback-paper { will-change:transform,opacity; }

/* Preserve the original image bytes and provide actual pixels, including on touch. */
.product-dialog { background:#fff; }
.product-viewport { overflow:auto; max-height:65svh; overscroll-behavior:contain; touch-action:pan-x pan-y; scrollbar-gutter:stable; }
.product-viewport.actual-size img { width:3840px; max-width:none; }
.product-viewport:not(.actual-size) { overflow:hidden; scrollbar-gutter:auto; }
.product-viewport:not(.actual-size) img { max-height:65svh; object-fit:contain; }
.product-image-controls { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:14px; font-size:11px; color:#555; }
.product-image-controls button { min-height:44px; border-bottom:1px solid #888; color:#080808; flex-shrink:0; }
.mobile-nav { overflow-y:auto; overscroll-behavior:contain; }

/* Short landscape keeps all three compositions and five result rows in view. */
@media (min-width:500px) and (max-width:650px) and (max-height:420px) {
  html { scroll-padding-top:64px; }
  .site-header { height:58px; }
  .mobile-nav { inset-block-start:58px; }
  .hero-copy,.hero-middle,.hero-second {
    top:74px; left:var(--pad); right:auto; width:44%; max-width:44%; transform:none;
  }
  .hero-copy .eyebrow { font-size:7px; margin-bottom:10px; letter-spacing:0; }
  .hero-copy .tiny-cross { font-size:13px; }
  .hero-copy h1,.hero-middle h2,.hero-second h2 {
    font-size:clamp(32px,6.5vw,40px); line-height:1.14;
  }
  .hero-copy .hero-description,.hero-second .hero-description {
    margin-top:10px; font-size:9px; line-height:1.55;
  }
  .hero-actions { margin-top:10px; gap:12px; }
  .hero-actions .button { min-height:34px; padding:8px 11px; font-size:9px; gap:13px; }
  .hero-actions .button svg { width:14px; height:14px; }
  .hero-skip { min-height:34px; font-size:8px; }
  .hero-small-note { margin-top:13px; font-size:8px; gap:12px; }
  .hero-shade {
    background:linear-gradient(90deg,#080808 1%,#080808ed 25%,#08080850 48%,transparent 70%),linear-gradient(0deg,#080808 1%,transparent 22%,transparent 85%,#08080890);
  }
  .hero-grid { inset:58px var(--pad) 43px; }
  .hero-ghost { top:12%; right:0; font-size:65vw; }
  .orbit-engraving { top:21%; left:48%; right:-5%; bottom:15%; }
  .hero-extract { top:64%; right:var(--pad); min-width:145px; padding:8px 12px; }
  .hero-extract strong { font-size:25px; }
  .hero-result { left:auto; right:var(--pad); width:46%; top:48%; padding:10px 11px; }
  .result-cover { padding-bottom:7px; }
  .result-cover>span { font-size:16px; }
  .result-cover small { font-size:5px; }
  .hero-table-head,.hero-table-row { grid-template-columns:.55fr 1.12fr .75fr .8fr; gap:5px; }
  .hero-table-head { font-size:7px; padding:4px 0; }
  .hero-table-row { font-size:8px; line-height:1.35; padding:5px 0; }
  .hero-table-row>:first-child { font-size:7px; }
  .hero-table-row>:last-child { font-size:9px; }
  .hero-table-foot { font-size:5px; margin-top:8px; gap:7px; }
  .hero-footer,.hero-sticky.tour-visible .hero-footer { bottom:7px; min-height:32px; flex-wrap:nowrap; gap:12px; }
  .hero-sticky.tour-visible .hero-steps { width:auto; justify-content:flex-start; }
  .hero-steps { gap:5px; }
  .hero-steps button { min-height:32px; font-size:8px; }
  .hero-steps i { width:9px; }
  .tour-controls { width:auto; justify-content:flex-end; gap:18px; font-size:9px; }
  .tour-controls a,.tour-controls button { min-height:32px; }
  .scroll-cue { font-size:7px; gap:8px; }
  .scroll-cue small { font-size:6px; }
  .scroll-cue svg { height:23px; }
}

/* The cloud caption travels with its cartridge; independent top values overlapped it. */
.model-cartridge .cloud-space { top:calc(100% + 18px); right:0; left:0; text-align:center; line-height:1.7; white-space:nowrap; pointer-events:none; }
.semantic-target>span { display:block; text-wrap:balance; }

/* Edition 03: ink and white carry the composition; silver marks its structure.
   Warmth belongs to the physical documents. Product captures retain native colour. */
:root { --light-muted:#525252; --dark-muted:#b8b8b8; }
.hero-extract { background:#fff; box-shadow:0 18px 42px #0008; }
.intention { background:#080808; }
.intent-blueprint { opacity:.6; }
.intent-tabs button { color:#a6a6a6; }
.intent-tabs button.active { color:#fff; }
.scan-surround { background:#111; border:1px solid #292929; box-shadow:0 18px 32px #08080812; }
.scan-registration { color:#b8b8b8; }
.machine-boundary { background:#080808; border-color:#696969; box-shadow:none; }
.machine-caption { color:#fff; }
.machine-caption small,.system-stack small { color:#aaa; }
.system-stack>div { background:#101010; border-color:#4b4b4b; box-shadow:none; }
.system-stack span { color:#fff; }
.chip-face { background:#111; }
.workbench { padding:0; border:1px solid #080808; background:#080808; border-radius:2px; box-shadow:0 14px 32px #0808080c; }
.window-bar { height:48px; padding:0 18px; color:#fff; }
.window-bar b { color:#c5c5c5; }
.window-bar i { color:#888; }
.window-bar button { font-size:10px; }
.workbench-tabs { border-bottom-color:#b8b8b8; }
.workbench-tabs button { color:#555; }
.workbench-tabs button.active { color:#080808; border-bottom-color:#080808; }
.official-screen img { display:block; }
.capture-provenance { display:flex; justify-content:space-between; gap:18px; padding-top:13px; font-size:10px; color:#575757; line-height:1.6; }
.capture-provenance i { font-style:normal; margin:0 7px; color:#999; }
.capture-provenance>span:last-child { font:8px/1.6 var(--mono); letter-spacing:.05em; }
.workbench-caption { margin-top:28px; }
.workbench-caption h3 { color:#080808; }
.workbench-caption p { color:#525252; }
.capture-note { color:#555; font:11px/1.8 var(--sans); margin-top:12px; }
@media(max-width:650px) {
 .window-bar { height:42px; padding-inline:12px; }
 .window-bar button { gap:8px; font-size:9px; }
 .capture-provenance { gap:10px; font-size:9px; }
 .capture-provenance>span:last-child { font-size:7px; letter-spacing:0; }
}